A clone of @shadcn's open source application built using the new router, server components, and everything new in Next.js 13, but with Supabase as the backend/auth solution. This project will be kept up to date with the main project as an alternative option to PlanetScale/Next Auth. The below is the README from the main project.
Warning This app is a work in progress. I'm building this in public. You can follow the progress on Twitter @shadcn. See the roadmap below.
This project as an experiment to see how a modern app (with features like authentication, subscriptions, API routes, static pages for docs ...etc) would work in Next.js 13 and server components.
This is not a starter template.
A few people have asked me to turn this into a starter. I think we could do that once the new features are out of beta.
Warning This app is using the unstable releases for Next.js 13 and React 18. The new router and app dir is still in beta and not production-ready. Expect some performance hits when testing the dashboard. If you see something broken, you can ping me @shadcn.
- New
/app
dir, - Routing, Layouts, Nested Layouts and Layout Groups
- Data Fetching, Caching and Mutation
- Loading UI
- Route handlers
- Metadata files
- Server and Client Components
- API Routes and Middlewares
- Authentication using Supabase Auth
- Database on Supabase
- UI Components built using Radix UI
- Documentation and blog using MDX and Contentlayer
- Subscriptions using Stripe
- Styled using Tailwind CSS
- Validations using Zod
- Written in TypeScript
-
Add MDX support for basic pages -
Build marketing pages -
Subscriptions using Stripe -
Responsive styles -
Add OG image for blog using @vercel/og - Dark mode
A list of things not working right now:
GitHub authentication (use email)Prisma: Error: ENOENT: no such file or directory, open '/var/task/.next/server/chunks/schema.prisma'Next.js 13: Client side navigation does not update head- Cannot use opengraph-image.tsx inside catch-all routes
I might add this later. For now, I want to see how far we can get using Next.js only.
If you have some suggestions, feel free to create an issue.
- Install dependencies using pnpm:
pnpm install
- Copy
.env.example
to.env.local
and update the variables.
cp .env.example .env.local
-
Create a Supabase project and copy the environmental variables into
.env.local
. You can follow the official docs to get started. -
Copy the
schema.sql
file from the root of this project into your Supabase project's SQL editor and run it to create the tables. -
Start the development server:
pnpm dev
Licensed under the MIT license.