← Tornar a l'inici del curs

Xuletes (una pàgina per sessió)

El mínim imprescindible de cada sessió, per tenir-ho a mà mentre treballes. Imprimeix la que toqui o tingues-la oberta en una pestanya.


🧠 Xuleta — Sessió 0: Com funciona una app

Els 4 pilars (amb el restaurant): - Frontend = la sala i la carta (el que veus). Si ho toques amb el dit, és frontend. - Backend = la cuina (la lògica que no veus). - Base de dades = el rebost ordenat (text, números, dates). - Emmagatzematge = el magatzem d'abrics (fitxers: fotos, PDFs). En Google, Drive.

Clau: una foto no va dins la base de dades → va a l'emmagatzematge, i la base de dades guarda l'enllaç (URL).

La IA: és un programa que endevina la resposta. De vegades s'inventa coses → cal provar-ho sempre.


🚀 Xuleta — Sessió 1: La teva primera app

El flux: Cara (Index.html) → Motor (Codi.gs) → Rebost (el full).

Els passos: 1. Aspecte — tria color/estil i mira el mockup. 2. Full — crea'l (a mà o amb Gemini) amb les capçaleres a la fila 1. 3. Codi — copia el prompt → Gemini → torna els DOS fitxers. 4. EnganxaCodi.gs (Ctrl+A, enganxa) + fitxer HTML nou anomenat exactament Index. 5. PublicaImplementar → Nova implementació → Aplicació web → copia l'enllaç /exec.

Regla d'or: una app, un full nou.

Recorda: - L'avís «Google no ha verificat» és normal: Configuració avançada → Permet. - El fitxer HTML s'ha de dir Index.


🔧 Xuleta — Sessió 2: Fer-la créixer (i arreglar-la)

El bucle: prompt → llegir → provar → arreglar → re-promptejar. 🔁

Quan peta: 1. Llegeix l'error abans de tocar res. 2. Enganxa l'error + el teu codi a la IA (prompt de depuració). 3. Substitueix els dos fitxers sencers. 4. Republica amb Versió nova (mateix enllaç).

Per millorar (mateix enllaç!): Gestionar implementacions → llapis → Versió nova → Implementar.

Recorda: la IA no edita; et dona codi nou → l'enganxes tu, sencer, al mateix projecte.

«Trencar i arreglar és NORMAL.»


🏠 Xuleta — Sessió 3: GitHub i el context

Local vs remot: LOCAL = on treballes (Codespace) · REMOT = la casa oficial (GitHub.com).

Les 3 paraules: - Commit = desar amb una nota (local). - Push = pujar a GitHub (local → remot). - Pull = baixar de GitHub (remot → local).

El mètode del context (carpeta context/): - que-ha-de-fer.md = el producte (el QUÈ). - arquitectura.md = el tècnic (el COM). - Instrucció: «Llegeix la carpeta context/ i construeix. Torna'm Codi.gs i Index.html.»

Publica COM SEMPRE: copiar a Apps Script → /exec. (Encara no des de GitHub.)

«El secret no és l'eina, és el context.» · «Una app, un repo nou.»


🤝 Xuleta — Sessió 4: Branques i pull requests

Per què: main és la versió bona. Les proves, en una branca a part.

El flux: 1. Crea una branca des de main. 2. Fes el canvi amb l'agent → commit + push A LA BRANCA. (Mira el nom de la branca!) 3. Obre un Pull Request → mira el diff (verd = afegit, vermell = tret). 4. Revisa'l amb la IA (enganxa-li el diff). La IA dona pistes; decideixes tu. 5. Mergeesborra la branca → torna a main + pull.

Recorda: fusionar encara no publica (això és la S5). Publiques copiant a Apps Script.

«Una branca per canvi.» · «Abans de cada commit, mira el nom de la branca.»


⚙️ Xuleta — Sessió 5: Desplegar = fusionar

La idea: muntes una canonada una vegada; després, cada merge a main publica sol.

Ho fa l'agent (prompt mestre): crea .clasp.json + deploy.yml + et diu el secret.

Els 3 clics que NOMÉS pots fer tu (són del teu compte): 1. clasp login (autoritza + enganxa el codi). 2. Activa l'API d'Apps Script (script.google.com/home/usersettings → ON). 3. Afegeix el secret a GitHub (NOM exacte com al workflow).

Quan l'Action falli (i fallarà): és el bucle. Enganxa el log vermell + el workflow a l'agent → arregla → torna a executar.

«clasp viu dins de l'Action, no a la teva terminal.» · «Si peta, és el bucle.»


♾️ Xuleta — Fase 6: Ara crees tu

El bucle infinit: idea → context → agent → branca/PR/revisió → es desplega sol → galeria → repetir.

El mapa (per anar més enllà d'Apps Script): - Firebase → el salt més suau (encara Google). - Supabase → base de dades SQL, fora de Google. - Vercel / Netlify → publicar webs modernes des de GitHub. - Replit → tot al navegador. - Google Cloud → per quan calgui. - Constructors amb IA → descrius i te la munten.

Per aprendre'n qualsevol: el prompt «Aprèn-la amb la IA» (al banc de prompts).

«No us hem ensenyat una eina; us hem donat un mètode i un mapa.»

Pàgina generada automàticament des de recursos/chuletes.md · revisat el 2026-06-14. Edita el .md, no aquest fitxer.