@pawcode/routes NPM

@pawcode/routes

@pawcode/routes is a flexible and easy-to-use routing library for web applications, part of the PawCode suite of development tools. It provides a straightforward way to handle client-side navigation, enabling developers to create single-page applications with ease.

Features

Easy integration with any front-end framework or vanilla JavaScript project.
Supports nested and dynamic routing.
Lightweight and optimized for performance.

Installation

Install @pawcode/routes using npm:

npm install @pawcode/routes

Or using yarn:

yarn add @pawcode/routes

Usage

To use @pawcode/routes, first import the library and then define your routes:

// routes.ts
const routes = [
  {
    path: "/",
    componentPath: () => import("./views/Home"),
    componentName: "home-view",
  },
  // ... other routes ...
];

// main.ts
import { initRouter } from "@pawcode/routes";
import { routes } from "routes.ts";

initRouter(routes);

Basic Example

Here's a basic example of how to set up @pawcode/routes in your application:

import initRouter from "@pawcode/routes";

const { navigateTo, router } = initRouter(routes);

// Define your routes
const routes = [
  {
    path: "/about",
    componentPath: () => import("./About"),
    componentName: "about-view",
  },
  // ... more routes ...
];

// Initialize the router
router(routes);

// Navigate programmatically
navigateTo("/about");

API Reference

initRouter(routes: Route[]): Initializes the router with an array of route objects.
navigateTo(url: string): Programmatically navigate to a given path.
router(): Processes the current location and renders the appropriate route.