Supabase
For seeding data into your Supabase project, only the public
and auth
schemas are supported. If you experience any issues with any of the paths, reach out to us on Discord (opens in a new tab).
Generate data for your Supabase local development stack
Supabase makes it easy to set up a local development environment linked to your Supabase project. Snaplet can improve your local development by seeding your local database with data, making coding and testing more efficient and accurate.
In this short guide, we use the snaplet seed
command to seed a local Supabase stack. We will use the Nextjs + Supabase template (opens in a new tab) as an example.
Prerequisites
- Docker installed (opens in a new tab)
- Supabase CLI installed (opens in a new tab)
- Snaplet CLI installed
1. Clone the Nextjs + Supabase template
1.1. Create a Next.js app using the starter template by running the npx
command:
npx create-next-app -e with-supabase
1.2. Use cd
to change into the newly created directory:
cd name-of-new-app
2. Setup your Supabase project and apply migrations
2.1. Initialize the configuration for your Supabase local development project.
supabase init
2.2. Start your Supabase local stack. This will run the latest migrations against your local database.
supabase start
This command will print out the following output:
Started supabase local development setup. API URL: http://localhost:54321 DB URL: postgresql://postgres:postgres@localhost:54322/postgres Studio URL: http://localhost:54323 Inbucket URL: http://localhost:54324 anon key: eyJh......service_role key: eyJh......
2.3. Copy the DB URL - we will use this in the next step (step 4) to generate data into (referred to as the target database).
3. Set up your Snaplet seed config
3.1. Create a seed.mts
file in your root directory.
3.2. Update the seed.mts
file to create 10 users and 20 todos, the todos should be assigned to at least one of the 10 users.
You are now ready to seed your database.
4. Reset and seed your local development database
4.1 Run npx tsx seed.mts
and pipe the output to your supabase/seed.sql
file.
npx tsx seed.mts > supabase/seed.sql
4.2 Reset your local development database. This will run all the existing migrations and apply the seed script (at supabase/seed.sql
).
supabase db reset
4.3 Check your local database to see if the result of your seed script.
Now if you visit the Supabase Studio URL hosted locally (http://localhost:54323 (opens in a new tab)) and inspect the "todo" table, you should see 20 todo items.
In your project folder, if you move app/_examples/client-component/page.tsx
to app/todos/page.tsx
and then visit http://localhost:3000/todos
you should see all the todos created.
All done!
You have now successfully seeded your Supabase local development stack. As well as use the snaplet seed
command to seed your local database with the data you need.
If you have any questions or feedback, reach out to us on Discord (opens in a new tab).