Supabase Deployment

This guide provides step-by-step instructions for deploying your Supabase project. Follow these steps to set up your remote Supabase environment, link it to your local project, and push your database structure to the cloud.

1. Create a Supabase Account

If you don't already have one, sign up for a Supabase account.

2. Create a New Project

Create a new project and wait for Supabase to initialize. You'll know it's ready when you see the following screen:

3. Link to Remote Supabase Project

Navigate to your local Supabase directory:

cd apps/web/supabase

Before linking, log in to your Supabase account locally. The following command will open your browser for automatic login (ensure you're already logged into Supabase in your browser):

supabase login

To link your local Supabase project to the remote project, open Project Settings and copy the Reference ID (your project ID). Then run the following command and enter your database password when prompted:

supabase link --project-ref <project-id>

Upon successful linking, you'll see a confirmation message:

4. Push Database to Remote

Run the following command to push your local database structure to the remote project:

supabase db push

You should now see all the tables in your Supabase dashboard.

5. Enable Webhooks

Navigate to Database > Webhooks , then click the Enable webhooks button.

6. Configure Site URL

Navigate to Authentication > URL Configuration in your Supabase dashboard and set the Site URL.

7. Create Webhooks

Navigate to SQL Editor, Copy the following code and execute it

-- Triggered after deleting an account
create trigger "accounts_teardown" after delete
on "public"."accounts" for each row
execute function "supabase_functions"."http_request"(
  'https://next-saas-starter-kit.zto.dev/api/db/webhook',
  'POST',
  '{"Content-Type":"application/json", "X-Supabase-Event-Signature":"WEBHOOKSECRET"}',
  '{}',
  '5000'
);

-- Triggered after deleting a subscription
create trigger "subscriptions_delete" after delete
on "public"."subscriptions" for each row
execute function "supabase_functions"."http_request"(
  'https://next-saas-starter-kit.zto.dev/api/db/webhook',
  'POST',
  '{"Content-Type":"application/json", "X-Supabase-Event-Signature":"WEBHOOKSECRET"}',
  '{}',
  '5000'
);

-- Triggered after inserting an invitation
create trigger "invitations_insert" after insert
on "public"."invitations" for each row
execute function "supabase_functions"."http_request"(
  'https://next-saas-starter-kit.zto.dev/api/db/webhook',
  'POST',
  '{"Content-Type":"application/json", "X-Supabase-Event-Signature":"WEBHOOKSECRET"}',
  '{}',
  '5000'
);

Navigate to Database > Webhooks , You can see the results below.

8. Set Up Third-Party Provider Login

Go to Authentication > Providers in your Supabase dashboard.

Enable the third-party providers you wish to use. For example, to set up Google OAuth:

• Enable Google provider
• Enter your Google OAuth credentials

For detailed instructions on setting up social logins, refer to the Supabase documentation.

9. Configure SMTP Settings (Optional)

To use your own SMTP server instead of the built-in email service:

• Go to Project Settings > Authentication > SMTP Settings
• Enable Custom SMTP
• Enter your SMTP server details

10. Default Super Admin Account

During initialization (when you run supabase db push), a default super admin account is created:

The default super admin account credential is:

• Email: admin@zto.dev
• Password: changeme

Please ensure you change these credentials immediately after your first login.

11. Supabase Email Templates

We provide several out-of-the-box email templates, including:

• Confirm signup
• Invite user
• Magic Link
• Change Email Address
• Reset Password

You can find these templates in the apps/web/supabase/templates folder. Copy the HTML code for each template into the corresponding Source field in Supabase's Email Templates section (Authentication > Email Templates). You can preview the templates in the Supabase dashboard.

For more information on email templates, refer to the Supabase documentation.

By following these steps, you'll have successfully set up and configured your Supabase project for your application.