Introdução - Lovable Documentation

Lovable possui integrações nativas perfeitas para exportar código e adicionar um backend. Mas também é possível integrar uma API externa se você estiver procurando adicionar essa funcionalidade específica ao seu site.

O que é uma API?

Uma API é uma forma de aplicações de software se comunicarem e compartilharem dados entre si. Diferentes APIs oferecem diferentes funcionalidades, como enviar emails ou processar pagamentos. Você pode ler mais sobre o poder das APIs neste artigo em nosso blog.

Integrações Nativas

Explore as seções abaixo para começar rapidamente e aprender mais sobre nossas integrações nativas com GitHub e Supabase.

Integração GitHub

Entenda como integrar o Lovable com o GitHub para exportar seu código e ter controle de versão sem complicações.

Integração Supabase

Adicione um backend ao seu site usando Supabase, para suportar autenticação e armazenamento persistente de dados.

Integrações Verificadas

As integrações verificadas funcionam melhor com Lovable:

Stripe

Adicione recursos de processamento de pagamentos ao seu app.

OpenAI

Adicione recursos de IA ao seu app usando os modelos da OpenAI.

Anthropic

Adicione recursos de IA ao seu app usando os modelos Claude da Anthropic.

Resend

Adicione recursos de email ao seu app usando a API de email moderna da Resend.

Clerk

Plataforma Abrangente de Gerenciamento de Usuários.

Three.js

Adicione gráficos 3D interativos ao seu app.

D3.js

Crie visualizações de dados dinâmicas e interativas.

Highcharts

Crie gráficos e visualizações profissionais e interativos.

p5.js

Crie projetos de programação criativa e gráficos interativos.

Runware

Faça seu app gerar imagens a partir de prompts de texto.

ElevenLabs

Adicione funcionalidade de Texto-para-Fala.

Make

Plataforma visual para construir fluxos de trabalho que automatizam tarefas e conectam apps.

Replicate

Execute e ajuste modelos de IA de código aberto.

Stability AI

Desenvolve modelos de IA abertos em várias modalidades.

Figma

Importe designs do seu workspace do Figma.

Twilio

Adicione recursos de SMS ao seu app usando Twilio.

n8n

Construa fluxos de trabalho com plataforma visual para sua aplicação.

Você sempre pode solicitar novas integrações aqui.

Usando Qualquer API com Lovable

Todas as outras APIs chamáveis ainda podem ser integradas, mas frequentemente requerem contexto e instruções adicionais. Você pode ter:

Sistemas internos com APIs customizadas
Estes podem ser serviços que sua equipe construiu (ex: sistemas de inventário, pipelines de análise, ferramentas internas) que expõem endpoints REST ou GraphQL mas não são publicamente documentados ou amplamente conhecidos. Você quer que o Lovable extraia dados ou envie dados para esses sistemas para automatizar fluxos de trabalho ou alimentar interfaces de usuário.
APIs de terceiros que o Lovable ainda não suporta
Talvez você use um produto SaaS de nicho, um provedor de dados especializado, ou uma integração de parceiro que o Lovable não tem conhecimento integrado. Mesmo que não seja oficialmente suportado, você ainda quer que o Lovable se conecte, faça chamadas e trabalhe com os dados.

Em ambos os casos, o desafio é o mesmo: o Lovable não “conhece” a API por padrão. Mas com boa documentação e configuração de autenticação, ele ainda pode usá-la efetivamente. De qualquer forma, a abordagem é a mesma: o Lovable ainda pode se conectar a ela. Veja como.

Dê ao Lovable o contexto que ele precisa

O Lovable funciona melhor quando entende a API. Você pode fornecer:

Especificação OpenAPI (se disponível)
Documentação copiada e colada ou exemplos (especialmente endpoints e exemplos de requisições/respostas)

Quanto mais clara a documentação, melhor o Lovable pode raciocinar sobre como chamar a API.

Gerencie a autenticação com segurança

Para APIs que requerem autenticação:Opção 1: Use Supabase Edge Functions como proxy

Armazene segredos com segurança no Supabase
Deixe o Lovable chamar o endpoint da API via Edge Function (não a API diretamente)

Opção 2: Implemente a integração da API diretamente no seu projeto Lovable

Exponha um endpoint de autenticação (ex: para trocar credenciais por um token ou sessão)
Deixe o Lovable chamar esse endpoint de autenticação como parte do fluxo de integração
Inclua tokens, cabeçalhos ou informações de sessão em chamadas subsequentes da API

Exemplos de APIs: