{
  "id": "aed11ddeff3b7689f06e648e",
  "source": "solid:signals",
  "type": "github-document",
  "title": "getting-started",
  "content": "---\ntitle: Getting started\nuse_cases: \u003e-\n  new project, initial setup, project creation, starter template, first app,\n  quick start, bootstrapping\ntags:\n  - setup\n  - installation\n  - starter\n  - template\n  - quickstart\n  - init\nversion: '1.0'\ndescription: \u003e-\n  Start your first SolidStart project with templates and step-by-step setup.\n  Create, configure, and run your Solid application.\n---\n\nThe easiest way to get started with Solid is to use the SolidStart starter.\nThis starter contains a collection of templates that can be used to quickly bootstrap a new Solid application.\n\n**1. Install SolidStart**\n\nTo start a new project you can initialize SolidStart with the following command:\n\n```package-create\nsolid@latest\n```\n\nThis will create a new directory for your project based on the name you enter.\n\n**2. Choose a template**\n\nWhen you run the command above, SolidStart will prompt you to choose a template for your new application.\nYou can see a [list of these options in the templates repository](https://github.com/solidjs/templates/tree/main/solid-start).\n\n```bash frame=\"terminal\"\n◆  Which template would you like to use?\n│  ● basic\n│  ○ bare\n│  ○ with-solidbase\n│  ○ with-auth\n│  ○ with-authjs\n│  ○ with-drizzle\n│  ○ with-mdx\n│  ○ with-prisma\n│  ○ with-solid-styled\n│  ○ with-tailwindcss\n│  ...\n└\n```\n\nFollowing the prompts, you might be asked questions like whether you want to use Server Side Rendering or TypeScript.\nChoose your desired options to continue.\n\n**3. Install dependencies**\n\nOnce you have chosen your template and configuration options, you can navigate to the directory you created and run the following command to install dependencies:\n\n```package-install-local\n```\n\nAfter this command has finished, your new SolidStart application is ready to go!\n\n**4. Run your application**\n\nTo run your application locally, you can use the following command:\n\n```package-run\ndev\n```\n\nYour application should now be running locally on port 3000.\nYou can view it by navigating to [http://localhost:3000](http://localhost:3000).\n\n:::note\n    SolidStart uses [Vinxi](https://vinxi.vercel.app/) both for starting a development server with [Vite](https://vitejs.dev/) and for building and starting a production server with [Nitro](https://nitro.build/).\n\n    When you run your application, you are actually running `vinxi dev` under the hood.\n\n    You can read more about the [Vinxi CLI and how it is configured in the Vinxi documentation](https://vinxi.vercel.app/api/cli.html).\n:::\n\n## Project files\n\nSolidStart will create a new directory for your project, and populate it with the necessary files and directories to get you started.\nThese files and directories are the basic structure of a SolidStart application, and you can modify them to suit your needs.\nThe default structure of a SolidStart application looks like this:\n\n```\npublic/\nsrc/\n├── routes/\n│   ├── index.tsx\n├── entry-client.tsx\n├── entry-server.tsx\n├── app.tsx\n```\n\n**Note:** Depending on the configuration options you chose when creating your project, your file structure may look slightly different.\nFor example, if you chose to use JavaScript rather than TypeScript, your file extensions will be `.jsx` instead of `.tsx`.\n\nEach directory and file in this structure serves a specific purpose in your SolidStart application:\n- `public/` - contains the publicly-accessible assets for your application.\nThis is where images, fonts, and other files that you want to be accessible to the public should be placed.\n- `src/` - where your Start application code will live.\nIt is aliased to `~/` for importing in your code.\n- `src/routes/` - any files or pages will be located in this directory.\nYou can learn more about the [`routes` folder in the routing section](/solid-start/building-your-application/routing).\n- [`src/entry-client.tsx`](/solid-start/reference/entrypoints/entry-client) - this file is what loads and _hydrates_ the JavaScript for our application on the client side (in browser).\nIn most cases, you will **not** need to modify this file.\n- [`src/entry-server.tsx`](/solid-start/reference/entrypoints/entry-server) - this file will handle requests on the server.\nLike `entry-client.tsx`, in most cases you will **not** need to modify this file.\n- [`app.tsx`](/solid-start/reference/entrypoints/app) - this is the HTML root of your application both for client and server rendering. You can think of this as the shell inside which your application will be rendered.",
  "url": "https://github.com/solidjs/solid-docs/blob/HEAD/src/routes/solid-start/getting-started.mdx",
  "metadata": {
    "path": "src/routes/solid-start/getting-started.mdx",
    "repo": "solidjs/solid-docs",
    "repo_url": "https://github.com/solidjs/solid-docs.git",
    "size": 4535,
    "source_type": "github"
  },
  "hash": "f53592374d06641c432c5e5b5a083216f18e7a7859b69a820324a9b490c8ed94",
  "timestamp": "2026-02-23T11:43:00.194072266+01:00"
}