Com afegir una base de dades a la teva app (sense perdre dades més endavant)

Per afegir una base de dades a la teva app, tria una base de dades relacional gestionada (Postgres és l'opció habitual), guarda la cadena de connexió en un secret del servidor, crea una taula per a cada tipus de cosa que guarda l'app i fes que el backend, i no el navegador, llegeixi i escrigui en ella. Si construeixes amb un constructor d'apps amb IA, normalment pots dir «guarda això en una base de dades» i l'agent crearà les taules i el codi; la teva feina és descriure bé les dades i comprovar que es guarden de veritat.

Aquesta guia explica quan necessites una base de dades, les opcions principals, com descriure les teves dades i els errors que provoquen pèrdues o filtracions de dades.

Quan la teva app necessita una base de dades

Necessites una base de dades quan la teva app ha de recordar alguna cosa després que la pàgina es tanqui, o compartir dades entre persones. Senyals típics:

• Els visitants envien alguna cosa: un formulari, un registre, una reserva o una comanda
• Els usuaris tenen comptes amb el seu propi contingut desat
• Un administrador ha de veure o editar el que han creat altres
• Vols informes o recomptes al llarg del temps

No n'necessites una per a un lloc estàtic on tothom veu el mateix contingut, com un portfolio o una pàgina de presentació senzilla. Si no tens clar què és una base de dades, llegeix primer què és una base de dades.

Les teves opcions

Per a la majoria d'apps web petites i mitjanes, una base de dades relacional com Postgres és l'opció per defecte adequada. És bona per a les relacions (un client té moltes comandes), manté les dades coherents i et permet fer preguntes més endavant amb SQL. Consulta què és Postgres per a una explicació senzilla.

Descriu les teves dades abans de construir

La cosa més útil que pots fer és anotar les coses que guarda la teva app i com es connecten entre elles. No cal que usis jargó de bases de dades. Per a una app de reserves:

• Clients: nom, correu electrònic, telèfon
• Serveis: nom, durada, preu
• Reserves: quin client, quin servei, hora d'inici, estat (pendent, confirmada, cancel·lada)

Això són tres taules. «Quin client» i «quin servei» es converteixen en enllaços (claus forànies) entre elles. Fer-ho bé d'entrada importa molt més que qualsevol decisió tecnològica, perquè canviar la forma de dades que ja tenen files reals és més difícil que canviar el disseny d'una pàgina.

Algunes regles pràctiques:

• Una taula per a cada tipus de cosa. No posis comandes dins d'una columna de text del client.
• Dona a cada fila un ID i una data de creació. Els dos els voldràs més endavant.
• Usa tipus adequats. Les dates com a dates, els diners com a cèntims enters o un tipus decimal, no com a text.
• Marca els camps obligatoris com a obligatoris. Deixa que la base de dades rebutgi les dades incorrectes, no només el formulari.

Prompts d'exemple

Comença amb una funcionalitat cada vegada, en lloc de bolcar un esquema complet:

Afegeix una base de dades a aquesta app. Crea una taula de reserves amb nom del client, correu electrònic, servei, hora d'inici i estat (pendent, confirmada, cancel·lada; per defecte pendent). Desa les sol·licituds del formulari de reserves a la taula, mostra un missatge d'èxit i afegeix una pàgina d'administració que llisti les reserves de la més recent a la més antiga.

Despràs, amplia-la:

Afegeix una taula de serveis (nom, durada en minuts, preu en cèntims). Substitueix el camp de servei de text lliure de les reserves per un enllaç a serveis i migra les reserves existents sense esborrar-ne cap.

I després, endureix-la:

Assegura't que totes les lectures i escriptures a la base de dades es fan al servidor. El navegador mai no ha de rebre la cadena de connexió a la base de dades. Valida el correu electrònic i l'hora d'inici al servidor abans d'inserir.

Pas a pas

1. Llista les teves dades tal com s'ha explicat: coses, camps i enllaços entre elles.
2. Crea la base de dades. En un constructor d'apps amb IA, demana-la al xat. En altres casos, crea una instància de Postgres gestionada i copia la seva cadena de connexió.
3. Guarda la cadena de connexió com a secret (una variable d'entorn al servidor), mai al codi. Consulta variables d'entorn i secrets.
4. Crea les taules. Usa migracions (scripts versionats que canvien l'esquema) perquè els canvis siguin repetibles i reversibles.
5. Construeix les rutes del servidor que creen, llegeixen, actualitzen i esborren files (CRUD). El navegador crida aquestes rutes; mai parla directament amb la base de dades.
6. Connecta la interfície a aquestes rutes: formularis que desen, llistes que es carreguen, estats buits quan encara no hi ha res.
7. Prova la persistència. Envia alguna cosa, recarrega la pàgina, obre-la en un altre navegador. Si les dades no hi són, no s'han desat a la base de dades.
8. Comprova l'accés. Entra amb un segon usuari i confirma que no pots veure ni editar les dades del primer.
9. Publica i torna a provar a l'URL en viu, ja que l'app publicada pot usar una connexió diferent de la vista prèvia.

Errors habituals

• Desar al navegador i pensar que s'ha desat. El localStorage sembla que funciona fins que algú obre l'app en un altre dispositiu. Prova sempre en un segon navegador.
• Posar la cadena de connexió al codi del front-end. Qualsevol pot llegir el codi del front-end. Això li dona accés a tota la teva base de dades.
• No tenir comprovacions d'accés. «Mostra les meves comandes» ha de filtrar per l'usuari connectat al servidor, no a la interfície. És el forat de seguretat més habitual en apps creades amb IA; la nostra llista de seguretat ho cobreix.
• Canvis destructius de l'esquema. Demanar que es «canviï el nom de la taula» o «canviï l'estructura» pot eliminar-la i tornar-la a crear. Quan hi ha dades reals, digues «migra les files existents, no esborris res».
• Guardar fitxers dins de la base de dades. Les imatges i els PDF pertanyen a un emmagatzematge de fitxers, i a la taula només hi va la seva URL o clau. Consulta com afegir pujada de fitxers.
• Sense còpies de seguretat. Abans de tenir clients, saps com fa còpies la teva plataforma i com les restauraries?

Llista de comprovació

• Cada tipus de cosa té la seva pròpia taula amb un ID i una data de creació
• La base de dades fa complir els camps obligatoris i els tipus
• La cadena de connexió només viu en secrets del servidor
• Totes les lectures i escriptures passen per rutes del servidor
• Cada usuari només pot llegir i canviar les seves pròpies files
• Les dades sobreviuen a una recàrrega i es veuen en un altre navegador
• Els canvis d'esquema usen migracions i conserven les files existents
• Saps com funcionen les còpies de seguretat i la restauració
• L'app en viu s'ha provat després de publicar-la

Afegir una base de dades a Mythex

A Mythex, cada projecte pot tenir la seva pròpia base de dades Postgres dedicada, tant al Free com al Pro. Normalment no cal cap botó separat per «adjuntar»: demana-ho al xat («desa els correus de la llista d'espera en una base de dades») o escriu /database, i els detalls de connexió s'injecten a l'espai de treball i a la teva app publicada. La configuració del projecte mostra si hi ha una base de dades activa.

La base de dades s'adormeix després de 5 minuts d'inactivitat i es desperta amb la següent petició. L'ús publicat es cobra pel temps que ha estat realment activa, des del mateix saldo de crèdits que uses per construir. Si afegeixes una base de dades després d'haver publicat, torna a publicar perquè l'app en viu la rebi.

Consulta Base de dades i la recepta Construir una app CRUD a la documentació. Per a la part d'inici de sessió de les dades per usuari, llegeix com afegir inici de sessió a la teva app.

Preguntes