Introduction to Serverless Functions in Supabase

Supabase, the open-source Firebase alternative, has been making waves in the developer community with its robust set of features. One of the standout offerings is its serverless functions capability, which allows developers to run code on the edge without managing servers. Let's explore how these functions work and how you can harness their power in your Supabase projects.

What are Supabase Edge Functions?

Supabase Edge Functions are serverless functions that run on the edge, closer to your users. They're built on Deno, a modern runtime for JavaScript and TypeScript, and are designed to be fast, secure, and easy to deploy.

Setting Up Your First Edge Function

To get started with Edge Functions, you'll need the Supabase CLI. Here's a quick setup:

1. Install the Supabase CLI:

   npm install -g supabase

2. Log in to your Supabase account:

   supabase login

3. Create a new function:

   supabase functions new hello-world

This creates a new function in the supabase/functions directory.

Writing Your First Function

Let's create a simple "Hello, World!" function:

// supabase/functions/hello-world/index.ts

import { serve } from "https://deno.land/std@0.168.0/http/server.ts"

serve(async (req) => {
  const { name } = await req.json()
  const data = {
    message: `Hello ${name}!`,
  }

  return new Response(
    JSON.stringify(data),
    { headers: { "Content-Type": "application/json" } },
  )
})

Deploying Your Function

Deploy your function with:

supabase functions deploy hello-world

Now your function is live and ready to be invoked!

Invoking Your Function

You can invoke your function using the Supabase client library:

const { data, error } = await supabase.functions.invoke('hello-world', {
  body: JSON.stringify({ name: 'World' })
})

console.log(data.message) // Outputs: "Hello World!"

Advanced Use Cases

Database Interactions

Edge Functions can interact with your Supabase database. Here's an example that fetches user data:

import { serve } from "https://deno.land/std@0.168.0/http/server.ts"
import { createClient } from "https://esm.sh/@supabase/supabase-js@2"

serve(async (req) => {
  const supabase = createClient(
    Deno.env.get('SUPABASE_URL') ?? '',
    Deno.env.get('SUPABASE_ANON_KEY') ?? ''
  )

  const { data, error } = await supabase
    .from('users')
    .select('name, email')
    .limit(10)

  if (error) throw error

  return new Response(
    JSON.stringify(data),
    { headers: { "Content-Type": "application/json" } },
  )
})

Scheduled Functions

You can set up scheduled functions to run at specific intervals. This is great for tasks like data cleanup or sending periodic notifications.

To create a scheduled function:

1. Create a new function as before.
2. Add a cron schedule in your supabase/functions/function-name/index.ts file:

import { serve } from "https://deno.land/std@0.168.0/http/server.ts"

serve(async (req) => {
  // Function logic here
})

// Cron schedule (runs every day at midnight)
Deno.cron("Daily cleanup", "0 0 * * *", async () => {
  // Cleanup logic here
})

Handling Webhooks

Edge Functions are perfect for handling webhooks. Here's an example of processing a Stripe webhook:

import { serve } from "https://deno.land/std@0.168.0/http/server.ts"
import Stripe from 'https://esm.sh/stripe@8.222.0'

const stripe = new Stripe(Deno.env.get('STRIPE_SECRET_KEY'), {
  httpClient: Stripe.createFetchHttpClient(),
})

serve(async (req) => {
  const signature = req.headers.get('stripe-signature')
  const body = await req.text()

  try {
    const event = stripe.webhooks.constructEvent(
      body,
      signature,
      Deno.env.get('STRIPE_WEBHOOK_SECRET')
    )

    switch (event.type) {
      case 'payment_intent.succeeded':
        // Handle successful payment
        break
      // Handle other event types
    }

    return new Response(JSON.stringify({ received: true }), { status: 200 })
  } catch (err) {
    return new Response(`Webhook Error: ${err.message}`, { status: 400 })
  }
})

Best Practices

1. Keep Functions Small: Focus on single responsibilities for each function.
2. Use Environment Variables: Store sensitive information in environment variables.
3. Handle Errors Gracefully: Implement proper error handling to improve debugging.
4. Optimize for Cold Starts: Minimize dependencies to reduce cold start times.
5. Leverage Caching: Use caching mechanisms to improve performance for frequently accessed data.

Conclusion

Supabase Edge Functions offer a powerful way to extend your application's backend capabilities without the hassle of server management. By leveraging these serverless functions, you can create more responsive, scalable, and efficient applications. As you continue to explore Supabase, you'll find that Edge Functions are an invaluable tool in your development arsenal.