Voglio essere molto chiaro su una cosa prima di iniziare.
Conserva questo :)
Non sono uno sviluppatore. Non lo sono mai stato. Non ho una laurea in informatica. Non ho frequentato nessun bootcamp di programmazione. Non so leggere la maggior parte del codice e dirti cosa fa.
Ma lo scorso weekend ho pubblicato un'applicazione web funzionante su internet. Utenti reali si sono registrati. Dati reali sono stati salvati. Funzionalità reali hanno funzionato.
Ho costruito l'intera cosa con Claude Code in due giorni. E vi dirò la verità su com'è stata quell'esperienza. Non la versione edulcorata. La realtà caotica, frustrante e piena di scoperte.
Perché ogni storia del tipo "Ho creato un'app con l'IA" online sembra semplice. Non è semplice. Ma è decisamente possibile.
Sabato Mattina: L'Idea
Volevo creare uno strumento semplice. Un calendario di contenuti che ti permetta di pianificare i tuoi post su varie piattaforme, trascinarli tra i giorni e segnarli come pubblicati. Niente di rivoluzionario. Ma qualcosa di cui avevo effettivamente bisogno per il mio flusso di lavoro.
Ho aperto Claude Code nel mio terminale per la prima volta alle 9:00 di sabato.
Alle 9:15 avevo già fatto il mio primo errore.
Errore #1: Iniziare Senza Un Piano
Il mio primissimo prompt per Claude Code è stato:
Crea un'app per il calendario dei contenuti
Claude ha generato un mucchio di file. Qualcosa è apparso sullo schermo. Sembrava un calendario di contenuti progettato da qualcuno che non aveva mai visto un calendario.
È qui che il 90% delle persone si arrende. Scrivono un prompt vago, ottengono un risultato vago e concludono che il vibe coding non funziona.
Il problema non era Claude. Il problema ero io. Non gli avevo dato nulla su cui lavorare.
Cosa avrei dovuto fare:
Avrei dovuto iniziare in Plan Mode. Premi Shift + Tab in Claude Code per passare da Act Mode a Plan Mode. In Plan Mode, Claude pensa prima di costruire. Fa domande. Definisce l'architettura. Ti mostra cosa intende creare.
Sono tornato indietro e l'ho fatto correttamente:
Voglio creare un'app web per il calendario dei contenuti. Prima di scrivere qualsiasi codice, pianifichiamo.
L'app deve avere:
- Una vista settimanale con 7 colonne (da lunedì a domenica)
- La possibilità di aggiungere post con un titolo, una piattaforma (Twitter, LinkedIn, Instagram) e uno stato (bozza, programmato, pubblicato)
- Drag and drop per spostare i post tra i giorni
- Un design semplice e pulito usando Tailwind CSS
- Dati salvati in un database locale in modo che persistano tra le sessioni
Quale stack tecnologico dovremmo usare? Qual è la struttura delle cartelle? Illustrami l'architettura prima di costruire qualsiasi cosa.
Claude è tornato con un piano dettagliato. Next.js come framework. SQLite per il database. Tailwind per lo styling. Una struttura di cartelle pulita, file per file.
Lezione imparata: Inizia sempre in Plan Mode. Descrivi sempre cosa vuoi in dettaglio. I 5 minuti che passi a pianificare ti fanno risparmiare 2 ore di ricostruzione.
Errore #2: Cercare di Costruire Tutto in Una Volta
Dopo aver pianificato, mi sono entusiasmato. Ho chiesto a Claude di costruire l'intera cosa in un colpo solo.
Il risultato è stato un disastro. Alcune funzionalità funzionavano. Altre erano implementate a metà. Il drag and drop era rotto. Il database non salvava correttamente. Non avevo idea da dove iniziare per risolvere il problema.
Cosa avrei dovuto fare:
Costruire una funzionalità alla volta. Questa è la regola d'oro del vibe coding.
Ho ricominciato da capo seguendo quest'ordine:
Sessione 1: Solo il layout di base della pagina. Sette colonne. Nessuna funzionalità. Sessione 2: Aggiungere la possibilità di creare un post (solo un semplice modulo). Sessione 3: Visualizzare i post salvati nella colonna del giorno corretto. Sessione 4: Aggiungere la funzionalità di drag and drop. Sessione 5: Aggiungere la funzionalità dello stato (bozza/programmato/pubblicato). Sessione 6: Renderlo esteticamente gradevole.
Ogni funzionalità ha avuto la propria conversazione. Contesto fresco. Compito chiaro. Risultato pulito.
Quando costruivo una funzionalità alla volta, ognuna funzionava perfettamente. Quando cercavo di costruire tutto in una volta, niente funzionava.
Lezione imparata: Una conversazione per funzionalità. Non mescolare mai più funzionalità nella stessa sessione di Claude Code.
Errore #3: Non Creare un File CLAUDE.md
Sabato pomeriggio avevo un layout di base funzionante ed ero entusiasta. Ma continuavo a incontrare gli stessi problemi:
Claude aggiungeva continuamente complessità inutili. Creava elaborati sistemi di gestione degli errori quando volevo solo un semplice try-catch. Aggiungeva librerie di animazione quando volevo solo una transizione pulita. Ristrutturava l'intero sistema di cartelle quando chiedevo una piccola modifica.
Correggevo le stesse cose più e più volte.
Poi mi sono ricordato di aver letto di CLAUDE.md.
Ho creato un file nella root del mio progetto:
CLAUDE.md
Regole del Progetto
- Questo è un calendario di contenuti semplice. Mantieni tutto minimale.
- Usa Next.js 14 con l'App Router
- Usa Tailwind CSS per tutto lo styling. Nessun altro framework CSS.
- Usa SQLite con Prisma ORM per il database
- Mantienilo semplice. Niente astrazioni o pattern di progettazione inutili.
- Quando dico "rendilo bello" intendo: spaziatura pulita, font leggibili, effetti hover sottili, angoli arrotondati
- Non aggiungere mai nuove dipendenze senza chiedermelo prima
- Chiedi prima di rifattorizzare qualsiasi codice esistente
Stile del Codice
- Codice semplice e leggibile. Un principiante dovrebbe essere in grado di capirlo.
- Nomi di variabili chiari. Niente abbreviazioni.
- Commenti solo per logiche non ovvie
Dopo aver creato questo file, l'esperienza è cambiata drasticamente. Claude ha smesso di overingegnerizzare. Ha smesso di aggiungere librerie casuali. Ha smesso di ristrutturare cose che non gli avevo chiesto di toccare.
Ogni volta che Claude faceva qualcosa che non volevo, aggiungevo una nuova regola a CLAUDE.md**. Domenica sera questo file aveva più di 30 regole e Claude le seguiva tutte perfettamente.
Lezione imparata: Crea CLAUDE.md il primo giorno. Aggiornalo costantemente. È lo strumento più potente in Claude Code.
Errore #4: Non Usare Screenshot
Sabato sera. L'app funziona ma è brutta esteticamente. Ho scritto:
Rendi il design più moderno e professionale
Claude ha cambiato cose. Sembravano diverse. Non migliori, solo diverse.
Stavo cercando di descrivere problemi visivi con le parole. È incredibilmente inefficiente.
Invece, ho iniziato a fare screenshot di siti web il cui design amavo. Li ho incollati direttamente in Claude Code:
[screenshot di un'interfaccia calendario pulita]
Voglio che il mio calendario assomigli a questo. Nello specifico:
- Questa esatta tonalità di grigio per lo sfondo
- Queste schede arrotondate per ogni post
- Questa quantità di spaziatura tra gli elementi
- Il modo in cui il giorno attivo è evidenziato in blu
Claude ha replicato il design quasi perfettamente. Al primo tentativo.
Poi quando qualcosa sembrava storto, invece di descriverlo, facevo uno screenshot, cerchiavo l'area problematica, lo incollavo e dicevo "questa spaziatura è sbagliata" o "questo font è troppo piccolo."
Lezione imparata: Gli screenshot sono 10 volte migliori delle parole per il feedback visivo. Incolla sempre immagini invece di descrivere cosa vedi.
Domenica: Tutto Ha Iniziato a Funzionare
Domenica mattina avevo un'app funzionante con design pulito, drag-and-drop, dati persistenti e un database funzionante. Avevo costruito l'intera cosa senza capire la maggior parte del codice.
Ma esisteva solo sul mio portatile. Era ora di pubblicarla.
Errore #5: Aver Paura del Deploy
Il deploy sembrava terrificante. Server. Domini. DNS. File di configurazione.
Ho quasi smesso. Ho quasi deciso "eseguirla localmente è abbastanza buono."
Ma ho insistito e ho chiesto a Claude:
Voglio pubblicare quest'app live su internet. Voglio usare Vercel perché ho sentito che è il più semplice. Guidami attraverso i passaggi esatti.
Claude mi ha dato sette passaggi:
- Caricare il codice su GitHub (Claude mi ha aiutato a impostare Git)
- Iscriversi a Vercel (gratuito)
- Collegare Vercel al mio repository GitHub
- Impostare le variabili d'ambiente per il database
- Cliccare su deploy
- Aspettare 90 secondi
- Ottenere il mio URL live
Ho seguito i passaggi. Tre minuti dopo la mia app era live. Ho inviato l'URL a cinque persone. L'hanno aperto. Funzionava.
Lezione imparata: Il deploy non fa paura. È solo una lista di controllo. Claude ti guiderà attraverso ogni passaggio.
Le 12 Regole Che Avrei Voluto Sapere Prima di Iniziare
Tutto ciò che ho imparato in due giorni, condensato in regole:
Regola 1: Inizia sempre in Plan Mode. Shift + Tab. Pensa prima di costruire.
Regola 2: Una conversazione per funzionalità. Un contesto fresco è un contesto migliore.
Regola 3: Crea CLAUDE.md il primo giorno. Ogni correzione diventa una regola permanente.
Regola 4: Usa screenshot per ogni problema visivo. Cerchia il problema. Incollalo direttamente.
Regola 5: Costruisci prima la versione più semplice. Aggiungi complessità solo dopo che la versione semplice funziona.
Regola 6: Descrivi cosa vuoi in dettaglio. Più specifico è il tuo prompt, migliore è il risultato. "Crea una pagina di login" produce spazzatura. "Crea una pagina di login con campi email e password, un link 'password dimenticata' sotto, un pulsante di invio blu e un reindirizzamento a /dashboard al successo" produce esattamente ciò che hai chiesto.
Regola 7: Usa /compact quando le conversazioni diventano lunghe. La qualità di Claude cala quando il contesto si riempie.
Regola 8: Fai commit su Git dopo ogni funzionalità funzionante. Claude può aiutarti a farlo. Se qualcosa si rompe, puoi tornare indietro.
Regola 9: Quando qualcosa si rompe, copia il messaggio di errore e incollalo in Claude. Dì "Diagnostica la causa principale prima di risolvere qualsiasi cosa." Claude trova quasi sempre il problema all'istante.
Regola 10: Non cercare di capire ogni riga di codice. Capisci cosa fa ogni file e come si collegano. È sufficiente per dirigere Claude efficacemente.
Regola 11: Quando Claude rimane bloccato in un ciclo a risolvere la stessa cosa più e più volte, fermati. Inizia una nuova conversazione. Incolla solo il file pertinente e una descrizione chiara del problema.
Regola 12: Pubblicala prima che sia perfetta. La versione uno non deve essere bella. Deve funzionare. Puoi sempre migliorarla nella versione due.
Cosa Ho Costruito Da Quel Weekend
Sono passate tre settimane. Da allora ho costruito:
- Un portale di onboarding per clienti con login e caricamento file
- Una dashboard interna che traccia le mie metriche dei contenuti
- Un semplice generatore di fatture che crea PDF da un modulo
- Un gestore di segnalibri che salva e organizza link per argomento
Ancora non so leggere la maggior parte del codice. Ancora non capisco l'80% di ciò che accade nei file. Ma posso descrivere chiaramente cosa voglio abbastanza bene che Claude lo costruisce. Posso risolvere i problemi mostrando a Claude l'errore. Posso pubblicare prodotti funzionanti su internet.
Questo è il vibe coding. Tu non sei il programmatore. Tu sei il product manager. Claude è il programmatore. Il tuo compito è sapere cosa costruire e comunicarlo chiaramente.
Molte persone continueranno a dirsi che devono imparare a programmare prima di poter costruire qualsiasi cosa.
Chi aprirà il proprio terminale questo weekend avrà un'app funzionante entro lunedì mattina. Lo so perché è esattamente ciò che è successo a me.
Seguimi @eng_khairallah1 per altri corsi, strumenti e flussi di lavoro sull'IA. Nuovi contenuti ogni settimana.
spero ti sia stato utile, Khairallah ❤️
