Frontend Academy · Lezione

git init, add, commit e status

Inizializzare un repository, mettere in stage le modifiche con git add, creare commit e leggere git status e git log per comprendere la cronologia.

git init, add, commit e status è una lezione Frontend Academy gratuita su CoddyKit. Questa è la lezione 1 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Frontend Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Frontend Academy include 4 lezioni in totale.

Perché usare il controllo versione?

Git tiene traccia di ogni modifica al codice nel tempo. È possibile vedere che cosa è cambiato, quando e perché. Gli errori possono essere recuperati. Più persone possono lavorare sulla stessa codebase. Ogni team professionale utilizza Git.

git init — avviare un repository

Esegua git init in qualsiasi cartella per inizializzare un repository Git. Git crea una directory nascosta .git che conserva l'intera cronologia del progetto.

mkdir my-project && cd my-project
git init
# Initialized empty Git repository in ./my-project/.git/

Le tre aree

Git ha tre aree: Directory di lavoro (i file che modifica), Area di staging (i file contrassegnati per il prossimo commit), Repository (la cronologia dei commit). L'area di staging consente di creare commit mirati.

git status — che cosa è cambiato?

git status mostra quali file non sono tracciati, sono stati modificati o sono in staging. Lo utilizzi spesso durante il lavoro per conoscere lo stato corrente.

git status
# Output:
# On branch main
# Changes not staged for commit:
#   modified: index.html
# Untracked files:
#   styles.css

git add — mettere le modifiche in staging

git add filename mette in staging un file specifico. git add . mette in staging tutte le modifiche nella directory corrente. git add -p mette in staging le modifiche in modo interattivo, un hunk alla volta.

git add index.html           # stage one file
git add src/                 # stage a directory
git add .                    # stage everything
git add -p                   # interactive staging

git commit — salvare uno snapshot

git commit -m 'message' crea uno snapshot permanente delle modifiche in staging. Il messaggio dovrebbe descrivere perché è stata apportata la modifica, non che cosa è stato modificato. Ogni commit ha un hash SHA univoco.

git commit -m 'feat: add user authentication form'
git commit -m 'fix: correct email validation regex'
git commit -m 'refactor: extract validation into helper function'

Conventional Commits

Molti team utilizzano il formato Conventional Commits: type(scope): description. I tipi più comuni sono: feat, fix, refactor, test, docs, chore, perf. Questo consente di generare automaticamente il changelog e di usare il versionamento semantico.

feat(auth): add Google OAuth login
fix(cart): prevent duplicate item addition
docs(api): add rate limit documentation
chore(deps): upgrade React to 18.3

git log — visualizzare la cronologia

git log mostra la cronologia dei commit. git log --oneline mostra una vista compatta, con una riga per commit. git log --graph disegna la struttura dei branch.

git log --oneline --graph
# * a1b2c3d feat: add dark mode toggle
# * d4e5f6g fix: resolve mobile nav overflow
# * 7h8i9j0 refactor: extract theme hook

git diff — vedere che cosa è cambiato

git diff mostra le modifiche non in staging. git diff --staged mostra le modifiche in staging. git diff HEAD mostra tutte le modifiche dall'ultimo commit.

Il file .gitignore

Elenchi in .gitignore i file e le directory da escludere dal controllo versione. Ignori sempre node_modules, .env, dist e le directory build. GitHub fornisce template gitignore per ogni linguaggio e framework.

# .gitignore
node_modules/
dist/
.env
.env.local
*.log
.DS_Store
coverage/

git restore — annullare le modifiche non in staging

git restore filename elimina le modifiche a un file nella directory di lavoro, riportandolo alla versione dell'ultimo commit. È un'operazione distruttiva: le modifiche vengono perse.

git restore index.html        # discard unstaged changes
git restore --staged file.js  # unstage without losing changes

Verifica rapida

Che cosa fa git add .?

Riepilogo: comandi Git fondamentali

git init avvia un repository. git status mostra lo stato corrente. git add mette i file in staging. git commit salva uno snapshot con un messaggio. git log mostra la cronologia. git diff mostra le modifiche. .gitignore esclude i file. Scriva sempre messaggi di commit significativi che spieghino perché è stata apportata una modifica, non che cosa è stato modificato.

Domande Frequenti

La lezione «git init, add, commit e status» è gratuita?

Sì — il testo completo di «git init, add, commit e status» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Frontend Academy, passa a CoddyKit PRO. Il corso Frontend Academy include 4 lezioni in totale.

Cosa imparerò in «git init, add, commit e status»?

Inizializzare un repository, mettere in stage le modifiche con git add, creare commit e leggere git status e git log per comprendere la cronologia. Eserciti Frontend Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare Frontend Academy?

Non è richiesta alcuna esperienza precedente. Frontend Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 1 di 4.

Quanto tempo richiede la lezione «git init, add, commit e status»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione Frontend Academy?

Sì. Ogni lezione Frontend Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

← Torna a Frontend Academy