Connecting to Supabase

Overview

This guide will walk you through the process of connecting your Next.js 14 SaaS application to Supabase using Prisma ORM. You'll learn how to set up a new project in Supabase, retrieve the necessary connection string, and configure it in your application.

Step 1: Create a Supabase Project

- Visit the Supabase website and sign in to your account or sign up if you don't have an account yet.

- Once logged in, navigate to the Supabase dashboard and click on "New Project". Fill out the project details including project name, database password, and region. Click "Create New Project" and wait for your project to be initialized. This can take a few minutes.

Step 2: Obtain Your Supabase Connection String

- Once your project is ready, select it from the Supabase dashboard. Go to the "Settings" tab and then click on "Database".

- In the "Database" settings, look for the "Connection Info" section. Copy the connection string provided there. It usually starts with postgres://.

Step 3: Edit .env File

With your connection string in hand, edit the following .env line.

Step 4: Generate Prisma

Run the following line in your terminal to generate prisma schema. Please make sure to run this while your Nextjs application is off.

Step 5: Push Schema to Database

After setting up your Prisma schema and generating the Prisma client, run the following command in your project's root directory: