Calling functions via RPC in Supabase - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to call a remote procedure named 'get_user' using Supabase client.

Supabase

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

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

Aget_user

Bcall_user

Clist_users

Dfetch_user

Attempts:

3 left

💡 Hint

Common Mistakes

Using a function name that does not exist on the server.

Misspelling the function name.

The rpc method calls the remote procedure by its exact name. Here, the function is named get_user.

2fill in blank

medium

Complete the code to pass a parameter 'user_id' with value 5 to the RPC call.

Supabase

const { data, error } = await supabase.rpc('get_user', { [1]: 5 });

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

Aid

Buid

Cuserid

Duser_id

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect parameter names.

Passing parameters as a string instead of an object.

The parameter name must match the expected argument name in the remote procedure. Here, it is user_id.

3fill in blank

hard

Fix the error in the code to correctly handle the RPC call result.

Supabase

if (error) {
  console.error([1]);
} else {
  console.log(data);
}

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

Aresult

Bdata

Cerror

Dresponse

Attempts:

3 left

💡 Hint

Common Mistakes

Logging data instead of error when an error occurs.

Not checking for errors before using data.

When an error occurs, you should log the error object, not data.

4fill in blank

hard

Fill both blanks to call the RPC function 'update_profile' with parameter 'profile_id' set to 10.

Supabase

const { data, error } = await supabase.rpc('[1]', { [2]: 10 });

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

Aupdate_profile

BprofileId

Cprofile_id

DupdateProfile

Attempts:

3 left

💡 Hint

Common Mistakes

Using camelCase instead of snake_case for parameter names.

Misspelling the function name.

The function name is update_profile and the parameter name is profile_id matching the server definition.

5fill in blank

hard

Fill all three blanks to call 'delete_item' RPC with 'item_id' 42 and handle error by logging it.

Supabase

const { data, error } = await supabase.rpc('[1]', { [2]: 42 });
if ([3]) {
  console.error(error);
}

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

Adelete_item

Bitem_id

Cerror

DitemId

Attempts:

3 left

💡 Hint

Common Mistakes

Using camelCase instead of snake_case for parameters.

Checking wrong variable for errors.

The RPC function is delete_item, parameter is item_id, and error is checked with error.

Practice

1. What does supabase.rpc() do in a Supabase app?

easy

A. Creates a new table in the database

B. Uploads files to storage

C. Fetches user authentication details

D. Calls a custom database function remotely

Solution

1. Step 1: Understand the purpose of supabase.rpc()

   This method is designed to call remote procedure calls (RPC), which are custom functions defined in the database.

2. Step 2: Identify what supabase.rpc() does in the app context

   It runs these custom functions securely from the app, allowing logic to stay in the database.

3. Final Answer:

   Calls a custom database function remotely -> Option D

4. Quick Check:

   RPC calls = custom database functions [OK]

Hint: RPC means running database functions remotely [OK]

Common Mistakes:

• Confusing RPC with file uploads
• Thinking it creates tables
• Assuming it handles user login

2. Which is the correct way to call a function named get_user_data with parameter { user_id: 5 } using Supabase RPC?

easy

A. supabase.rpc('get_user_data', { user_id: 5 })

B. supabase.call('get_user_data', 5)

C. supabase.function('get_user_data', { id: 5 })

D. supabase.execute('get_user_data', user_id=5)

Solution

1. Step 1: Recall the syntax of supabase.rpc()

   The method takes the function name as a string and an object with parameters.

2. Step 2: Match the correct syntax with the options

   supabase.rpc('get_user_data', { user_id: 5 }) correctly uses supabase.rpc('function_name', { params }) format.

3. Final Answer:

   supabase.rpc('get_user_data', { user_id: 5 }) -> Option A

4. Quick Check:

   Correct RPC call syntax = supabase.rpc('get_user_data', { user_id: 5 }) [OK]

Hint: Use rpc('function', {params}) format [OK]

Common Mistakes:

• Using wrong method names like call or execute
• Passing parameters as separate arguments
• Using incorrect parameter keys

3. Given this code snippet:

const { data, error } = await supabase.rpc('multiply', { a: 3, b: 4 });
console.log(data);

What will be printed if the multiply function returns the product of a and b?

medium

A. 7

B. 12

C. undefined

D. Error

Solution

1. Step 1: Understand the function call and parameters

   The function multiply is called with a=3 and b=4.

2. Step 2: Calculate the expected return value

   Since the function returns the product, 3 * 4 = 12.

3. Final Answer:

   12 -> Option B

4. Quick Check:

   3 times 4 = 12 [OK]

Hint: Multiply parameters to find output [OK]

Common Mistakes:

• Adding instead of multiplying
• Assuming no return value
• Confusing data with error

4. You wrote this code:

const { data, error } = await supabase.rpc('get_user', { user_id: 10 });
console.log(data);

But you get an error saying the function does not exist. What is the likely cause?

medium

A. Parameters must be passed as an array, not an object

B. You forgot to import supabase client

C. The function name is misspelled or missing in the database

D. RPC calls do not support parameters

Solution

1. Step 1: Analyze the error message

   The error says the function does not exist, indicating a problem with the function name or its presence in the database.

2. Step 2: Check common causes for missing function errors

   Usually, the function is either misspelled or not created in the database schema.

3. Final Answer:

   The function name is misspelled or missing in the database -> Option C

4. Quick Check:

   Function missing error = wrong or absent function [OK]

Hint: Check function spelling and existence in DB [OK]

Common Mistakes:

• Passing parameters incorrectly
• Assuming import errors cause this
• Thinking RPC disallows parameters

5. You want to create a Supabase RPC call to get the total sales for a given store_id. The database function is named total_sales and takes store_id as input. Which code snippet correctly calls this function and handles errors?

hard

A. const { data, error } = await supabase.rpc('total_sales', { store_id }); if (error) console.error(error); else console.log(data);

B. const result = supabase.call('total_sales', store_id); console.log(result);

C. const { data } = await supabase.rpc('total_sales', store_id); console.log(data);

D. const { data, error } = supabase.rpc('total_sales', { store: store_id }); if (error) throw error; else console.log(data);

Solution

1. Step 1: Identify correct RPC call syntax with parameters

   The function name is 'total_sales' and parameters must be passed as an object with key matching the function input, here { store_id }.

2. Step 2: Check error handling and async usage

   const { data, error } = await supabase.rpc('total_sales', { store_id }); if (error) console.error(error); else console.log(data); uses await, destructures data and error, and handles error properly with console.error.

3. Final Answer:

   const { data, error } = await supabase.rpc('total_sales', { store_id }); if (error) console.error(error); else console.log(data); -> Option A

4. Quick Check:

   Correct RPC call with error check = const { data, error } = await supabase.rpc('total_sales', { store_id }); if (error) console.error(error); else console.log(data); [OK]

Hint: Use await, pass params as object, check error [OK]

Common Mistakes:

• Passing parameters incorrectly (not as object)
• Ignoring error handling
• Using wrong method names like call