Supabase Overview

What is Supabase?

Supabase is a powerful and user-friendly Backend-as-a-Service platform built on PostgreSQL. It provides developers with a complete suite of backend tools needed for modern application development, including:
  • 🌐 Database (PostgreSQL) - Powerful relational database with real-time data synchronization
  • 🔐 Authentication - Complete user login and registration system supporting multiple login methods
  • 🗂️ Storage - Secure file storage service for managing images, documents, and other resources
  • ⚡ Edge Functions - Serverless cloud functions for handling complex backend logic

Integrating Supabase with Readdy

Once you connect Supabase to your Readdy project, you can add Database, Authentication, Storage, and Edge Functions to your projects. Zero coding needed - Readdy executes automatically.

Supabase Pricing

Supabase offers a generous free tier that’s sufficient for prototyping and small to medium projects. If you need more powerful features or resources in the future, you can upgrade to the corresponding paid plans in Supabase. At this stage, you can experience the Supabase and Readdy integration at zero cost!

Authorization

Connecting Supabase with Readdy requires just a simple click. Since Supabase is a separate platform, you’ll need a Supabase account. Don’t worry - Readdy will guide you through the entire process. Supabase offers a free tier, so you can add it to your project at no cost initially.

Step 1: Connect

In Readdy, you can proactively click the integration feature at the top and select Supabase to connect.
Navigate to Supabase integration in the top navigation bar
When you need Supabase services, the AI will provide relevant prompts, and you can click the connection button in the conversation to proceed.
Navigate to Supabase integration in the chat

Step 2: Configure

If you haven’t logged into your Supabase account, please sign in or register first.
Once complete, Supabase will prompt for Readdy authorization. Next, you’ll select a Supabase organization to connect with Readdy.
Upon successful authorization, Readdy will automatically redirect you back to the Readdy application. You’ll need to select or create a new project to match your Readdy project.
  • Click “Connect” to connect the project
  • When creating a new project, you’ll first need to select a region. Choose one closest to your user base for optimal performance.
Once connected successfully, Readdy will automatically send a confirmation message “Supabase is all set in my project.” to complete the project configuration and handle connection operations.

Building with Supabase

Integrating Supabase with Readdy is incredibly simple. Here are specific examples of integrating Supabase functionality into your project.

User Login

Email/Password

After connecting Supabase to your Readdy project, you can directly add Supabase’s authentication system to your project through conversation. Example prompt:
Add login and registration functionality using Supabase authentication system
Results:
  • In your app: After executing the above prompt, a login/registration page will be generated in your Readdy project for user authentication operations.
  • Supabase user table: In your Supabase project dashboard, you can find Authentication > Users to view all registered users.
In Supabase, you can also configure whether registered users need email verification. The setting page is in Authentication > Sign In / Providers, select Auth Providers > Email. During development and testing, you can disable “Confirm email” for more testing, but it’s recommended to enable this setting before production release to ensure user authenticity.
Before publishing your website, you need to configure Redirect URLs in Supabase’s Authentication > URL Configuration. The format should be: https://*.yourdomain.com/**, where *.yourdomain is the domain name you fill in when publishing your website.
When testing before publishing your website, the “Confirm your mail” link in emails may redirect abnormally, but it will work normally after your website is published.

Third-Party Login

Supabase also provides social media login/registration options, such as Google, Twitter, and Apple.
  1. Enable login methods in Supabase: In Sign In / Providers > Auth Providers, enable the required providers. Follow Supabase’s guidance to configure and save the necessary information.
  1. Add login methods in Readdy project: After completing the above configuration, you can add corresponding login methods through conversation. For example:
Add Google login to the login/registration page using Supabase integration.
After completing these steps, your app will support Google login, redirecting to Google for verification and then returning to your application.

Database

In your product, besides login/registration, database reading and writing might also be necessary. For example:
  • Saving user contact information to database tables.
  • Dynamically retrieving product information from database tables.
  1. Create data tables in Readdy: You can create data tables and product tools through conversation. For example:
Add a contact information form and save the information to a database table.
  1. Automatic implementation: After receiving the request, Readdy will automatically implement the related UI and logic, generate database operation SQL, and automatically sync to Supabase for table creation and modification operations.
SQL is automatically generated by AI. To avoid dangerous operations from AI errors, the SQL will block dangerous operations like deleting tables/fields or clearing tables. If you need to delete tables or fields, you can do so in Supabase’s Table Editor.
After completion, you can submit data in your product and check if it’s correctly saved in Supabase’s Table Editor.
Row Security Policy Check: Before launching your product, make sure to check the row security policies of your data tables. Row security policies define which users can read and write each row of data in the database. When generating, Readdy AI will also create relatively secure row security policy requirements. However, for greater security, please make sure to check in Supabase’s Authentication > Policies before release.

Edge Functions

In some product logic, you might need backend logic to help complete your product. For example:
  • Stripe payments: Process subscription payments, one-time purchases, and refunds
  • AI service integration: Generate content, analyze images, or provide chatbot functionality
  • Complex processing logic: Calculate pricing, process bulk data, or generate reports
  • Third-party integrations: Send emails, SMS notifications, or sync with CRM systems
You can add these functionalities through conversation in Readdy, and the system will automatically generate and deploy the necessary edge functions to Supabase. For example:
Add an AI chatbot feature using Supabase Edge Functions to connect with OpenAI's GPT-4o API
For API keys used in functions, make sure to save them securely in Edge Functions > Secrets in the Supabase dashboard to ensure key security. Do not directly input keys to AI in conversations.

File Storage

Supabase provides 1GB of file storage space for storing images, PDFs, and other files. For example, if your application needs users to upload avatars or files. You can add a file upload component through conversation in Readdy, which will upload files to Supabase Storage. Your product pages will also use these file links for display.