Setting up a Supabase project - Interactive Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to initialize the Supabase client with your project URL.

Supabase

import { createClient } from '@supabase/supabase-js';

const supabaseUrl = '[1]';
const supabaseKey = 'your-anon-key';
const supabase = createClient(supabaseUrl, supabaseKey);

Drag options to blanks, or click blank then click option'

Ahttps://your-project.supabase.co

Bhttp://localhost:3000

Chttps://api.supabase.io

Dhttps://supabase.com

Attempts:

3 left

💡 Hint

Common Mistakes

Using a local URL instead of the Supabase project URL.

Using the generic supabase.com URL instead of your project URL.

The Supabase client needs your unique project URL to connect to your database.

2fill in blank

medium

Complete the code to sign up a new user with email and password.

Supabase

const { data, error } = await supabase.auth.[1]({
  email: '[e-mail]',
  password: 'password123'
});

Drag options to blanks, or click blank then click option'

AsignUp

Bregister

Clogin

DcreateUser

Attempts:

3 left

💡 Hint

Common Mistakes

Using login instead of signUp to create a new user.

Using register or createUser which are not valid Supabase methods.

The method to create a new user is signUp in Supabase auth.

3fill in blank

hard

Fix the error in the code to fetch data from the 'profiles' table.

Supabase

const { data, error } = await supabase.from('[1]').select('*');

Drag options to blanks, or click blank then click option'

Aprofile_table

Bprofiles

Cusers

Dprofile

Attempts:

3 left

💡 Hint

Common Mistakes

Using singular 'profile' instead of 'profiles'.

Using incorrect table names like 'users' or 'profile_table'.

The correct table name is 'profiles' as created in Supabase.

4fill in blank

hard

Fill both blanks to update a user's profile with new data.

Supabase

const { data, error } = await supabase.from('[1]').update({ name: 'Alice' }).[2]('id', 1);

Drag options to blanks, or click blank then click option'

Aprofiles

Busers

Ceq

Dfilter

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'users' instead of 'profiles' table.

Using 'filter' instead of 'eq' for filtering.

Use 'profiles' table and 'eq' method to filter by id.

5fill in blank

hard

Fill all three blanks to insert a new row and return the inserted data.

Supabase

const { data, error } = await supabase.from('[1]').insert([{ [2]: 'Bob', [3]: 30 }]).select();

Drag options to blanks, or click blank then click option'

Aprofiles

Bname

Cage

Dusers

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'users' instead of 'profiles' table.

Using wrong field names like 'username' or 'years'.

Insert into 'profiles' table with fields 'name' and 'age'.

Practice

1. What is the first step when setting up a new Supabase project?

easy

A. Choose a project name, password, and region on the Supabase website

B. Write SQL queries to create tables

C. Install Supabase CLI on your computer

D. Connect your project to a third-party API

Solution

1. Step 1: Access the Supabase website

   To start a project, you first go to the Supabase website where you can create a new project.

2. Step 2: Provide project details

   You must enter a project name, set a password, and select a region to host your project.

3. Final Answer:

   Choose a project name, password, and region on the Supabase website -> Option A

4. Quick Check:

   First step = Choose name, password, region [OK]

Hint: Start by naming and securing your project on the website [OK]

Common Mistakes:

• Trying to write SQL before creating the project
• Assuming CLI installation is first
• Skipping region selection

2. Which of the following is the correct way to set the project password during Supabase setup?

easy

A. Enter a strong password with letters, numbers, and symbols

B. Leave it blank to use the default password

C. Use your email address as the password

D. Set the password after project creation only

Solution

1. Step 1: Understand password requirements

   Supabase requires a strong password to secure your database access.

2. Step 2: Choose a secure password

   You should enter a password with a mix of letters, numbers, and symbols during setup.

3. Final Answer:

   Enter a strong password with letters, numbers, and symbols -> Option A

4. Quick Check:

   Password must be strong and set at setup [OK]

Hint: Always use a strong password when creating your project [OK]

Common Mistakes:

• Leaving password blank
• Using weak or guessable passwords
• Trying to set password after creation

3. After creating a Supabase project, what will you see on the dashboard?

medium

A. A list of third-party APIs to connect

B. Only a blank screen with no options

C. Options to manage your database, authentication, and storage

D. A command line interface to type SQL commands

Solution

1. Step 1: Understand the Supabase dashboard purpose

   The dashboard is the control center for your project backend services.

2. Step 2: Identify available management options

   You can manage your database tables, authentication settings, and file storage from the dashboard.

3. Final Answer:

   Options to manage your database, authentication, and storage -> Option C

4. Quick Check:

   Dashboard shows backend management options [OK]

Hint: Dashboard lets you manage database, auth, and storage [OK]

Common Mistakes:

• Expecting a blank or empty dashboard
• Looking for third-party API lists instead
• Confusing dashboard with CLI

4. You tried to create a Supabase project but got an error saying the project name is already taken. What should you do?

medium

A. Delete another user's project with that name

B. Choose a different unique project name

C. Ignore the error and try again

D. Use the same name but change the password

Solution

1. Step 1: Understand project name uniqueness

   Supabase requires each project name to be unique across all users.

2. Step 2: Select a new unique name

   To fix the error, pick a different project name that is not already used.

3. Final Answer:

   Choose a different unique project name -> Option B

4. Quick Check:

   Project names must be unique [OK]

Hint: Pick a unique project name to avoid conflicts [OK]

Common Mistakes:

• Trying to reuse an existing project name
• Changing password instead of name
• Ignoring the error message

5. You want your Supabase project to be fast for users in Europe. What should you do during setup?

hard

A. Set the project password to 'europe123' for speed

B. Choose the default region regardless of user location

C. Create multiple projects in different regions manually

D. Select a hosting region in Europe when creating the project

Solution

1. Step 1: Understand region selection impact

   Choosing a hosting region close to your users reduces latency and improves speed.

2. Step 2: Select the appropriate region during setup

   When creating the project, pick a region in Europe to optimize performance for European users.

3. Final Answer:

   Select a hosting region in Europe when creating the project -> Option D

4. Quick Check:

   Region choice affects speed and latency [OK]

Hint: Pick hosting region near users for best speed [OK]

Common Mistakes:

• Ignoring region selection
• Using weak passwords thinking it affects speed
• Creating multiple projects unnecessarily