HanDev PlatformShared

Challenge

With 3–4 SPAs on the same stack, copying the header, sidebar and auth client between them is an anti-pattern. We needed a shared design system and auth client as npm packages that could be adopted and updated without friction.

What We Did

• @handev/tailwind-preset — shared Tailwind preset (colours, fonts, breakpoints, components).
• @handev/platform-auth — PlatformAuthClient (frontend) and PlatformAuthVerifier (backend: JWKS verification). Triple retry on 401.
• @handev/platform-ui — PlatformProvider, PlatformLayout, Header, Footer, ServiceSwitcher, UserMenu, AuthGuard, PlatformSidebarGroup, PlatformSidebarItem, MobileSidebarTrigger.
• Auto-versioning in GitLab CI: major.minor in package.json; CI appends PIPELINE_IID as patch.
• TypeScript types and ESM out of the box. tsup builds .js + .d.ts into dist/.

Result

• Single source of truth for UI and auth across the entire platform.
• Version bump = git push → CI publishes automatically.
• Each service updates via pnpm update @handev/*.