A lightweight, type-safe client-side router for JavaScript and TypeScript applications.
npm install 0x1-routerA lightweight, type-safe client-side router for JavaScript and TypeScript applications.
- ð Simple client-side routing
- ð Type-safe with full TypeScript support
- ðĶ JSX-compatible Link component
- ðŠ React-style hooks API
- ðŠķ Tiny footprint with zero dependencies
- ðŊ History API integration
``bashUsing bun
bun add 0x1-router
Basic Usage
`typescript
import { Link, Route, useRouter } from '0x1-router';// Navigation with Link component
function Nav() {
return (
);
}
// Programmatic navigation
function HomePage() {
const { navigate } = useRouter();
const goToAbout = () => {
navigate('/about');
};
return (
Home Page
);
}// Route definition and rendering
const router = useRouter();
router.addRoute({
path: '/',
component: HomePage,
exact: true
});
router.addRoute({
path: '/about',
component: AboutPage
});
// Render current route
function App() {
return (
);
}
`API Reference
$3
####
Link
JSX component for navigation links.Props:
-
href: string - The target path
- className?: string - CSS class name
- children: any - Link content####
Route
Renders the component for the current route.$3
####
useRouter()
Returns router utilities:
- navigate(path: string) - Navigate to a path
- currentPath: string - Current route path
- addRoute(route: Route) - Add a route definition
- getCurrentRoute() - Get current route object$3
####
Route
`typescript
interface Route {
path: string;
component: () => JSX.Element;
exact?: boolean;
}
``MIT