Crea con CometAPITi serve una sola API per più modelli?Testa il flusso di lavoro in Playground, poi crea una chiave API quando modello e costo sono adatti al tuo caso d'uso.
Impara come Lovable sviluppa applicazioni web, esplora le sue funzionalità principali e collega CometAPI tramite un backend sicuro, seguendo un tutorial pratico su un assistente di scrittura.
Lovable è una piattaforma di sviluppo basata su AI che trasforma istruzioni in linguaggio naturale in codice di applicazioni web modificabile. Aiuta founder, designer, team di prodotto e sviluppatori a creare interfacce, collegare servizi backend e pubblicare applicazioni tramite una conversazione iterativa. Questa guida spiega le sue funzionalità, l’architettura dei progetti e una pratica integrazione CometAPI per un assistente di scrittura. L’integrazione aggiunge l’inferenza dei modelli all’applicazione che costruisci; non stabilisce un modo per sostituire l’agente di coding di Lovable. I lettori dovrebbero comprendere le basi delle richieste HTTP e di JavaScript, e disporre di un progetto Lovable e di un account CometAPI prima di seguire i passaggi di implementazione.
Key Takeaways
Sviluppo alimentato dall’AI: genera e affina applicazioni usando prompt in linguaggio naturale.
Capacità full-stack: crea esperienze frontend con funzioni backend, database, autenticazione e hosting.
Architettura moderna: i nuovi progetti Lovable hanno adottato TanStack Start basato su React e SSR nel maggio 2026.
Revisionato per chiarezza, attribuzione delle fonti e terminologia API aggiornata.
Compatibilità con CometAPI: aggiungi inferenza di modelli esterni tramite una funzione backend sicura.
Casi d’uso ideali: MVP, assistenti AI, strumenti interni, applicazioni di contenuti e portali clienti.
What Is Lovable and How Does It Work?
Lovable (lovable.dev) è una piattaforma alimentata dall’AI per costruire applicazioni web full‑stack di livello produttivo usando il linguaggio naturale. Il suo sito ufficiale e la panoramica del prodotto sono i punti di partenza per esplorare la piattaforma.
Descrivi ciò che desideri in un’interfaccia chat e genera un’app funzionante con:
Backend, database, autenticazione e storage (tramite Lovable Cloud integrato, che è un Supabase gestito)
Integrazioni, deployment e codice modificabile di tua proprietà
Supporta l’intero ciclo di vita del prodotto—dal prototipo al deployment—e può sincronizzare il codice con GitHub, GitLab o Bitbucket. È pensato per founder, product manager, non‑sviluppatori e team che vogliono muoversi rapidamente mantenendo la proprietà del codice. Ha avuto origine dal progetto open‑source GPT Engineer (fondato a Stoccolma nel 2023 da Anton Osika e Fabian Hedin) ed è stato rebrandizzato/commercializzato come Lovable.
How Lovable Turns Prompts Into Applications
Descrivi utenti, pagine, funzionalità e regole di business dell’applicazione.
Genera la prima app e ispeziona l’anteprima.
Collega database, accesso, pagamenti o API esterne.
Testa il comportamento e affina codice, design e workflow.
Pubblica o continua a mantenere il codice dell’applicazione esportata.
L’articolo tecnico del 1° giugno 2026 descrive il passaggio a TanStack Start basato su React e al rendering lato server per i nuovi progetti a partire dal 13 maggio 2026. I progetti esistenti React + Vite mantengono la precedente architettura; verifica il progetto effettivo prima di scegliere un’implementazione con server function o Edge Function.
Lovable Technical Specifications
Specifica
Lovable
Categoria
Builder di applicazioni web basato su AI
Interazione primaria
Prompt in linguaggio naturale
Framework per nuovi progetti
React e TanStack Start
Rendering
Rendering lato server per nuovi progetti
Architettura precedente
React + Vite
Backend
Lovable Cloud e integrazioni supportate
Autenticazione e database
Supportati
API esterne
Connettori e richieste API personalizzate
Integrazione AI
Lovable AI e API di modelli esterni
Accesso al codice
Codice generato e workflow GitHub
Collaborazione
Funzionalità di workspace e progetto
Deployment
Opzioni integrate e supporto esterno
Lovable è una piattaforma di sviluppo applicativo, non un foundation model. Pertanto, parametri, context window, throughput di token e punteggi MMLU non descrivono Lovable in sé. Appartengono ai modelli AI specifici coinvolti nello sviluppo o nell’inferenza.
Can You Configure CometAPI in Lovable?
Sì—all’interno delle applicazioni generate con Lovable. CometAPI può gestire richieste ai modelli da una funzione backend protetta. Ciò è distinto dal cambiare quale LLM alimenta l’agente di coding di Lovable.
Puoi integrare CometAPI nelle applicazioni costruite con Lovable, a condizione che i modelli e le interfacce selezionati siano supportati.
Questo non significa che puoi sostituire direttamente il modello proxy di sviluppo utilizzato da Lovable stesso.
Se il tuo obiettivo è controllare quali modelli la tua applicazione richiama, dovresti configurare il routing dei modelli nel tuo codice lato server.
Integrazione
Compatibilità
Spiegazione
Funzionalità AI in un’app generata
Sì
Richieste API lato server protette
Chatbot o assistente di scrittura
Sì
Chiama modelli chat supportati da CometAPI
App multi‑modello
Sì
Configura gli ID dei modelli nel routing backend
Sostituire il modello interno di coding di Lovable
Non previsto come impostazione standard
La selezione del modello dell’agente interno è separata
Servizio backend tramite CometAPI
Sì
Integrazione HTTP personalizzata o server function
API di gestione del workspace Lovable
Separata
Controlla le risorse della piattaforma, non l’inferenza dei modelli
La spiegazione dell’orchestrazione dei modelli interni di Lovable descrive come opera l’agente di sviluppo. L’integrazione CometAPI di seguito riguarda l’inferenza nell’applicazione; questo articolo non afferma l’esistenza di un’impostazione documentata di CometAPI per quell’agente interno.
How the Lovable and CometAPI Architecture Works
Lovable supporta questo in due modi principali per le app che costruisci:
Secrets (consigliato per uso diretto)
Archivia la tua chiave CometAPI come secret del progetto (ad es., COMETAPI_KEY o OPENAI_API_KEY). Chiedi a Lovable nella chat del progetto di integrare l’API tramite una Edge Function sicura. La chiave resta lato server e non viene mai esposta nel browser.
Custom connector
Crea un connettore personalizzato nel catalogo Connectors del workspace. Configura la base URL (https://api.cometapi.com/v1), l’autenticazione (Bearer token o header personalizzato), quindi aggiungi una connessione incollando la tua chiave CometAPI. Le richieste passano attraverso il gateway dei connettori di Lovable, mantenendo le credenziali cifrate e fuori dal tuo codice.
Note:
Le funzionalità AI integrate per le app usano chiavi gestite da Lovable e consumano crediti del workspace. Non puoi sostituirle con una chiave CometAPI (o di un altro provider).
Per chiamate AI esterne all’interno della tua app (chatbot, generazione, ecc.), l’approccio con secrets o connettore personalizzato funziona e fattura l’uso al tuo account CometAPI invece dei crediti Lovable.
Non ci sono evidenze di un supporto nativo/predefinito di CometAPI nel catalogo dei connettori di Lovable alla data della documentazione più recente; lo configuri come integrazione generica compatibile con OpenAI o come API personalizzata.
In breve: Lovable è un potente builder “vibe‑coding” / da prompt a app full‑stack, e sì—puoi configurare e usare in modo sicuro una chiave CometAPI per funzionalità AI all’interno delle app che crei con esso.
Il browser invia input al backend dell’applicazione. Il backend legge un secret, chiama CometAPI e restituisce il risultato. Non inserire mai chiavi API private nei componenti React o in altro codice client‑side.
How to Build an AI Writing Assistant With Lovable and CometAPI
Il seguente esempio crea SmartWrite, un assistente di scrittura AI con un input di testo, selezione del tono e una richiesta CometAPI lato server. Scegli il pattern di boundary di TanStack per un progetto più recente o il punto d’ingresso completo Supabase Edge Function per un progetto più vecchio. Scegli un’unica implementazione backend in base al tuo progetto, configura i secrets e verifica un modello chat supportato nel tuo account CometAPI. Prima di pubblicare, esegui l’esempio con i tuoi secrets di progetto e un modello chat disponibile per il tuo account.
Build a responsive AI writing assistant named SmartWrite.
Include a dashboard, a large prompt box, a tone selector
(Professional / Friendly / Concise), a Generate button,
and an output panel with Copy and Clear controls.
Use a clean responsive design with loading states and errors.
Implement AI generation only through a secure server function.
Never expose API credentials to the frontend.
Do not ship mock AI responses.
Step 2: Configure the CometAPI Credential
Genera una chiave nel tuo account CometAPI e verifica un ID modello chat disponibile per quell’account. Questo tutorial usa un’integrazione diretta backend, con COMETAPI_API_KEY e COMETAPI_MODEL come configurazione lato server. Segui il meccanismo di accesso ai secrets supportato dal backend nel tuo progetto generato.
Configuration example: Where to Store and Use CometAPI Credentials
Per connettere CometAPI in modo sicuro, chiedi a Lovable di creare un’integrazione lato server e di richiedere la chiave API tramite il suo modulo di input sicuro. Puoi anche gestire i secrets del progetto in More → Settings → Secrets. Per un backend Supabase esterno, configura i secrets in Supabase. Vedi la guida ufficiale ai Secrets di Lovable.
Segui questi quattro requisiti:
Archivia e leggi le chiavi API solo sul server. Aggiungi COMETAPI_API_KEY tramite l’interfaccia sicura dei Secrets del progetto. Leggila esclusivamente da secrets lato server o binding di runtime. Non includere mai la chiave nel codice frontend, in variabili d’ambiente accessibili dal browser, in messaggi di chat o in screenshot.
Mantieni la configurazione dell’API fuori dalle richieste frontend. Configura COMETAPI_MODEL sul server usando un ID modello CometAPI verificato. Il frontend dovrebbe inviare solo prompt e tone. Valida le richieste contro questi campi consentiti e rifiuta proprietà inattese, incluse config, apiKey e model. Non consentire mai ai client di fornire chiavi API arbitrarie o di sovrascrivere la configurazione del modello lato server.
Usa il corretto metodo di accesso ai secrets per il runtime. L’implementazione deve corrispondere all’ambiente backend effettivo del progetto. I deployment basati su Worker usano binding iniettati, mentre le Supabase Edge Function possono accedere ai secrets tramite Deno.env. Non presumere che process.env, Deno.env e i binding dei Worker siano intercambiabili. Verifica come i secrets vengono iniettati prima di implementare l’handler dell’API.
Verifica la protezione dei secrets dopo la pubblicazione. Ispeziona il bundle JavaScript di produzione, il pannello Network degli Strumenti di Sviluppo del browser e i log dell’applicazione. Conferma che le chiavi API non compaiano mai negli asset client‑side, nei payload delle richieste, nelle risposte, negli URL o nei log. Verifica inoltre che le richieste CometAPI vengano eseguite sul server e che i tentativi non autorizzati di sovrascrittura della configurazione vengano rifiutati.
Un secret salvato non significa automaticamente che l’integrazione sia sicura o funzionale. L’integrazione è pronta solo quando le chiamate API lato server funzionano, le richieste client non possono sovrascrivere le impostazioni protette e i controlli in produzione confermano che le credenziali rimangono private.
Usa il seguente diagramma architetturale per identificare il boundary frontend‑to‑backend e la posizione delle credenziali protette. Il diagramma è concettuale, non uno screenshot dell’interfaccia delle impostazioni di Lovable.
Prompt to give Lovable
Connetti SmartWrite direttamente a CometAPI tramite una funzione backend autenticata. Chiedimi COMETAPI_API_KEY in un modulo di secret sicuro e usa COMETAPI_MODEL per l’ID modello esatto che fornisco. Invia richieste POST a https://api.cometapi.com/v1/chat/completions solo dal server. Accetta prompt e tono, validali, applica limiti per utente e restituisci solo il testo generato al frontend. Usa il runtime backend già presente in questo progetto. Non inserire credenziali nella chat, nel codice frontend o nelle richieste del browser. Non generare risultati di successo fittizi. Spiega come testare l’integrazione e mostra errori sanitizzati quando fallisce.
Lovable supporta anche connettori personalizzati gestiti. Le istruzioni qui usano intenzionalmente il percorso di integrazione diretta documentato nella sua guida all’integrazione di qualsiasi API, così da allinearsi all’helper lato server qui sotto.
Step 3: Test the CometAPI Chat Endpoint
Da un terminale Bash affidabile, imposta COMETAPI_API_KEY e COMETAPI_MODEL localmente, quindi testa POST https://api.cometapi.com/v1/chat/completions. La guida ufficiale alle richieste di CometAPI documenta la base URL, l’autenticazione Bearer e il formato della risposta chat. Seleziona un modello che supporti questo endpoint; la compatibilità non garantisce ogni funzionalità o parametro del provider.
# Set COMETAPI_API_KEY securely in this terminal before running.
# Replace the model value with a chat model verified in your account.
export COMETAPI_MODEL="YOUR_VERIFIED_CHAT_MODEL_ID"
: "${COMETAPI_API_KEY:?Set COMETAPI_API_KEY first}"
curl --fail-with-body --max-time 45 \
https://api.cometapi.com/v1/chat/completions \
-H "Authorization: Bearer $COMETAPI_API_KEY" \
-H "Content-Type: application/json" \
--data "$(printf '{"model":"%s","messages":[{"role":"user","content":"Write a customer welcome email."}],"stream":false}' "$COMETAPI_MODEL")"
Punto di controllo: una risposta di successo contiene choices[0].message.content. Se l’autenticazione fallisce o il modello non è disponibile, correggi prima questo aspetto prima di collegare l’interfaccia utente. Non incollare credenziali complete o prompt privati in screenshot diagnostici.
Step 4: Connect CometAPI Through a Secure Backend
Lovable supporta due architetture backend:
Nuovi progetti (TanStack Start): usa createServerFn per gestire le richieste API sul server.
Progetti React + Vite più vecchi: usa Supabase Edge Function per le chiamate API lato server.
Scegli l’implementazione che corrisponde all’architettura del tuo progetto.
Archivia COMETAPI_API_KEY e COMETAPI_MODEL come binding dei Worker lato server. Se il tuo deployment usa un altro adapter, utilizza il suo meccanismo supportato per l’accesso ai secrets.
Aggiungi COMETAPI_API_KEY e COMETAPI_MODEL ai secrets del progetto Supabase, quindi distribuisci la funzione.
In entrambi gli approcci, mantieni le credenziali API sul server. Le applicazioni in produzione dovrebbero anche implementare autenticazione, validazione dell’input e limiti d’uso per utente.
Step 5: Connect the Lovable Interface
TanStack Start client
import { generate } from "./server/writing.functions";
const { text } = await generate({ data: { prompt, tone } });
// Render text as text content, not as trusted HTML.
React + Vite client
// Use the existing, signed-in Supabase client generated for your project.
const { data, error } = await supabase.functions.invoke("generate-writing", {
body: { prompt, tone },
});
if (error) throw new Error("Generation failed. Please try again.");
const text = data.text;
Usa il client che corrisponde al ramo scelto. TanStack usa il suo endpoint RPC generato; Supabase usa la funzione generate‑writing distribuita. Nessuno dei due richiede l’invenzione di una route separata /api/generate. Il browser può inviare il token di sessione dell’applicazione per l’autenticazione, ma non deve mai inviare la credenziale privata CometAPI o un oggetto di configurazione. Mostra stati di caricamento, errore e retry nell’interfaccia.
Step 6: Test and Publish the Application
Dopo la pubblicazione, testa l’URL live invece di fare affidamento solo sull’anteprima dell’editor. Usa credenziali di test private e mantieni screenshot e prove privi di valori segreti. Completa questi controlli prima di un accesso più ampio:
Ispeziona il JavaScript del browser compilato, le source map e la configurazione pubblica alla ricerca della chiave CometAPI privata. Esegui ricerche localmente senza stampare la chiave in output condivisi del terminale o salvarla in report. Il solo nome della variabile non è prova di una perdita di valore.
Ispeziona le richieste Network del browser, inclusi payload, header e risposte di errore. La richiesta dovrebbe contenere solo gli input di scrittura consentiti e i dati di autenticazione dell’applicazione; l’header Authorization con la chiave CometAPI privata appartiene solo alla richiesta server‑to‑provider.
Rivedi i log delle funzioni, i log dell’applicazione, le tracce di monitoraggio e i report di errore. Non registrare chiavi, bearer token, oggetti di configurazione o corpi completi di errori upstream. Se una chiave è stata esposta, revocala e sostituiscila, quindi rimuovi l’esposizione prima di ritestare.
Prova richieste con utente disconnesso e sessione scaduta; entrambe devono essere rifiutate prima di una chiamata al provider. Invia apiKey, config o model come campo extra e verifica il rifiuto. Testa prompt vuoti e sovradimensionati, un tono non valido, failure del provider e la tua quota per utente distribuita.
Conferma che una richiesta valida con utente autenticato produca testo con il modello selezionato. Registra la versione del deployment e risultati di successo/fallimento sanitizzati; gli esempi non stabiliscono che il tuo deployment abbia superato questi controlli.
What Can You Build With Lovable and CometAPI?
Progetto
Ruolo di CometAPI
Funzionalità possibili
Assistente di scrittura AI
Bozza e riscrittura contenuti
Selezione tono, modelli, editor
Riassuntore di documenti
Riassume testo estratto
Upload, Q&A su documenti, punti chiave
Support desk clienti
Classifica e redige risposte
Triage ticket, risposte suggerite
Assistant di analytics
Spiega dati di business
Dashboard KPI, insight in linguaggio naturale
I prompt normali producono risposte leggibili del modello.
I prompt vuoti e sovradimensionati vengono rifiutati in sicurezza.
Le credenziali API non compaiono mai nel pannello network del browser.
Le interruzioni dei modelli restituiscono messaggi d’errore non sensibili.
Gli utenti autenticati hanno limiti di richiesta e monitoraggio attività.
Il layout si comporta correttamente su desktop e mobile.
Questi sono pattern progettuali suggeriti, non affermazioni su deployment completati o valutati indipendentemente.
FAQ
Come dovrebbe un’app multi‑tenant impedire che i record di un cliente compaiano nella risposta AI di un altro?
Deriva il tenant e l’identità utente dalla sessione server verificata, quindi limita ogni lookup di database prima di assemblare il contesto del modello. Non fidarti mai di un tenant ID fornito dal browser né di un’istruzione nel prompt per far rispettare l’accesso. Dove supportato, aggiungi policy di riga a livello di database e verificale con due account di test. Metti alla prova ID di record, risultati di ricerca, file esportati e cronologia conversazioni per accessi cross‑tenant.
Quando è preferibile la retrieval‑augmented generation rispetto all’inserire i documenti direttamente in ogni prompt?
Usa la retrieval quando la raccolta di documenti è troppo grande per essere inviata ogni volta, cambia frequentemente o richiede tracciabilità a livello di fonte. Analizza e indicizza i documenti, recupera un piccolo set rilevante e allega identificatori di fonte alla risposta. La retrieval richiede comunque valutazione: una risposta fluente può citare un passaggio irrilevante. Mantieni filtri di accesso nella query di retrieval e testa domande le cui risposte sono assenti. Per un documento piccolo e stabile, il contesto diretto può essere un punto di partenza più semplice.
Come aggiungere lo streaming senza mostrare risposte spezzate o fuorvianti?
Tratta lo streaming come una funzionalità di trasporto separata, non come una sostituzione a una riga di stream: false. Conferma il formato di streaming del modello selezionato, fai sì che il backend inoltri gli eventi e gestisci chunk parziali, cancellazioni, timeout e perdita di connessione nell’interfaccia. Contrassegna una risposta interrotta come incompleta e consenti all’utente di riprovare deliberatamente. Evita di visualizzare testo in streaming come HTML trusted. Testa sul percorso di hosting pubblicato perché intermediari possono bufferizzare uno stream che sembrava funzionare localmente.
Cosa dovrebbe verificare una policy di fallback prima di passare a un altro modello?
Definisci quali failure giustificano un retry o un fallback, quindi verifica se l’alternativa supporta lo stesso endpoint, istruzioni, schema di tool e formato di output. Mantieni i retry limitati ed evita di cambiare modello silenziosamente per workflow che richiedono comportamento consistente. Valuta il fallback su prompt rappresentativi, includendo casi di rifiuto e di output malformato. Se l’output del modello attiva un’azione esterna, proteggi quell’azione con una conferma separata o una regola di idempotenza così che una generazione ritentata non possa ripeterla.
Quali evidenze dovrebbe conservare un team prima di promuovere una funzionalità AI da pilota a uso regolare?
Mantieni un set di valutazione versionato con comportamenti attesi, configurazione di modello e prompt, metadati di richiesta redatti e registri dei casi falliti. Definisci criteri di accettazione per accuratezza fattuale, forma della risposta, latenza e confini di accesso; confronta i risultati dopo modifiche a modello o prompt. Per input sensibili, decidi cosa può essere trasmesso e conservato prima di abilitare la funzionalità. Questi sono controlli ingegneristici suggeriti, non affermazioni che Lovable o CometAPI garantiscano un particolare esito regolatorio.
Conclusion: Is Lovable Worth Using?
Lovable rende più semplice tradurre idee in applicazioni funzionanti. Il suo tooling full‑stack e le integrazioni esterne sono particolarmente utili per convalidare rapidamente concetti di prodotto. CometAPI aggiunge un percorso flessibile per l’inferenza dei modelli in chat, scrittura, analytics e altri workflow alimentati dall’AI.
Inizia con un’app piccola e sicura, testa la connessione a CometAPI, rivedi il codice generato ed espandi dopo che l’esperienza principale si dimostra affidabile.
