⚡️Next.js, Supabase, Tailwind, shadcn⚡️The Last Next.js and Supabase Starter You Will Ever Need
The Last Next.js and Supabase Starter You Will Ever Need
Features · Clone and run locally · Documentation · Feedback and issues
@
prefixYou'll first need a Supabase project which can be made via the Supabase dashboard
Create a Next.js app using the Supabase Starter template npx command
pnpm create next-app -e https://github.com/michaeltroya/supa-next-starter
# or
npx create-next-app -e https://github.com/michaeltroya/supa-next-starter
Use cd
to change into the app's directory
cd name-of-new-app
Rename .env.local.example
to .env.local
and update the following:
NEXT_PUBLIC_SUPABASE_URL=[INSERT SUPABASE PROJECT URL]
NEXT_PUBLIC_SUPABASE_ANON_KEY=[INSERT SUPABASE PROJECT API ANON KEY]
Both NEXT_PUBLIC_SUPABASE_URL
and NEXT_PUBLIC_SUPABASE_ANON_KEY
can be found in your Supabase project's API settings
You can now run the Next.js local development server:
pnpm run dev
The starter kit should now be running on localhost:3000.
Check out the docs for Local Development to also run Supabase locally.
Websites started using this template:
pnpm dev
— Starts the application in development mode at http://localhost:3000
.pnpm build
— Creates an optimized production build of your application.pnpm start
— Starts the application in production mode.pnpm type-check
— Validate code using TypeScript compiler.pnpm lint
— Runs ESLint for all files in the src
directory.pnpm format-check
— Runs Prettier and checks if any files have formatting issues.pnpm format
— Runs Prettier and formats files.pnpm test
— Runs all the jest tests in the project.pnpm test:ci
— Runs all the jest tests in the project, Jest will assume it is running in a CI environment.pnpm analyze
— Builds the project and opens the bundle analyzer.TypeScript is pre-configured with custom path mappings. To import components or files, use the @
prefix.
import { Button } from '@/components/ui/Button'
// To import images or other files from the public folder
import avatar from '@/public/avatar.png'
This starter uses pnpm by default, but this choice is yours. If you'd like to switch to Yarn/npm, delete the pnpm-lock.yaml
file, install the dependencies with Yarn/npm, change the CI workflow, and Husky Git hooks to use Yarn/npm commands.
This project is licensed under the MIT License - see the LICENSE.md file for more information.
Please file feedback and issues here.