Frontend Academy · Leçon

git init, add, commit et status

Initialisez un dépôt, indexez les modifications avec git add, créez des commits et consultez git status et git log pour comprendre l’historique.

git init, add, commit et status est une leçon Frontend Academy gratuite sur CoddyKit. Ceci est la leçon 1 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Frontend Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Frontend Academy comprend 4 leçons au total.

Pourquoi utiliser le contrôle de version ?

Git suit chaque modification de votre code au fil du temps. Vous pouvez voir ce qui a changé, quand et pourquoi. Les erreurs peuvent être corrigées. Plusieurs personnes peuvent travailler sur la même base de code. Toutes les équipes professionnelles utilisent Git.

git init — créer un dépôt

Exécutez git init dans n'importe quel dossier pour initialiser un dépôt Git. Git crée un répertoire caché .git qui contient tout l'historique du projet.

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

Les trois zones

Git comporte trois zones : répertoire de travail (fichiers que vous modifiez), zone de préparation (fichiers marqués pour le prochain commit) et dépôt (historique enregistré). La zone de préparation vous permet de créer des commits précis.

git status — qu'est-ce qui a changé ?

git status indique quels fichiers ne sont pas suivis, ont été modifiés ou sont préparés. Utilisez-le régulièrement pendant votre travail pour comprendre l'état actuel.

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

git add — préparer les modifications

git add filename prépare un fichier précis. git add . prépare toutes les modifications du répertoire actuel. git add -p prépare les modifications de manière interactive, morceau par morceau.

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

git commit — enregistrer un instantané

git commit -m 'message' crée un instantané permanent des modifications préparées. Le message doit expliquer pourquoi la modification a été effectuée, et non ce qui a été modifié. Chaque commit possède une empreinte SHA unique.

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'

Commits conventionnels

De nombreuses équipes utilisent le format des commits conventionnels : type(scope): description. Les types courants sont : fonctionnalité, correction, refactorisation, test, documentation, maintenance et performance. Cela permet de générer automatiquement un journal des modifications et de gérer le versionnage sémantique.

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 — consulter l'historique

git log affiche l'historique des commits. git log --oneline affiche une vue compacte, avec une ligne par commit. git log --graph représente la structure des branches.

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

git diff — voir les modifications

git diff affiche les modifications non préparées. git diff --staged affiche les modifications préparées. git diff HEAD affiche toutes les modifications depuis le dernier commit.

Le fichier .gitignore

Répertoriez dans .gitignore les fichiers et répertoires à exclure du contrôle de version. Ignorez toujours node_modules, .env, dist et les répertoires de compilation. GitHub fournit des modèles de fichier gitignore pour chaque langage et chaque cadre logiciel.

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

git restore — annuler les modifications non préparées

git restore filename supprime les modifications apportées à un fichier du répertoire de travail et le rétablit dans la version du dernier commit. Cette opération est destructive : les modifications sont perdues.

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

Vérification rapide

Que fait git add . ?

Récapitulatif : commandes Git essentielles

git init démarre un dépôt. git status affiche l'état actuel. git add prépare les fichiers. git commit enregistre un instantané accompagné d'un message. git log affiche l'historique. git diff affiche les modifications. .gitignore exclut des fichiers. Rédigez toujours des messages de commit explicites qui expliquent pourquoi, et non ce qui a été fait.

Questions Fréquemment Posées

La leçon « git init, add, commit et status » est-elle gratuite ?

Oui — le texte complet de « git init, add, commit et status » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Frontend Academy, passe à CoddyKit PRO. Le cours Frontend Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « git init, add, commit et status » ?

Initialisez un dépôt, indexez les modifications avec git add, créez des commits et consultez git status et git log pour comprendre l’historique. Tu pratiques Frontend Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer Frontend Academy ?

Aucune expérience préalable n'est requise. Frontend Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 1 sur 4.

Combien de temps prend la leçon « git init, add, commit et status » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon Frontend Academy ?

Oui. Chaque leçon Frontend Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

← Retour à Frontend Academy