A fullstack template using Next.js, Supabase, Tailwind CSS (shadcn/ui), and TypeScript.
- ๐ Next.js 14 with
/app
router and SSR - ๐ Supabase for auth and database
- ๐จ Tailwind CSS with shadcn/ui
- ๐ TypeScript support throughout, including auto-generated types for Supabase tables
- โ๏ธ Email signup and login using PKCE flow with @supabase/ssr
- ๐ Dark/light mode using next-themes
- ๐ Protected routes via Next.js middleware
- ๐ก๏ธ Protected CRUD operations via row level security
- ๐ Toast notifications
- ๐ฑ Responsive layouts
- ๐ Example pages with metadata and React context providers
Coming soon (please make a PR if you want to contribute)...
- ๐
/docs
pages - ๐ OAuth logins
- ๐งช Database tests for RLS policies
Clone the repo, then install all dependencies using yarn
:
yarn install
Start a local supabase instance. This will download the latest docker image and start a local instance of supabase.
yarn supabase start
Create a .env.local
file with the enviroment variables defined in .env.local.example
. The NEXT_PUBLIC_SUPABASE_URL
and NEXT_PUBLIC_SUPABASE_ANON_KEY
defined in .env.local.example
should work for all local supabase instances. If you wish to use a remote supabase instance, the public Supabase URL and API key can be found in your dashboard.
Start the local next.js server:
yarn dev
If you wish to reset your local supabase database, run the command below. This will run any migrations in supabase/migrations
and reset the database to the initial state defined in supabase/seed.sql
.
yarn supabase db reset
Note that signups will require email confirmation by default. If you are running Supabase locally, you can find an Inbucket server at http://localhost:54324/ that will store all emails sent by your local Supabase instance.