Allotjar una app creada amb Claude Code: Git i desplegament

Claude Code et pot ajudar a crear una aplicació al projecte local, però l’agent de codi i l’allotjament són coses diferents. Per posar l’app en una URL pública has de revisar el codi, triar on s’executa i connectar-hi un domini. Aquesta guia explica el camí Claude Code → Git → Hostbrid sense donar per feta la compatibilitat d’una app fins que l’hagis provada.

Anthropic descriu Claude Code com una eina que treballa des del terminal de l’entorn de desenvolupament. Si et refereixes a un Artifact de Claude, el flux és diferent: pots compartir el prototip des de Claude; quan vulguis portar-ne el codi a un editor i preparar infraestructura pròpia, consulta la guia per posar un Artifact al teu domini.

1. Comprova què ha generat Claude Code

Des de la carpeta del projecte, revisa package.json, el README, els fitxers de configuració i l’estat de Git. Identifica el framework, la branca amb la versió correcta i les ordres d’instal·lació, build i inici. No copiïs cegament a producció les ordres que suggereix un agent: confirma que existeixen i executa el projecte en local.

Separa els fitxers que Claude t’ha ajudat a crear dels serveis que encara necessita l’app. Genera HTML estàtic? Arrenca un procés Node? Crida una API o necessita base de dades, inici de sessió, emmagatzematge o tasques programades? Una web React pot ser estàtica, però una ruta de servidor o una acció de backend canvia el requisit d’allotjament.

2. Protegeix les claus i els serveis externs

Busca referències a process.env, import.meta.env, APIs, OAuth i fitxers .env. Afegeix .env a .gitignore abans del primer push i no pugis mai una clau d’API al repositori o al codi que s’executa al navegador. Desa els secrets a l’entorn d’execució adequat i comprova quines variables necessita l’app durant la build i l’arrencada.

Si Claude ha escrit codi que crida un proveïdor d’IA des de React, mou la clau al servidor abans de publicar. Una variable VITE_* s’inclou al bundle del navegador; no és un magatzem de secrets. Revisa també les quotes i els costos del proveïdor, CORS, les URL de retorn OAuth i les regles d’accés de la base de dades.

3. Puja el codi i tria un destí

Puja el projecte a un repositori Git i revisa’n el diff i els fitxers inclosos. Hostbrid Projects pot connectar un repositori per desplegar; les opcions disponibles depenen del pla i del mode de servei. Si el repositori només genera fitxers estàtics, Sites pot encaixar-hi. Si necessites administrar el sistema i els contenidors, considera un VPS; en aquest cas operes el servidor.

A Projects, selecciona la branca de producció i valida les ordres reals d’instal·lació, build i sortida. Si necessita un procés Node o Docker, comprova que el teu pla inclogui el servei i configura el port i les variables segons l’app. Claude Code no connecta per si mateix el repositori a Hostbrid, no publica una build ni configura automàticament DNS o HTTPS.

4. Prova abans d’apuntar-hi el domini

Comença amb la URL temporal. Obre directament les rutes internes i prova formularis, autenticació, crides al backend i escriptures. Confirma que els logs no contenen secrets i que les integracions accepten el domini nou. Una build correcta no demostra que funcionin rutes, pagaments o dades.

Quan les proves passin, connecta el domini i comprova HTTPS, redireccions i callbacks. Mantén accessible el desplegament anterior fins que hagis revisat el nou. Si l’app té dades, prepara’n una còpia i un pla de restauració abans de canviar esquemes o moure l’emmagatzematge.

En la pràctica: Claude Code ajuda a produir el codi; Git en controla les versions; l’allotjament serveix o executa l’app; els serveis externs mantenen la seva pròpia configuració i cost. Revisa els plans i recursos actuals abans de desplegar.

Fonts: Claude Code: inici d’Anthropic · Claude Artifacts: del prototip a producció · Hostbrid Projects