Nebulous Program Mechanic

    hookrouter-react
    TypeScript icon, indicating that this package has built-in type declarations

    1.3.1 • Public • Published

    hookrouter-react

    NOTE: This is a patched version from the original hookrouter package.

    This package does the following:

    • fixes syntax errors
    • uses rollup instead of webpack
    • integrates eslint
    • integrates babel

    The modern alternative to react-router.

    Tested from React 16.8.1 upwards.

    How to install

    Well, this is straightforward:

    npm i hookrouter-react
    

    Documentation

    Detailed documentation about how to use hookrouter can be found here

    A quick example

    import {useRoutes} from 'hook-router';
    
    const routes = {
        '/': () => <HomePage />,
        '/about': () => <AboutPage />,
        '/products': () => <ProductOverview />,
        '/products/:id': ({id}) => <ProductDetails id={id} />
    };
    
    const MyApp = () => {
        const routeResult = useRoutes(routes);
    
        return routeResult || <NotFoundPage />;
    }

    Routes are defined as an object. Keys are the routes, which are matched against the URL, the values need to be functions that are called when a route matches. You may define placeholders in your routes with :something which will be forwarded as props to your function calls so you can distribute them to your components.

    The hook will return whatever the route function returned, so you may also return strings, arrays, React fragments, null - whatever you like.

    Keywords

    none

    Install

    npm i hookrouter-react

    DownloadsWeekly Downloads

    8

    Version

    1.3.1

    License

    MIT

    Unpacked Size

    187 kB

    Total Files

    17

    Last publish

    Collaborators

    • sscaff1