> ## Documentation Index
> Fetch the complete documentation index at: https://lovable.generaltranslation.app/llms.txt
> Use this file to discover all available pages before exploring further.
# Integração com Resend
> Aprenda a integrar o Resend ao seu app Lovable
## O que é Resend?
[Resend](https://resend.com/emails) é uma API de e-mail criada para desenvolvedores. Ela foca em alta entregabilidade, facilidade de integração e uma experiência simples para desenvolvedores no envio de e-mails transacionais e de marketing.
## Tutorial passo a passo
Este tutorial orienta você na criação de um CRM totalmente funcional em menos de uma hora — com coleta de leads, confirmação por e-mail, inscrição na newsletter e um painel interno de administração. Você usará:
* **Lovable**: para gerar o front-end e a lógica de backend.
* **Supabase**: para armazenamento seguro de dados e autenticação.
* **Resend**: para automatizar e acompanhar e-mails transacionais + de marketing.
Vamos começar.
Use a IA da Lovable para gerar rapidamente uma landing page para seu produto ou serviço.
**Instruções:**
Crie um novo projeto Lovable.
Crie uma landing page SaaS com um formulário de contato que colete nome, e-mail e mensagem.
Inspecione o código gerado ou use a ferramenta de seleção para ajustar elementos.
Adicione validação dos campos e um campo `message` para melhorar a experiência do usuário.
Supabase atua como seu banco de dados de back-end seguro.
Crie uma conta gratuita no Supabase e um novo projeto.
No Lovable, conecte seu projeto do Supabase usando a chave de API.
* `id`: UUID, chave primária
* `name`: text
* `email`: text
* `message`: text
* `created_at`: timestamp
Modifique a lógica de envio do formulário para inserir dados no Supabase.
Aplique o Row-Level Security (RLS) do Supabase para restringir o acesso somente a usuários autenticados.
Configure o [Resend]() para enviar e-mails de confirmação automáticos sempre que um lead enviar o formulário.
Cadastre-se no [Resend](https://resend.com) e verifique seu domínio personalizado.
* Você será solicitado a atualizar seus registros DNS (TXT, MX).
* Use subdomínios como `updates.domain.com` para gerenciar melhor a reputação de e-mail.
Integre a chave de API no Lovable por meio das configurações de ambiente ou de uma função de backend.
Use o SDK do Resend para enviar um e-mail de confirmação ao enviar o formulário.
Use o [React Email](https://react.email) (também do Resend) para personalizar a aparência e o estilo dos seus e-mails com componentes reutilizáveis.
Permita que somente usuários autenticados visualizem e gerenciem leads.
Crie uma rota `/admin` no Lovable.
Habilite a autenticação Supabase com login por e-mail e senha.
Exiba a tabela `contacts` com as colunas:
* Nome
* E-mail
* Pré-visualização da mensagem
* Data de envio
Adicione um painel de detalhes (por exemplo, um painel deslizante) exibindo os detalhes completos do contato ao clicar em uma linha.
Adicione lógica de redirecionamento para que usuários não autenticados sejam redirecionados para `/login`.
Permita que sua equipe envie acompanhamentos personalizados.
No painel de detalhes do contato, adicione um **campo de texto** e **modelos predefinidos** (por exemplo, "Obrigado por se cadastrar!").
Adicione um **botão de envio** integrado ao Resend.
Armazene cada mensagem enviada em uma tabela `sent_emails` no Supabase:
* `contact_id`
* `subject`
* `body`
* `sent_at`
Isso cria um registro pesquisável de todos os acompanhamentos.
Use o recurso **Audiences** da Resend para gerenciar assinantes e enviar campanhas de email.
Adicione um novo formulário na sua landing page para inscrição na newsletter.
Quando o formulário for enviado:
* Crie um contato no Resend via API
* (Opcional) Armazene o contato localmente no Supabase também
Use a interface de campanhas (broadcast) de email da Resend para criar e enviar newsletters.
* Lógica de cancelamento de inscrição integrada
* Insights de desempenho (taxas de abertura, status de entrega)
Para fins de conformidade (por exemplo, com o GDPR), considere implementar um fluxo de **double opt-in**.
Quer melhorar a autenticação por e-mail padrão do Supabase (que limita o envio a 4 e-mails por hora)?
Vá para a [integração do Resend com o Supabase](https://resend.com/integrations/supabase).
Autentique-se com seu projeto Supabase.
Escolha seu domínio e o nome/e-mail do remetente.
O Resend configura automaticamente o SMTP e substitui o sistema de e-mail padrão do Supabase.
Agora você pode personalizar os modelos de e-mail de autenticação no painel do Supabase.
* **Tratamento de erros**: o Lovable pode mostrar erros de build que são falsos positivos. Sempre teste sua funcionalidade em produção.
* **Reversão com Supabase**: ao reverter código no Lovable, lembre-se de excluir manualmente as políticas ou migrações associadas do Supabase — elas não são revertidas automaticamente.
* **Dicas de entregabilidade**:
* Use subdomínios para isolar a reputação de envio.
* Sempre inclua uma versão em texto simples do seu e-mail.
* Monitore o desempenho dos e-mails com o painel de insights do Resend.
Em menos de uma hora, você criou um CRM moderno com:
* Uma landing page e formulário de contato
* Armazenamento de leads em banco de dados
* Confirmações de e-mail automatizadas
* Painel administrativo para gerenciamento de leads
* Respostas de e-mail personalizadas
* Envio de newsletters
* Autenticação e verificação de e-mail
## Quer ir além?
* Adicione suporte para **e-mails agendados** via cron jobs do Supabase
* Crie **fluxos de automação** para disparar e-mails de acordo com os estágios do lead
* Ajuste o estilo da sua interface para aumentar a confiança na marca e a conversão
## FAQ sobre a integração com Resend
Resend é uma API de e-mail criada para desenvolvedores. Ela é focada em alta entrega, facilidade de integração e uma experiência simples e direta para desenvolvedores ao enviar e-mails transacionais e de marketing.
Não. Você pode concluir toda a configuração de CRM usando o **plano gratuito do Resend**, que permite enviar e-mails a partir de um domínio verificado e até 3.000 contatos para e-mails de marketing.
Acesse Resend → **Domains** → Adicione o seu domínio. Você receberá registros DNS (TXT, MX) para adicionar no seu provedor de DNS (por exemplo, Cloudflare, Namecheap). Depois de adicioná-los, clique em **Verify**.
Use um subdomínio como `updates.seudominio.com` para isolar a reputação do seu e-mail.
Existem alguns motivos comuns:
* Você não verificou o seu domínio
* Seu e-mail não tem uma versão em texto simples
* Você está enviando de um remetente genérico como `onboarding@resend.dev`
* Você não está seguindo boas práticas (por exemplo, falta de links de descadastro em e-mails de marketing)
Use o painel **Deliverability Insights** do Resend para obter dicas práticas.
Sim. Use o [React Email](https://react.email/) — uma biblioteca de código aberto criada pela equipe do Resend — para criar e-mails estilizados e responsivos com componentes React.
O Resend oferece suporte a **ambos**:
* **E-mails transacionais** (confirmação, redefinição, notificações) usando a API ou SDK.
* **E-mails de marketing** via o recurso **Broadcast** e **Audiences**.
Você pode criar, pré-visualizar e acompanhar campanhas pelo painel.
Use **Audiences**:
* Adicione contatos manualmente, via CSV ou de forma programática usando a API.
* Cada Audience tem um ID exclusivo que você pode usar para associar inscrições.
* Usuários podem se descadastrar automaticamente pelo link de descadastro nativo do Resend.
Não por padrão, mas você pode implementar manualmente:
1. No envio do formulário, envie um e-mail inicial de confirmação.
2. Peça para os usuários clicarem em um link.
3. No clique, confirme a inscrição e adicione-os à sua Audience no Resend.
Ainda não. O Resend atualmente não oferece suporte a campanhas de gotejamento (drip) ou sequências automatizadas.
Solução alternativa:
Use **Supabase Cron Jobs** para agendar tarefas que disparem e-mails do Resend em intervalos definidos.
Use a integração oficial do Supabase criada pelo Resend:
1. Autentique com o seu projeto Supabase.
2. Informe um domínio e o nome do remetente.
3. O Resend configura automaticamente os e-mails de autenticação do Supabase para usar a sua conta Resend.
O Resend processa descadastros automaticamente:
* Você deve incluir um link de descadastro em e-mails de broadcast.
* Quando um usuário se descadastra, ele é removido da Audience selecionada.
* Isso é obrigatório para conformidade com normas de e-mail (por exemplo, CAN-SPAM, GDPR).
Quer melhorar a autenticação por e-mail padrão do Supabase (que limita o envio a 4 e-mails por hora)?
* **Tratamento de erros**: o Lovable pode mostrar erros de build que são falsos positivos. Sempre teste sua funcionalidade em produção.
* **Reversão com Supabase**: ao reverter código no Lovable, lembre-se de excluir manualmente as políticas ou migrações associadas do Supabase — elas não são revertidas automaticamente.
* **Dicas de entregabilidade**:
* Use subdomínios para isolar a reputação de envio.
* Sempre inclua uma versão em texto simples do seu e-mail.
* Monitore o desempenho dos e-mails com o painel de insights do Resend.