[FREE] Supabase Pro | Auth, Database, Storage, Realtime | 40 Functions + 5 Mini Apps included

Hi everyone! :waving_hand:

I want to share with you Supabase Pro, a free extension I created to make it easier to use Supabase with Kodular.

If you’ve ever wanted to use Supabase as the backend for your Kodular apps but found the integration complicated or had to create a lot of Web component requests manually, this extension is meant to make that process much easier.

With Supabase Pro, you can use many of the main Supabase features directly through Kodular blocks, including Authentication, Database, Storage, Realtime, RPC, Edge Functions, advanced queries, file management, and more.

This is the first version I’m sharing with the community, so your feedback is very important.

If you find any bugs, errors, compatibility problems, or anything that doesn’t work as expected, please let me know. If possible, include the blocks you were using, what you were trying to do, and the error you received. This will help me understand the problem and fix it in future updates.

Suggestions are also welcome! If there’s a Supabase feature you would like to see added to the extension, or something you think could be improved, feel free to share your ideas.

What can you do with Supabase Pro?

01 — Connect to Supabase
Connect your Kodular app to your Supabase project using your Project URL and Publishable Key.

02 — Create Account
Register new users with email and password using Supabase Authentication.

03 — Login
Sign users into their accounts with email and password.

04 — Logout
Sign users out and clear their local session.

05 — Check if User is Logged In
Check whether the user currently has a valid local session.

06 — Reset Password
Create a password recovery flow and allow users to set a new password.

07 — Get Current User
Get information about the currently authenticated user, including their User ID.

08 — Insert Record
Add new records to your Supabase database tables.

09 — List All Records
Retrieve records stored in a database table.

10 — Get Record by ID
Find a specific database record using its ID.

11 — Get Records Using Filters
Retrieve only records that match specific conditions.

12 — Update Record
Update existing records in your database.

13 — Delete Record
Delete records from your database using filters such as an ID.

14 — Pagination
Load database records in pages instead of retrieving everything at once.

15 — Sort Results
Sort query results using one or multiple columns.

16 — Apply Multiple Filters
Combine multiple conditions to build more advanced database queries.

17 — Count Records
Get the number of records matching your query.

18 — Upsert Record
Insert a new record or update an existing one when a conflict occurs.

19 — Call RPC Function
Call PostgreSQL functions through Supabase RPC.

20 — Call Edge Function
Invoke Supabase Edge Functions directly from your Kodular app.

21 — Upload Image
Select and upload images from the user’s device to Supabase Storage.

22 — Upload PDF
Select PDF documents and upload them to Supabase Storage.

23 — Show Upload Progress
Track file upload progress and display it in your application.

24 — Download File
Download files stored in Supabase Storage.

25 — List Files from a Bucket
Retrieve files stored inside a Storage bucket or folder.

26 — Get Public URL
Generate public URLs for files stored inside public buckets.

27 — Create Signed URL
Generate temporary URLs for accessing private files.

28 — Delete File
Delete files from Supabase Storage.

29 — Listen for Realtime INSERT Events
Receive new database records in realtime.

30 — Listen for Realtime UPDATE Events
Receive notifications when database records are updated.

31 — Listen for Realtime DELETE Events
Receive notifications when database records are deleted.

32 — Create a Simple Realtime Chat
Combine database operations and Realtime events to create a basic live chat.

33 — Create a Product List
Retrieve products from your database and display them inside Kodular components.

34 — Login + Load User Profile
Authenticate a user and automatically retrieve their profile information from the database.

35 — Sign Up + Create User Profile
Create a new Authentication account and then create the user’s profile in your database.

36 — Upload Profile Picture
Upload a profile image to Storage, generate its URL, and save it to the user’s profile.

37 — Update User Profile
Allow authenticated users to update their profile information.

38 — Search Products
Search database records using text queries and filters.

39 — Infinite Scroll / Load More
Load additional records progressively to create pagination and infinite-scroll experiences.

40 — Differentiate Requests Using Request ID
Use Request IDs to identify which response belongs to each request when multiple operations are running.

Documentation & Examples

I didn’t want to release only the extension and leave everyone trying to figure out how each block works.

That’s why I’ve also prepared a complete manual explaining the blocks, functions, events, and how to use the extension step by step.

The manual includes 40 practical examples, covering everything from connecting your first Supabase project to more complete implementations using Authentication, Database, Storage, Realtime, profiles, search, pagination, and more.

The examples are designed to help you understand how the blocks should be assembled in Kodular and how to correctly handle asynchronous operations and their success or error events.

If you’re new to Supabase, I recommend starting with the first examples and going through them gradually.

5 Ready-Made Mini Apps Included

In addition to the extension and complete manual, I’m also including 5 ready-made mini apps.

These projects are included so you can see how Supabase Pro can be used in real Kodular projects instead of only looking at individual blocks.

You can open the projects, study the blocks, test how everything works, modify them, and use them as a starting point for your own applications.

The idea is to make it easier for both beginners and more experienced Kodular creators to start working with Supabase.

Important Security Note

When using Supabase in your apps, make sure your Database and Storage security policies are configured correctly.

Use your project’s Publishable Key on the client side.

Never include your service_role key or other administrative secrets inside a Kodular application.

The extension makes the integration easier, but your Supabase project should still be configured with the proper security policies for your application.

Feedback, Bugs & Suggestions

Since this is the first public version, there may still be bugs or situations that I haven’t encountered during testing.

So if you try the extension and find something wrong, please report it.

Even if it seems like a small problem, I’d like to know about it.

If possible, when reporting a bug, include:

  • What you were trying to do
  • The blocks you were using
  • The error message you received
  • Your Kodular version, if relevant
  • Any other information that could help reproduce the problem

And if everything works correctly, your feedback is also very welcome!

It helps me understand how the extension behaves across different devices and projects.

You can also suggest new features or improvements. I’ll be reading the feedback from the community and using it to improve future versions of Supabase Pro.

Download Supabase Pro

type or paste code here

The Supabase Pro extension file (.AIX) is attached below and can be downloaded directly from this post.

SupaBase Pro 1.0.zip (334.5 KB)

Supabase Pro is completely free.

The documentation, practical examples, and mini apps are designed to help you understand the extension and start building your own Kodular + Supabase projects.

If you download and test the extension, please come back and share your experience. Bug reports, suggestions, and feedback are all welcome.

I hope Supabase Pro helps make building Kodular + Supabase apps much easier for everyone.

Thanks everyone! :heart:

2 Likes

Thanks for your contribution. Please upload blocks images. As you’re using FAST-CLI to build extension, use -b flag to generate blocks as PNGs. Example:

fast build -b