How to get PostgreSQL Database URL & Integrate with Boilerplate

In this guide, we will guide you on how to connect your SaaS Boilerplate application seamlessly to a powerful PostgreSQL database using Supabase, a popular backend-as-a-service platform.

You'll have your database up and running in no time!

Why Supabase?

Supabase is an open-source Firebase alternative that provides an all-in-one toolkit for building the backend of your SaaS application! 

Here's why it's the best choice if you are looking for a PostgreSQL database URL to integrate with your boilerplate or templates.

• Effortless Setup of a Powerful PostgreSQL Database
• Built-in Authentication for User Management
• Real-Time Data Synchronization
• Automatic API Generation for Easy Integration
• Offers Free Tier and Scalability
• Open Source and Community-Driven

In summary, Supabase is an excellent choice for developers looking for a hassle-free way to integrate a PostgreSQL database into their Next.js Boilerplate applications.

Steps to Integrate Database

Ready to connect your boilerplate or template to a PostgreSQL database? Let's dive into the step-by-step guide:

1. Create a Supabase Account: If you're new to Supabase, visit the Supabase website and create a free account. It's quick and easy!

2. Create New Project: Once logged in, create a new Supabase project. Click on "New Project" to create.

3. Project Name and Password: Provide the project name and generate the password. Remember to copy it; we'll need it in the upcoming step.

After that, It will be provisioning the database and API endpoints. This may take a few minutes

4. Connect to your project: Click the "connect" button on the project dashboard page. Get the connection strings and environment variables for your app.

5. Get PostgreSQL Database URL: Upon clicking "connect," a popup with various connection options will display. Locate the "Database connection String," which will look something like this:

postgres://your_username:your_password@your_host:5432/your_database Copy

Copy the entire connection string. We'll use it in the next step.

6. Set Your Environment Variable: Open your Boilerplate/ Template project folder and Locate the .env file.

Within the .env file, locate the following line and update it with your actual connection string (copied in Step 5). Also, replace the password placeholder with the actual password from Step 3:

DATABASE_URL="your_db_connection_string" Copy

That's it, Now ready to migrate the schema.

Migrate the Schema

Now, let's proceed with the steps:

1. Navigate to the SaaS Boilerplate/ Template project's root directory in your terminal.

2. Run the following command to create the necessary tables in the Supabase PostgreSQL database based on the Prisma schema:

npx prisma db push Copy

3. To interact with the database, we need the Prisma client. Run the following command to generate it:

npx prisma generate Copy

This is it, and we are now done with Database integration.

Important Note: Remember, whenever you update your Prisma schema (the file that defines your database models), you'll need to run npx prisma generate again to keep the Prisma Client in sync with your changes.

You're Done!

That's it! You've successfully connected your SaaS Boilerplate application to a Supabase PostgreSQL database. Now, you can integrate other features that require data storage and retrieval.