AI Builder-gidsen

Lovable + WeSender

Lovable genereert full-stack apps met Supabase als backend. De WeSender-integratie loopt via een Supabase Edge Function zodat de API-sleutel nooit in de browser-code terechtkomt.

Voorbeeldprompt

Open Lovable en typ de volgende prompt:

Lovable-prompt
Maak een Supabase Edge Function genaamd 'send-email'. De functie stuurt
een e-mail via de WeSender REST API (POST https://api.wesender.nl/v1/emails).
Gebruik de omgevingsvariabele WESENDER_API_KEY als Bearer-token. De functie
accepteert een JSON-body met de velden 'to', 'subject' en 'html'. Geef een
JSON-response terug met het e-mail-id of een foutmelding.

Lovable genereert de Edge Function, voegt hem toe aan je Supabase-project en schrijft de aanroepcode in de frontend.

API-sleutel opslaan

Ga naar je Supabase-dashboard, open Settings > Edge Functions en voeg WESENDER_API_KEY toe als secret. De sleutel is dan beschikbaar in je Edge Functions via Deno.env.get("WESENDER_API_KEY"). Zet de sleutel nooit direct in de frontend-code.

Werkende Edge Function

supabase/functions/send-email/index.ts
import { serve } from "https://deno.land/std@0.168.0/http/server.ts"

serve(async (req) => {
  if (req.method !== "POST") {
    return new Response("Method not allowed", { status: 405 })
  }

  const { to, subject, html } = await req.json()

  const res = await fetch("https://api.wesender.nl/v1/emails", {
    method: "POST",
    headers: {
      "Authorization": `Bearer ${Deno.env.get("WESENDER_API_KEY")}`,
      "Content-Type":  "application/json",
    },
    body: JSON.stringify({
      from:    "noreply@jouwdomein.nl",
      to,
      subject,
      html,
    }),
  })

  const data = await res.json()

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

Domein instellen

Het from-adres in de Edge Function moet op een domein staan dat je in het WeSender-dashboard hebt geverifieerd. Gebruik een ander domein en de API weigert de aanvraag. Zie Domein instellen voor de instructies.

Zie ook het volledige overzicht op wesender.nl/ai/integraties/lovable.