Vai al contenuto principale

​
Che cos’è Resend?

Resend è un’API per email pensata per gli sviluppatori. È focalizzata su un’elevata affidabilità di recapito, sulla facilità di integrazione e su un’esperienza per sviluppatori semplice e lineare per l’invio di email transazionali e di marketing.

​
Tutorial passo dopo passo

Questo tutorial ti guida nella creazione di un CRM completamente funzionante in meno di un’ora, con acquisizione dei lead, conferma via email, iscrizione alla newsletter e una dashboard amministrativa interna. Utilizzerai:
  • Lovable: per generare il front end e la logica del backend.
  • Supabase: per l’archiviazione sicura dei dati e l’autenticazione.
  • Resend: per automatizzare e monitorare le email transazionali e di marketing.
Iniziamo.
1

Crea una landing page con un form di contatto

Usa l’AI di Lovable per generare rapidamente una landing page per il tuo prodotto o servizio.Istruzioni:
1

Nuovo progetto Lovable

Crea un nuovo progetto Lovable.
2

Istruzione:

Crea una landing page SaaS con un modulo di contatto che raccolga nome, email e messaggio.
Landing Page Progetto Lovable Pn
3

Esamina il codice generato

Esamina il codice generato oppure usa lo strumento di selezione per apportare modifiche agli elementi.
4

Aggiungi la validazione degli input

Aggiungi la validazione degli input e un campo message per migliorare l’esperienza utente.Modulo Email Resend Pn
2

Salvare gli invii del form in Supabase

Supabase è il tuo database backend sicuro.
1

Account Supabase

Crea un account Supabase gratuito e un nuovo progetto.
2

Chiave API

In Lovable, collega il tuo progetto Supabase tramite la chiave API.Supabase Resend Email Pn
3

Crea una tabella `contacts` con:

  • id: UUID, chiave primaria
  • name: text
  • email: text
  • message: text
  • created_at: timestamp
4

Logica di invio

Modifica la logica di invio del modulo per inserire i dati in Supabase.
5

RLS

Applica la Row-Level Security (RLS) di Supabase in modo da limitare l’accesso ai soli utenti autenticati.
3

Inviare email di conferma con Resend

Configura Resend per inviare email di conferma automatiche ogni volta che un lead invia il modulo.
1

Registrati su Resend

Registrati su Resend e verifica il tuo dominio personalizzato.
  • Ti verrà chiesto di aggiornare i record DNS (TXT, MX).
  • Usa sottodomini come updates.domain.com per gestire meglio la reputazione delle email.
2

Chiave API

Integra la chiave API in Lovable tramite le impostazioni delle variabili di ambiente o una funzione backend.
3

SDK

Usa l’SDK di Resend per inviare un’email di conferma all’invio del modulo.Invio email di conferma Resend Pn
4

Opzionale: React Email

Usa React Email (sempre di Resend) per personalizzare l’aspetto delle tue email con componenti riutilizzabili.Personalizza email Resend Pn
4

Crea un pannello di amministrazione sicuro

Consenti solo agli utenti autenticati di visualizzare e gestire i lead.
1

Route di amministrazione

Crea una route /admin in Lovable.
2

Autenticazione Supabase

Abilita l’autenticazione Supabase con accesso con email e password.
3

Contatti

Mostra la tabella contacts con le seguenti colonne:
  • Nome
  • Email
  • Anteprima del messaggio
  • Data di invio
4

Dettaglio completo del contatto

Aggiungi un pannello dei dettagli (ad esempio, un pannello a scorrimento) che mostri tutti i dettagli del contatto quando si fa clic su una riga.Crm Resend Email Pn
5

Logica di reindirizzamento

Aggiungi la logica di reindirizzamento in modo che gli utenti non autenticati vengano reindirizzati a /login.
5

Abilita risposte email personalizzate da parte dell’amministratore

Consenti al tuo team di inviare follow-up personalizzati.
1

Pannello dettagli contatto

Nel pannello dei dettagli del contatto, aggiungi un campo di testo e modelli predefiniti (ad esempio, “Grazie per esserti registrato!”).
2

Aggiungi pulsante di invio

Aggiungi un pulsante di invio collegato a Resend.
3

Archivia i messaggi inviati

Archivia ogni messaggio inviato in una tabella sent_emails in Supabase:
  • contact_id
  • subject
  • body
  • sent_at
In questo modo avrai un registro ricercabile di tutti i follow-up.
6

Aggiungi un modulo di iscrizione alla newsletter

Usa Audiences di Resend per gestire gli iscritti e inviare email broadcast.Subscription Newsletter Resend Pn
1

Aggiungi un nuovo form

Aggiungi un nuovo modulo sulla tua landing page per l’iscrizione alla newsletter.
2

Contatto Resend

Al momento dell’invio:
  • Crea un contatto Resend tramite l’API
  • (Opzionale) Salva anche il contatto localmente in Supabase
3

Design

Usa l’interfaccia per email broadcast di Resend per progettare e inviare newsletter.
  • Logica integrata di annullamento dell’iscrizione
  • Dati sulle prestazioni (tassi di apertura, stato di consegna)
4

Verifica di conformità!

