https://github.com/linkb15/turborepo-shadcn-ui-tailwind-4
This template is for creating a monorepo with Turborepo, shadcn/ui, tailwindcss v4, and react v19.
https://github.com/linkb15/turborepo-shadcn-ui-tailwind-4
eslint nextjs nextjs-template nextjs15 react react19 react19-starter reactjs shadcn-ui tailwindcss tailwindcss-v4 turbopack turborepo typescript
Last synced: 2 months ago
JSON representation
This template is for creating a monorepo with Turborepo, shadcn/ui, tailwindcss v4, and react v19.
- Host: GitHub
- URL: https://github.com/linkb15/turborepo-shadcn-ui-tailwind-4
- Owner: linkb15
- Created: 2025-02-18T04:32:53.000Z (2 months ago)
- Default Branch: main
- Last Pushed: 2025-02-18T08:50:36.000Z (2 months ago)
- Last Synced: 2025-02-18T09:33:08.607Z (2 months ago)
- Topics: eslint, nextjs, nextjs-template, nextjs15, react, react19, react19-starter, reactjs, shadcn-ui, tailwindcss, tailwindcss-v4, turbopack, turborepo, typescript
- Language: TypeScript
- Homepage: https://turborepo-shadcn-tailwind.vercel.app/
- Size: 169 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
[![GitHub][opengraph-image]][opengraph-image-url]
# shadcn/ui and tailwindcss v4 monorepo template
This template is for creating a monorepo with Turborepo, shadcn/ui, tailwindcss v4, and react v19.
## One-click Deploy
You can deploy this template to Vercel with the button below:
[](https://vercel.com/new/clone?build-command=cd+..%2F..%2F+%26%26+pnpm+turbo+build+--filter%3Dweb...&demo-description=This+is+a+template+Turborepo+with+ShadcnUI+tailwindv4&demo-image=%2F%2Fimages.ctfassets.net%2Fe5382hct74si%2F2JxNyYATuuV7WPuJ31kF9Q%2F433990aa4c8e7524a9095682fb08f0b1%2FBasic.png&demo-title=Turborepo+%26+Next.js+Starter&demo-url=https%3A%2F%2Fexamples-basic-web.vercel.sh%2F&from=templates&project-name=Turborepo+%26+Next.js+Starter&repository-name=turborepo-shadcn-tailwind&repository-url=https%3A%2F%2Fgithub.com%2Flinkb15%2Fturborepo-shadcn-ui-tailwind-4&root-directory=apps%2Fweb&skippable-integrations=1)
## Usage
in the root directory run:
```bash
pnpm install
pnpm dev
```
## Adding components
To add components to your app, run the following command at the root of your `web` app:
```bash
pnpm dlx shadcn@canary add button -c apps/web
```
This will place the ui components in the `packages/ui/src/components` directory.
## Tailwind
Your `globals.css` are already set up to use the components from the `ui` package which is imported in the `web` app.
## Using components
To use the components in your app, import them from the `ui` package.
```tsx
import { Button } from '@workspace/ui/components/ui/button';
```
## More Resources
- [shadcn/ui - Monorepo](https://ui.shadcn.com/docs/monorepo)
- [Turborepo - shadcn/ui](https://turbo.build/repo/docs/guides/tools/shadcn-ui)
- [TailwindCSS v4 - Explicitly Registering Sources](https://tailwindcss.com/docs/detecting-classes-in-source-files#explicitly-registering-sources)
[opengraph-image]: https://turborepo-shadcn-tailwind.vercel.app/opengraph-image.png
[opengraph-image-url]: https://turborepo-shadcn-tailwind.vercel.app/