Creating Edge Functions with Deno in Supabase - Visual Walkthrough

Process Flow - Creating Edge Functions with Deno

Write Deno Function Code

↓

Save as edge function file

↓

Deploy to Supabase Edge

↓

Supabase runs function on request

↓

Function executes and returns response

↓

Client receives response

This flow shows how you write a Deno function, deploy it as an edge function on Supabase, and how it runs when a client calls it.

Execution Sample

Supabase

export async function handler(req) {
  return new Response('Hello from Edge!')
}

A simple Deno edge function that returns a greeting response when called.

Process Table

Step	Action	Input	Output	Notes
1	Function receives HTTP request	Request object	N/A	Edge function triggered by client request
2	Function executes handler	Request object	Response object	Runs the exported handler function
3	Return response	N/A	Response object with message 'Hello from Edge!'	Response sent back to client
4	Client receives response	Response object	Displays message	Client sees 'Hello from Edge!'
5	End	N/A	N/A	Function execution complete

💡 Function completes after sending response to client

Status Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	Final
req	undefined	Request object	Request object	Request object	Request object
response	undefined	undefined	Response object	Response object	Response object

Key Moments - 3 Insights

Why does the function return a Response object instead of just a string?

The function must return a Response object because Supabase Edge expects HTTP responses with status and headers, not just plain strings. See execution_table step 3.

What triggers the edge function to run?

The edge function runs when it receives an HTTP request from a client, as shown in execution_table step 1.

Can the function access external APIs or databases?

Yes, inside the handler you can write code to fetch data or query databases before returning a response.

Visual Quiz - 3 Questions

Look at the execution table, what is the output at step 3?

A 'Hello from Edge!' wrapped in a Response object

B Plain string 'Hello from Edge!'

C Request object

D Undefined

💡 Hint

Check the Output column in execution_table row for step 3

At which step does the client receive the response?

A Step 2

B Step 3

C Step 4

D Step 5

💡 Hint

Look at the Action and Notes columns in execution_table for when client gets the response

If the function returned a plain string instead of a Response object, what would happen?

A Supabase would automatically convert it to a Response

B The function would fail or return an error

C The client would receive the string without HTTP headers

D The function would run twice

💡 Hint

Refer to key_moments about why Response object is required

Concept Snapshot

Creating Edge Functions with Deno on Supabase:
- Write an async handler function that takes a request
- Return a Response object with your output
- Deploy the function to Supabase Edge
- Supabase runs it on HTTP requests
- Client receives the HTTP response
- Use Response for proper HTTP behavior

Full Transcript

This visual execution shows how to create and run edge functions using Deno on Supabase. First, you write a handler function that receives an HTTP request and returns a Response object. When deployed, Supabase runs this function whenever a client sends a request. The function executes, returns a response with a message, and the client receives it. Variables like the request and response objects change state during execution. Key points include the need to return a Response object and that the function triggers on HTTP requests. The quiz tests understanding of these steps and outputs.