Step 1
Download, fork or clone the repo (opens in a new tab) and install dependencies.
git clone https://github.com/The-SaaS-Factory/next-14-saas-boilerplate.git
cd next-14-saas-boilerplate
npm install
Step 2
Create a MySQL DB in your local environment (Xampp, Wamp, Laragon, etc).
Step 3
Copy the .env.example
file to .env
and update the environment variables accordingly.
The DATABASE_URL variable is the connection string to your MySQL DB.
Example: mysql://root:root@localhost:3306/saas-boilerplate
Step 4
Run the prisma commands to push the schema to the database and generate the client.
npx prisma db push
Step 5
Put some data in the database by running the seed command. (Recommended)
Run the seed
npx prisma db seed
Step 6
Run the app in the development mode.
npm run dev --turbo
Step 7
Configure Clerk
Create an new application in https://dashboard.clerk.com/ (opens in a new tab)
- Update in the .env file the "CLERK_SECRET_KEY", "NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY",
- Enable the Organizations option in the Clerk's organizations panel
- Create an webhook and update the "CLERK_WEBHOOK_SECRET" in the .env file IMPORTANT
For Clerk to send the information to your local project(Through webhook) and synchronize the database, you must expose your localhost with services such as ngrok or cloudflare
Whatever tunneling service you use to expose your local host, it must end with this path: /en/api/clerk
- Update the session token, go to the clerk dashboard and update the session token in the Customize session token section, put this
{
"metadata": "{{user.public_metadata}}"
}
This is necessary for the User onboarding to work correctly
Step 8
Create the Super Admin user: In https://localhost:3000 (opens in a new tab) create a new user
In Clerk
- Go to https://dashboard.clerk.com/ (opens in a new tab) and access to your Clerk App
- Edit the user and put in publicMetadata this:
{
"isSuperAdmin": true,
"permissions": ["superAdmin:totalAccess"]
}
For it to work we must have run seed or manually placed the permissions in the permissions table of our database