fix: derive router basename from base href at runtime @W-21338965@ (#154)

fix: derive router basename from <base href> at runtime

Add guidance to building-ui-bundle-frontend skill to always derive
the client-side router basename from the document's <base href> tag
instead of hardcoding it.

Author: k-j-kim

skills/building-ui-bundle-frontend/SKILL.md

@@ -43,6 +43,15 @@ Before finishing, confirm: Did I update `appLayout.tsx` with real nav items and
 
 Use a single router package. With `createBrowserRouter` / `RouterProvider`, all imports must come from `react-router` (not `react-router-dom`).
 
+If the app uses a client-side router (React Router, Remix Router, Vue Router, etc.), always derive basename / basepath / base from the document's `<base href>` tag at runtime. Never hardcode the basename:
+
+```js
+const basename = document.querySelector('base')
+  ? new URL(document.querySelector('base').href).pathname.replace(/\/$/, '')
+  : '/';
+const router = createBrowserRouter(routes, { basename });
+```
+
 ### Component Library and Styling
 
 - **shadcn/ui** for components: `import { Button } from '@/components/ui/button';`