# Examples (http://yak.js.org/docs/examples)

> Example projects for yak with Next.js, Vite, TanStack Start, Rsbuild, Solid and Storybook, ready to clone and run from the GitHub repository.

Every example lives in the [`examples`](https://github.com/galaxuslabs/yak/tree/main/examples) folder of the
repository and uses the same setup that the docs describe. The examples use the packages from the repository, so
build them once in the repository root:

```bash
pnpm install
pnpm build && pnpm build:swc
```

Then run `pnpm dev` in an example folder to start it.

## React [#react]

- **Next.js**: [examples/next-js](https://github.com/galaxuslabs/yak/tree/main/examples/next-js) is an App
  Router app with theming through `yak.context.ts`. It runs on webpack with `pnpm dev` and on Turbopack with
  `pnpm dev:turbo`.
- **Vite**: [examples/vite](https://github.com/galaxuslabs/yak/tree/main/examples/vite) is a plain React app
  with the `viteYak` plugin. See the [Vite guide](/docs/vite) for the setup.
- **TanStack Start**: [examples/tanstack-start](https://github.com/galaxuslabs/yak/tree/main/examples/tanstack-start)
  runs `viteYak` next to TanStack Start with React Server Components enabled.
- **Rsbuild**: [examples/rsbuild](https://github.com/galaxuslabs/yak/tree/main/examples/rsbuild) uses the
  `pluginYak` plugin from `@yak/react/rsbuild`. See the [Rsbuild guide](/docs/rsbuild) for the setup.

## Solid [#solid]

- **Vite + Solid**: [examples/vite-solid](https://github.com/galaxuslabs/yak/tree/main/examples/vite-solid)
  uses `@yak/solid` with Solid 2 and the `yak` plugin from `@yak/solid/vite`.

## Storybook [#storybook]

- **Storybook**: [examples/storybook](https://github.com/galaxuslabs/yak/tree/main/examples/storybook) has
  one setup for the Vite builder and one for the webpack builder, both with the `@yak/storybook` addon. Start them
  with `pnpm storybook:vite` or `pnpm storybook:webpack`. See the [Storybook guide](/docs/storybook) for the setup.