{"id":16720342,"url":"https://github.com/tomokimiyauci/react-router","last_synced_at":"2026-04-15T07:36:49.358Z","repository":{"id":230856081,"uuid":"779166999","full_name":"TomokiMiyauci/react-router","owner":"TomokiMiyauci","description":"Next generation React router","archived":false,"fork":false,"pushed_at":"2024-05-08T03:03:57.000Z","size":61,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-03-29T01:26:03.386Z","etag":null,"topics":["navigation-api","react","router","url-pattern"],"latest_commit_sha":null,"homepage":"https://jsr.io/@miyauci/react-router","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/TomokiMiyauci.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":".github/CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":".github/SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2024-03-29T07:31:59.000Z","updated_at":"2024-05-08T03:03:59.000Z","dependencies_parsed_at":"2024-05-08T03:34:44.712Z","dependency_job_id":null,"html_url":"https://github.com/TomokiMiyauci/react-router","commit_stats":null,"previous_names":["tomokimiyauci/react-router"],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/TomokiMiyauci/react-router","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TomokiMiyauci%2Freact-router","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TomokiMiyauci%2Freact-router/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TomokiMiyauci%2Freact-router/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TomokiMiyauci%2Freact-router/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/TomokiMiyauci","download_url":"https://codeload.github.com/TomokiMiyauci/react-router/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TomokiMiyauci%2Freact-router/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31831847,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-15T07:17:56.427Z","status":"ssl_error","status_checked_at":"2026-04-15T07:17:30.007Z","response_time":63,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["navigation-api","react","router","url-pattern"],"created_at":"2024-10-12T22:06:45.166Z","updated_at":"2026-04-15T07:36:49.340Z","avatar_url":"https://github.com/TomokiMiyauci.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-router\n\n[![JSR](https://jsr.io/badges/@miyauci/react-router)](https://jsr.io/@miyauci/react-router)\n[![GitHub](https://img.shields.io/github/license/TomokiMiyauci/react-router)](https://github.com/TomokiMiyauci/react-router/blob/main/LICENSE)\n\n[![release](https://github.com/TomokiMiyauci/react-router/actions/workflows/release.yml/badge.svg?branch=main)](https://github.com/TomokiMiyauci/react-router/actions/workflows/release.yml)\n[![standard-readme compliant](https://img.shields.io/badge/readme%20style-standard-brightgreen.svg)](https://github.com/RichardLitt/standard-readme)\n\nNext generation React router.\n\nA minimal router based on\n[URLPattern](https://developer.mozilla.org/en-US/docs/Web/API/URL_Pattern_API)\nAPI and\n[Navigation](https://developer.mozilla.org/en-US/docs/Web/API/Navigation_API)\nAPI. No more `\u003cLink\u003e` or `\u003cA\u003e`.\n\n## Table of Contents \u003c!-- omit in toc --\u003e\n\n- [Install](#install)\n- [Usage](#usage)\n  - [Client Side Navigation](#client-side-navigation)\n  - [Polyfill](#polyfill)\n- [Documentation](#documentation)\n- [Remarks](#remarks)\n  - [URLPatternList](#urlpatternlist)\n- [API](#api)\n- [Contributing](#contributing)\n- [License](#license)\n\n## Install\n\ndeno:\n\n```bash\ndeno add @miyauci/react-router\n```\n\nnpm:\n\n```bash\nnpx jsr add @miyauci/react-router\n```\n\n## Usage\n\nThe basic exclusive routing is as follows:\n\n```tsx\nimport {\n  Route,\n  Router,\n  Switch,\n  useURL,\n  useURLPatternResult,\n} from \"@miyauci/react-router\";\nimport { type ReactNode } from \"react\";\n\nfunction Home(): ReactNode {\n  const url = useURL();\n  const result = useURLPatternResult();\n\n  return \u003cmain\u003eHome\u003c/main\u003e;\n}\ndeclare const About: () =\u003e ReactNode;\ndeclare const NotFound: () =\u003e ReactNode;\n\nfunction App(props: { url?: string | URL }): ReactNode {\n  return (\n    \u003cRouter url={props.url}\u003e\n      \u003cSwitch fallback={\u003cNotFound /\u003e}\u003e\n        \u003cRoute pathname=\"/\"\u003e\n          \u003cHome /\u003e\n        \u003c/Route\u003e\n\n        \u003cRoute pathname=\"/about\"\u003e\n          \u003cAbout /\u003e\n        \u003c/Route\u003e\n      \u003c/Switch\u003e\n    \u003c/Router\u003e\n  );\n}\n```\n\nIt is best practice to specify the `url` on the server side and nothing on the\nclient side.\n\n### Client Side Navigation\n\nIntercept the `navigate` event on client side navigation.\n\nAdd your client entry point:\n\n```ts\nglobalThis.navigation.addEventListener(\"navigate\", (e) =\u003e {\n  // if (shouldNotIntercept(e)) return;\n  e.intercept({\n    async handler() {},\n  });\n});\n```\n\nThis ensures that navigation is done only for URL changes. The `Router` will\nalso subscribe to URL changes and route them reactively.\n\nSee\n[Modern client-side routing: the Navigation API](https://developer.chrome.com/docs/web-platform/navigation-api)\nabout `shouldNotIntercept`.\n\nThis script may be provided by this project in the future.\n\n### Polyfill\n\nThis project relies on a relatively new API.\n\nThe API and Polyfill are as follows:\n\n| API                                                                            | Polyfill                                                               |\n| ------------------------------------------------------------------------------ | ---------------------------------------------------------------------- |\n| [URLPattern](https://developer.mozilla.org/en-US/docs/Web/API/URL_Pattern_API) | [urlpattern-polyfill](https://github.com/kenchris/urlpattern-polyfill) |\n| [Navigation](https://developer.mozilla.org/en-US/docs/Web/API/Navigation_API)  | [@virtualstate/navigation](https://github.com/virtualstate/navigation) |\n\n## Documentation\n\n- [Router](./docs/router.md)\n- [Switch](./docs/switch.md)\n- [Route](./docs/route.md)\n- [Hooks](./docs/hooks.md)\n\n## Remarks\n\nThis chapter supplements the project.\n\n### URLPatternList\n\nThis project is based on the\n[`URLPatternList`](https://pr-preview.s3.amazonaws.com/lucacasonato/urlpattern/pull/166.html#urlpatternlist-class)\ninterface. This API is still Draft, but will be replaced when it is generalized.\nThis should further reduce the bundle size.\n\n## API\n\nSee [jsr doc](https://jsr.io/@miyauci/react-router) for all APIs.\n\n## Contributing\n\nSee [contributing](CONTRIBUTING.md).\n\n## License\n\n[MIT](LICENSE) © 2024 Tomoki Miyauchi\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftomokimiyauci%2Freact-router","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftomokimiyauci%2Freact-router","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftomokimiyauci%2Freact-router/lists"}