{
  "id": "1e45dd063fb1dad109bfd1f6",
  "source": "solid:signals",
  "type": "github-document",
  "title": "installation-and-setup",
  "content": "---\ntitle: Installation and setup\nuse_cases: \u003e-\n  starting new project, initial setup, configuring routing, spa applications,\n  client-side routing\ntags:\n  - setup\n  - installation\n  - configuration\n  - spa\n  - routing\n  - getting-started\nversion: '1.0'\ndescription: \u003e-\n  Learn how to install and configure Solid Router for client and server-side\n  routing in your single-page applications with step-by-step setup guide.\n---\n\nSolid Router is the universal router for Solid which works for rendering on the client or the server.\nIt was inspired by and combines paradigms of [React Router](https://reactrouter.com/en/main) and the [Ember Router](https://guides.emberjs.com/release/routing/).\n\nA router provides a way to change a user's view based on the URL in the browser.\nThis allows a \"single-page\" application to simulate a traditional multipage site.\nTo use Solid Router, components called Routes that depend on the value of the URL (the \"path\") are specified, and the router handles the mechanism of swapping them in and out.\n\n## Setup\n\nTo get started with Solid Router, install it using your preferred package manager.\n\n```package-install\n@solidjs/router\n```\n\n## Configure the routes\n\nThe [`Router`](/solid-router/reference/components/router) component is the root component of the router.\nIt is responsible for managing the URL and rendering the appropriate [`Route`](/solid-router/reference/components/route) based on the URL.\n\nTo configure your routes, import the `Router` component and then start the application by rendering the router component.\n\n```jsx\nimport { render } from \"solid-js/web\";\nimport { Router } from \"@solidjs/router\";\n\nconst wrapper = document.getElementById(\"app\");\n\nif (!wrapper) {\n  throw new Error(\"Wrapper div not found\");\n}\n\nrender(() =\u003e \u003cRouter /\u003e, wrapper)\n```\n\nThis sets up the router that will match on the url and render the appropriate route.",
  "url": "https://github.com/solidjs/solid-docs/blob/HEAD/src/routes/solid-router/getting-started/installation-and-setup.mdx",
  "metadata": {
    "path": "src/routes/solid-router/getting-started/installation-and-setup.mdx",
    "repo": "solidjs/solid-docs",
    "repo_url": "https://github.com/solidjs/solid-docs.git",
    "size": 1883,
    "source_type": "github"
  },
  "hash": "41f7cc7d8e058a228a97cb1174fa097b35b02df63d1f0a24af94d3e17a3abaf4",
  "timestamp": "2026-02-23T11:43:00.192182244+01:00"
}