A Practical Guide to Supabase: Setting up a Database, Auth, and Integrating Resend

In modern full-stack development and vibe coding workflows, Supabase is no longer just “the open-source Firebase alternative” – it’s become a full development platform. You get a production-grade Postgres database plus powerful Auth, auto-generated APIs, and real-time subscriptions.

That’s why HiCyou uses Supabase as both its database and Auth solution.

One common pain point, though, is handling email confirmation for user sign-ups. Supabase’s built-in email service is great for quick tests, but it has a low sending limit and often lands in the spam folder.

In this guide, I’ll walk you through:

1. Registering and creating a Supabase project
2. Enabling and configuring Auth
3. Integrating Resend (one of the most popular email services for developers today) so your verification emails actually reach inboxes reliably.

---

Step 1: Create Your Supabase Database

First, you’ll need a Supabase organization.

1. Go to supabase.com.
2. Sign in with GitHub or register with email.
3. Create an organization and choose a plan. For a new project, the Free Plan is usually more than enough. When you eventually need to upgrade, it typically means your product is doing pretty well.

Next, create a project:

1. Fill in project details:
   • Name: Give your project a name (for example, My SaaS App).
   • Database Password: Write this down somewhere safe. This is your main database password and you won’t be able to view it again later.
   • Region: Pick a region close to your users (for example, if your users are in Asia, Singapore or Tokyo is usually a good choice).
2. Click "Create new project".

Step three is to understand how to connect to your database:

1. Click the Connect button at the top.
2. Under Method, select Transaction pooler. This option works well across both IPv4 and IPv6 environments and is generally more compatible with various servers and local dev setups.
3. Copy the connection string, and remember to replace [YOUR-PASSWORD] with the database password you just set.

---

Step 2: Configure Auth (Authentication)

Building a proper user system – especially the login flow – is harder than it looks. Implementing basic signup and login is easy; what’s difficult is making the system secure, reliable, and resistant to abusive mass registrations.

Supabase Auth gives you a solid infrastructure for this. If you build on top of it, you can pretty quickly get to a login system that’s “about 9/10” in terms of security without reinventing everything yourself.

Once your project is created, you’ll land in the Dashboard. Supabase enables Auth by default, but we’ll double-check the settings.

1. In the left sidebar, click Authentication.
2. Go to Sign In / Providers.
3. You’ll see that Email is Enabled by default.
   • Default email behavior:
     • If you don’t configure a custom SMTP server, Supabase will send emails from [e-mail].
   • The catch: This default sender is convenient, but it has strict hourly sending limits and a high chance of landing in Gmail/Outlook spam folders. That’s exactly why we want to integrate Resend instead.

Enable Google, GitHub, etc. Login

GitHub and Google are two of the most common login options for developers, and enabling them already covers a large portion of users’ expectations.

Click the corresponding provider icon – we’ll use GitHub as an example here:

1. Click the GitHub Enabled toggle/button, then copy the Callback URL.
2. Go to https://github.com/settings/apps/new and create a new GitHub App.

1. Click Register application to create the OAuth app.

1. Click Generate a new client secret.

1. Copy the Client ID and Client secret back into the GitHub provider settings in Supabase Auth and save.

---

Step 3: Integrate Resend Email Service (Key Step)

Resend is currently one of the best email sending services for developers: simple API, great DX, and excellent deliverability. Supabase’s own docs also recommend using it to take over email sending.

3.1 Set Things Up in Resend

1. Go to resend.com and sign up.
2. Add a domain:
   • Add a domain you own (for example, myapp.com).
   • Important: Resend will show you several DNS records (DKIM, SPF, DMARC). Go to your DNS provider (Cloudflare, GoDaddy, Namecheap, etc.) and add these as TXT records.
   • Wait for verification to pass (typically anywhere from a few minutes to a few hours).
3. Get an API Key:
   • In the Resend dashboard, go to API Keys -> Create API Key.
   • Choose permission "Sending access".
   • Copy the key that starts with re_ and keep it safe.

3.2 Configure Supabase to Use Resend

Back in the Supabase Dashboard:

1. Click Project Settings (gear icon in the lower left).
2. Go to Authentication -> SMTP Settings.
3. Toggle Enable Custom SMTP to ON.
4. Fill in the fields as follows:

Field	Value	Description
Sender Email	[e-mail]	Must be an email on the domain you verified
Sender Name	My App Team	Display name shown to users in their email client
Host	smtp.resend.com	Resend’s SMTP server
Port Number	465	SSL port
Username	resend	This is fixed – always use resend
Password	re_12345...	Paste the API Key you generated in Resend

1. Click Save.

---

Step 4: Customize Email Templates (Optional)

Now that the email pipeline is wired up, you can tweak the actual email content.

1. Go back to Authentication -> Email Templates.
2. Edit templates like "Confirm Your Signup" or "Reset Password".
3. Templates support HTML. Just make sure you keep variables like {{ .ConfirmationURL }} – this is the link users click to confirm their account.

Conclusion

You’re welcome to use https://github.com/hicyoucom/hicyou to spin up your own AI-powered link directory site.

Demo: https://hicyou.com

via: https://blog.hicyou.com/en/supabase-setup/