Per essere conforme alle normative (ad es. GDPR), valuta l’implementazione di un flusso di double opt-in.
7

BONUS: Collegare Resend a Supabase Auth

Send Batch Emails Gdpr Resend PnVuoi migliorare il sistema di autenticazione via email predefinito di Supabase (che ti limita a 4 email/ora)?
1

Resend Supabase

Vai all’integrazione Supabase di Resend.
2

Autenticazione

Collega il tuo Progetto Supabase.
3

Configurazione del dominio

Scegli il tuo dominio e il nome/indirizzo email del mittente.
4

SMTP

Resend configura automaticamente l’SMTP e sostituisce il sistema email predefinito di Supabase.
5

Personalizzazione

Ora puoi personalizzare i modelli delle email di autenticazione dalla dashboard di Supabase.
8

Ritocchi finali e buone pratiche

Audience Resend Pn
  • Gestione degli errori: Lovable potrebbe mostrare errori di build che sono falsi positivi. Verifica sempre dal vivo la funzionalità.
  • Ripristino con Supabase: Se ripristini il codice in Lovable, ricordati di eliminare manualmente le policy o le migrazioni associate in Supabase: non vengono annullate automaticamente.
  • Suggerimenti per la deliverability delle email:
    • Usa sottodomini per isolare la reputazione del mittente.
    • Includi sempre una versione in testo semplice della tua email.
    • Monitora le prestazioni delle email tramite la dashboard degli insight di Resend.
9

Tutto fatto! 🎉

In meno di un’ora, hai costruito un CRM moderno con:
  • Una landing page e un modulo di contatto
  • Archiviazione dei lead tramite database
  • Conferme email automatizzate
  • Dashboard di amministrazione per la gestione dei lead
  • Risposte email personalizzate
  • Invio di newsletter
  • Autenticazione e verifica dell’email

​
Vuoi fare un passo in più?

  • Aggiungi il supporto per l’invio programmato di email tramite cron job di Supabase
  • Crea flussi di automazione per inviare email in base alle fasi dei lead
  • Personalizza la tua interfaccia utente per aumentare la fiducia nel brand e le conversioni

​
Domande frequenti sull’integrazione con Resend

Resend è un’API email pensata per gli sviluppatori. È focalizzata su un elevato tasso di recapito, sulla facilità di integrazione e su un’esperienza di sviluppo pulita per l’invio di email transazionali e di marketing.
No. Puoi completare l’intera configurazione del CRM utilizzando il piano gratuito di Resend, che supporta l’invio di email da un dominio verificato e fino a 3.000 contatti per le email di marketing.
Vai su Resend → Domains → aggiungi il tuo dominio. Ti verranno forniti record DNS (TXT, MX) da aggiungere tramite il tuo provider DNS (ad esempio Cloudflare, Namecheap). Una volta aggiunti, fai clic su Verify.
Usa un sottodominio come updates.yourdomain.com per isolare la reputazione del tuo dominio email.
Ci sono alcuni motivi comuni:
  • Non hai verificato il tuo dominio
  • L’email non ha una versione in testo semplice
  • Stai inviando da un mittente generico come onboarding@resend.dev
  • Non stai seguendo le best practice (ad esempio, mancano i link di cancellazione nelle email di marketing)
Usa il pannello Deliverability Insights di Resend per ottenere suggerimenti pratici.
Sì. Usa React Email — una libreria open-source del team di Resend — per progettare email stilizzate e responsive usando componenti React.
Resend supporta entrambe:
  • Email transazionali (conferma, reset, notifiche) usando l’API o l’SDK.
  • Email di marketing tramite la funzionalità Broadcast e le Audiences.
Puoi creare, visualizzare in anteprima e tracciare le campagne dalla dashboard.
Usa le Audiences:
  • Aggiungi contatti manualmente, tramite CSV o in modo programmatico usando l’API.
  • Ogni Audience ha un ID univoco che puoi usare per associare le iscrizioni.
  • Gli utenti possono cancellarsi automaticamente tramite il link di disiscrizione integrato di Resend.
Non in modo predefinito, ma puoi implementarlo manualmente:
  1. All’invio del modulo, invia un’email di conferma iniziale.
  2. Chiedi agli utenti di fare clic su un link.
  3. Al clic, conferma la loro iscrizione e aggiungili alla tua Audience in Resend.
Non ancora. Al momento Resend non supporta campagne drip o sequenze automatizzate.
Soluzione alternativa:Usa i Supabase Cron Jobs per programmare attività che attivano email di Resend a intervalli prestabiliti.
Usa l’integrazione ufficiale Supabase di Resend:
  1. Autenticati con il tuo Progetto Supabase.
  2. Fornisci un dominio e un nome mittente.
  3. Resend configura automaticamente le email di autenticazione di Supabase per usare il tuo account Resend.
Resend elabora automaticamente le disiscrizioni:
  • Devi includere un link di disiscrizione nelle email inviate tramite Broadcast.
  • Quando un utente si disiscrive, viene rimosso dall’Audience selezionata.
  • Questo è richiesto per la conformità alle normative sulle email (ad esempio, CAN-SPAM, GDPR).