| 1 | --- |
| 2 | title: SolidStart |
| 3 | description: Package SolidStart SSR and prerendered assets for a Neon Function Fetch entry. |
| 4 | sidebar: |
| 5 | order: 7 |
| 6 | --- |
| 7 | |
| 8 | `Neon.Website.SolidStart` builds SolidStart through Nitro's Node target and adapts |
| 9 | its handler to Node 24 Fetch on Neon Functions. SSR and public assets share a |
| 10 | Function ZIP; the deployment is not a listening server, container, or S3 website. |
| 11 | |
| 12 | ## Prepare the app |
| 13 | |
| 14 | Use a compatible SolidStart app or the |
| 15 | [runnable SolidStart example](https://github.com/alchemy-run/alchemy/tree/main/examples/neon-website-solidstart). |
| 16 | Configure [deployment credentials](/neon/setup), then install in the app directory: |
| 17 | |
| 18 | Install [Alchemy and its matching Effect dependencies](/getting-started) first; |
| 19 | use Node 24 for this build toolchain. |
| 20 | |
| 21 | ```sh |
| 22 | pnpm add -D @alchemy.run/frontend-frameworks @vercel/nft |
| 23 | ``` |
| 24 | |
| 25 | Keep `solidStart()` from `@solidjs/start/config` in `vite.config.*`. Do not add |
| 26 | `nitroV2Plugin()`: Alchemy owns the Nitro plugin and its preset. Use the resource's |
| 27 | `nitro` prop for serializable options such as prerendering and route rules. |
| 28 | |
| 29 | ## Define the stack |
| 30 | |
| 31 | ```typescript |
| 32 | // alchemy.run.ts |
| 33 | import * as Alchemy from "alchemy"; |
| 34 | import * as Neon from "alchemy/Neon"; |
| 35 | import * as Effect from "effect/Effect"; |
| 36 | |
| 37 | export default Alchemy.Stack( |
| 38 | "NeonSolidStart", |
| 39 | { providers: Neon.providers(), state: Alchemy.localState() }, |
| 40 | Effect.gen(function* () { |
| 41 | const site = yield* Neon.Website.SolidStart("Web", { |
| 42 | rootDir: ".", |
| 43 | }); |
| 44 | return { url: site.url }; |
| 45 | }), |
| 46 | ); |
| 47 | ``` |
| 48 | |
| 49 | The framework handler receives SSR and API requests; prerendered files are served |
| 50 | from the packaged public output. Server code can read private `env` values from |
| 51 | `process.env`. Vite public variables are browser-visible build inputs, not secrets. |
| 52 | |
| 53 | ## Develop and deploy |
| 54 | |
| 55 | ```sh |
| 56 | pnpm exec alchemy dev |
| 57 | pnpm exec alchemy deploy |
| 58 | pnpm exec alchemy destroy |
| 59 | ``` |
| 60 | |
| 61 | Run separately, destroying when finished. Native dev uses SolidStart's dev server |
| 62 | and HMR, returns a local URL, and creates no implicit Project or Function. Append |
| 63 | `.pipe(Alchemy.remote())` to the Website Effect to opt into live deployment during dev. |
| 64 | |
| 65 | Live deploy creates an Ohio Project if no scope is supplied. Pass either |
| 66 | `project` or `branch` for an existing backend; choose Ohio for storage. See |
| 67 | [scope and credentials](/neon/frontend/vite#scope-and-credentials) for branch |
| 68 | selection and token boundaries. |
| 69 | |
| 70 | :::caution[Deployment limits] |
| 71 | Complete live framework acceptance remains unverified. New active deployments |
| 72 | have continued serving old code/env in Neon probes. Nitro route rules do not |
| 73 | provision a CDN or durable shared cache here, and custom-domain registration is |
| 74 | not TLS validation. See the |
| 75 | [shared deployment limits](/neon/frontend/vite#environment-and-deployment-limits). |
| 76 | ::: |
| 77 | |
| 78 | ## Reference |
| 79 | |
| 80 | - [SolidStart API](/providers/neon/website/solidstart) |
| 81 | - [Runnable SolidStart example](https://github.com/alchemy-run/alchemy/tree/main/examples/neon-website-solidstart) |