Real Data and Auth with Supabase
Explore how to connect your web app to Supabase to enable real data persistence and user authentication. Learn to set up a hosted PostgreSQL database, create tables, and implement signup and login flows. Understand how to secure user data with row-level security and manage file uploads, transforming your app from temporary storage to a fully functioning product.
We'll cover the following...
Open PawPals. Browse the walkers. Book a walk with Sarah for next Tuesday. Fill in your dog’s name, add a note about his fear of squirrels, confirm the booking. The confirmation page shows all the details. It works.
Now close the tab. Open it again. Everything is gone. The booking, the walker selection, the note about the squirrels. The app reset to its default state, as if you were never there.
The app has no real database. Everything you have built so far lives in temporary memory that disappears when the page reloads. Walker data is hardcoded. Bookings exist only in the browser’s short-term storage. There are no users, no accounts, no way to tell one visitor from another.
This lesson teaches you how to connect your application to Supabase, a hosted database and authentication service. By the end, bookings will survive a refresh, users will have real accounts, and each user will see only their own data.
What is Supabase?
We introduced the database as the pantry, the place where your app stores information permanently. Supabase is a specific service that provides that pantry. It gives you two things:
A hosted PostgreSQL database: PostgreSQL is one of the most widely used database systems in the world, and “hosted” means someone else runs the server so you do not have to. You get a web dashboard to see your data, manage users, and configure settings.
Authentication: The system that lets users create accounts, log in, and be recognized across sessions.
One service. Database + login system. Visual dashboard. You never touch a server. ...