{"id":13719941,"url":"https://github.com/sandulat/routes-gen","last_synced_at":"2025-04-07T05:07:54.489Z","repository":{"id":39968203,"uuid":"446151905","full_name":"sandulat/routes-gen","owner":"sandulat","description":"Framework agnostic routes typings generator. Remix ☑️ SolidStart ☑️","archived":false,"fork":false,"pushed_at":"2024-05-07T10:40:05.000Z","size":920,"stargazers_count":281,"open_issues_count":8,"forks_count":12,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-04T22:01:54.227Z","etag":null,"topics":["nextjs","remix","routes","solid-js","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sandulat.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-01-09T17:06:58.000Z","updated_at":"2025-03-05T21:27:57.000Z","dependencies_parsed_at":"2023-11-16T01:26:02.761Z","dependency_job_id":"9b31a2ae-e957-41e8-a01d-5fb883181ade","html_url":"https://github.com/sandulat/routes-gen","commit_stats":{"total_commits":42,"total_committers":8,"mean_commits":5.25,"dds":0.2142857142857143,"last_synced_commit":"4fbb1264b7fb76af92207512037b28d2c1a7f015"},"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sandulat%2Froutes-gen","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sandulat%2Froutes-gen/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sandulat%2Froutes-gen/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sandulat%2Froutes-gen/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sandulat","download_url":"https://codeload.github.com/sandulat/routes-gen/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247595334,"owners_count":20963943,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["nextjs","remix","routes","solid-js","typescript"],"created_at":"2024-08-03T01:00:57.989Z","updated_at":"2025-04-07T05:07:54.464Z","avatar_url":"https://github.com/sandulat.png","language":"TypeScript","funding_links":[],"categories":["Utility"],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n    \u003ca href=\"https://github.com/sandulat/routes-gen\" target=\"_blank\"\u003e\n        \u003cimg src=\"https://raw.githubusercontent.com/sandulat/routes-gen/main/assets/routes-gen.png\" width=\"250px\" /\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\u003cp align=\"center\"\u003e\n\u003ca href=\"https://www.npmjs.com/package/routes-gen\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/routes-gen?color=%236A3C8F\u0026label=routes-gen\" alt=\"routes-gen\"\u003e\u003c/a\u003e\n\u003ca href=\"https://www.npmjs.com/package/@routes-gen/remix\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@routes-gen/remix?color=%236A3C8F\u0026label=@routes-gen/remix\" alt=\"@routes-gen/remix\"\u003e\u003c/a\u003e\n\u003ca href=\"https://www.npmjs.com/package/@routes-gen/solid-start\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@routes-gen/solid-start?color=%236A3C8F\u0026label=@routes-gen/solid-start\" alt=\"@routes-gen/solid-start\"\u003e\u003c/a\u003e\n\u003ca href=\"https://github.com/sandulat/routes-gen/blob/main/LICENSE.md\"\u003e\u003cimg src=\"https://img.shields.io/github/license/sandulat/routes-gen?color=%236A3C8F\" alt=\"License\"\u003e\u003c/a\u003e\n\u003ca href=\"https://twitter.com/sandulat\"\u003e\u003cimg src=\"https://img.shields.io/twitter/follow/sandulat?label=Twitter\" alt=\"Twitter\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n## About\n\n`routes-gen` is a framework agnostic CLI tool for routes parsing and generation of a type-safe helper for safe route usage. Think of it as [Prisma](https://github.com/prisma/prisma), but for routes.\n\n## Installation\n\nFirst, you have to install the routes generator itself:\n```\nyarn add routes-gen\n```\n\n## Official Drivers\n\nThe generator works with \"drivers\", which are route parsers for different frameworks.\n\n| Driver                                               | Installation                       |\n|------------------------------------------------------|------------------------------------|\n| [Remix](https://github.com/remix-run/remix)          | `yarn add @routes-gen/remix`       |\n| [SolidStart](https://github.com/solidjs/solid-start) | `yarn add @routes-gen/solid-start` |\n\n## Usage Example\n\nYou can simply run:\n```\nyarn routes-gen -d @routes-gen/remix\n```\n\nIt will parse and export the routes, based on the driver that you've provided.\n\nFor example, the `@routes-gen/remix` driver will export the routes by default to `/app/routes.d.ts`.\n\n\u003e Note that you can change the output path via the `--output` or `-o` flag.\n\nNow you can import the generated `route` helper anywhere and enjoy the typings:\n```ts\nimport { route } from \"routes-gen\";\n\n// Compiles to /products\nroute(\"/products\");\n\n// Compiles to /products/1337\nroute(\"/products/:productId\", {\n    productId: \"1337\",\n});\n```\n\n## Params Types Usage\nYou can use the `RouteParams` type to add typings to your dynamic route parameters/segments. Example:\n\n```ts\nimport { RouteParams } from \"routes-gen\";\n\nconst { productId } = params as RouteParams[\"/products/:productId\"];\n```\n\n**Remix** example:\n```ts\nimport { LoaderFunction, useParams } from \"remix\";\nimport { RouteParams } from \"routes-gen\";\n\nexport const loader: LoaderFunction = async ({ params }) =\u003e {\n  const { productId } = params as RouteParams[\"/products/:productId\"];\n};\n\nexport default function Product() {\n  const { productId } = useParams\u003cRouteParams[\"/products/:productId\"]\u003e();\n\n  return \u003cdiv /\u003e;\n}\n```\n\n## CLI Options\n\n| Option          | Alias | Description                           |\n|-----------------|-------|---------------------------------------|\n| --help          |       | Print the help message and exit       |\n| --version       | -v    | Print the CLI version and exit        |\n| --output        | -o    | The path for routes export            |\n| --driver        | -d    | The driver of handling routes parsing |\n| --watch         | -w    | Watch for changes                     |\n| --post-export   |       | Execute a command after routes export |\n\n## Writing Your Driver\n\nIf there is no driver for your preferred framework, you can write your own. For example, create a simple `driver.js` file in your project, with the following content:\n\n```js\nmodule.exports = {\n    // Where to export the typings if the \"output\" flag was not provided.\n    defaultOutputPath: \"src/routes.d.ts\",\n    \n    // The routes parser. Must export and array of routes matching the { path: string } interface.\n    routes: async () =\u003e {\n        return [\n            {\n                path: \"/products\",\n            },\n            {\n                path: \"/products/:productId\", // Note that the dynamic segments must match the :myVar pattern.\n            },\n        ];\n    },\n\n    // The paths to be watched for changes. Must return and array of relative paths.\n    watchPaths: async () =\u003e {\n        return [\"/my-routes/**/*.{ts,tsx,js,jsx}\"];\n    },\n}\n```\n\nNow you can easily use it:\n\n```\nroutes-gen -d driver.js\n```\n\nYou can also publish it to npm, install it, and use it as a package:\n\n```\nroutes-gen -d my-driver-package\n```\n\n\u003e **Please consider submitting your drivers to this repository.**","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsandulat%2Froutes-gen","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsandulat%2Froutes-gen","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsandulat%2Froutes-gen/lists"}