0%
Tutoriel 6 sur 10
60% terminé

Collaboration avec GitHub

Maîtrisez les pull requests, les issues, et les discussions pour collaborer efficacement avec d'autres développeurs.

Collaboration avec GitHub

GitHub révolutionne la collaboration en développement logiciel. Ce tutoriel vous apprendra à utiliser les outils collaboratifs de GitHub : pull requests, issues, discussions, et bien plus pour travailler efficacement en équipe.

Vue d’ensemble de la collaboration

graph TD
    A[Développeur A] -->|Fork| B[Dépôt Fork]
    B -->|Clone| C[Dépôt Local A]
    C -->|Push| D[Branche Feature]
    D -->|Pull Request| E[Dépôt Original]
    F[Développeur B] -->|Review| E
    G[Maintainer] -->|Merge| E
    E -->|Pull| H[Dépôt Local B]

Issues : Gestion des tâches et bugs

Qu’est-ce qu’une Issue ?

Une issue est un ticket pour :

  • Signaler des bugs
  • Proposer des fonctionnalités
  • Poser des questions
  • Organiser les tâches

Créer une Issue

# Template d'issue pour bug
**Description du bug**
Description claire et concise du problème.

**Étapes pour reproduire**
1. Aller à '...'
2. Cliquer sur '....'
3. Faire défiler jusqu'à '....'
4. Voir l'erreur

**Comportement attendu**
Description de ce qui devrait se passer.

**Captures d'écran**
Si applicable, ajouter des captures d'écran.

**Environnement:**
- OS: [ex: iOS]
- Navigateur: [ex: chrome, safari]
- Version: [ex: 22]

Gestion des Issues

# Avec GitHub CLI
gh issue create --title "Bug dans le login" --body "Description détaillée"
gh issue list
gh issue view 123
gh issue close 123

# Assigner une issue
gh issue edit 123 --add-assignee username

# Ajouter des labels
gh issue edit 123 --add-label bug,priority-high

Labels et organisation

Labels par défaut :

  • bug : Quelque chose ne fonctionne pas
  • enhancement : Nouvelle fonctionnalité ou demande
  • documentation : Améliorations de la documentation
  • good first issue : Bon pour les nouveaux contributeurs
  • help wanted : Aide supplémentaire souhaitée

Labels personnalisés :

priority-high (rouge)
priority-medium (orange)
priority-low (vert)
frontend (bleu)
backend (violet)

Pull Requests : Proposer des modifications

Workflow Pull Request

# 1. Fork du dépôt (via l'interface GitHub)
# 2. Clone de votre fork
git clone https://github.com/VOTRE-USERNAME/projet.git
cd projet

# 3. Créer une branche
git checkout -b feature/nouvelle-fonctionnalite

# 4. Développer et commiter
echo "nouveau code" > feature.js
git add feature.js
git commit -m "feat: add new feature"

# 5. Pousser la branche
git push origin feature/nouvelle-fonctionnalite

# 6. Créer la Pull Request via l'interface GitHub

Anatomie d’une Pull Request

# Template de Pull Request

## Description
Résumé des changements et motivation.

## Type de changement
- [ ] Bug fix (changement non-breaking qui corrige un problème)
- [ ] Nouvelle fonctionnalité (changement non-breaking qui ajoute une fonctionnalité)
- [ ] Breaking change (fix ou feature qui casserait la fonctionnalité existante)
- [ ] Documentation

## Comment cela a-t-il été testé ?
Description des tests effectués.

## Checklist:
- [ ] Mon code suit les guidelines du projet
- [ ] J'ai effectué une auto-review de mon code
- [ ] J'ai commenté mon code, particulièrement dans les zones difficiles
- [ ] J'ai fait les changements correspondants à la documentation
- [ ] Mes changements ne génèrent pas de nouveaux warnings
- [ ] J'ai ajouté des tests qui prouvent que mon fix est efficace
- [ ] Les tests nouveaux et existants passent localement

Commandes GitHub CLI pour PR

# Créer une PR
gh pr create --title "Add new feature" --body "Description détaillée"

# Lister les PR
gh pr list

# Voir une PR
gh pr view 123

# Checkout d'une PR pour test
gh pr checkout 123

# Merger une PR
gh pr merge 123 --merge  # ou --squash ou --rebase

# Fermer une PR
gh pr close 123

Code Review : Révision de code

Processus de Review

  1. Lecture du code : Comprendre les changements
  2. Test local : Vérifier que ça fonctionne
  3. Feedback constructif : Commentaires utiles
  4. Approbation ou demande de changements

Types de commentaires

# Commentaire général
Cette approche est intéressante, mais avez-vous considéré utiliser X au lieu de Y ?

# Suggestion de code
```suggestion
function calculateTotal(items) {
    return items.reduce((sum, item) => sum + item.price, 0);
}

Question

Pourquoi avez-vous choisi cette méthode plutôt que l’API native ?

Nitpick (détail mineur)

nit: Espace manquant après la virgule


### Bonnes pratiques de Review

**Pour le reviewer :**
- Soyez constructif et respectueux
- Expliquez le "pourquoi" de vos suggestions
- Approuvez rapidement les bonnes PR
- Testez les changements importants

**Pour l'auteur :**
- Répondez aux commentaires
- Implémentez les suggestions pertinentes
- Demandez des clarifications si nécessaire
- Remerciez pour les reviews

## Forks et Contributions

### Fork d'un projet

```bash
# 1. Fork via l'interface GitHub
# 2. Clone de votre fork
git clone https://github.com/VOTRE-USERNAME/projet-fork.git
cd projet-fork

# 3. Ajouter le dépôt original comme remote
git remote add upstream https://github.com/AUTEUR-ORIGINAL/projet.git

# 4. Vérifier les remotes
git remote -v

Synchroniser avec l’upstream

# Récupérer les changements de l'upstream
git fetch upstream

# Merger les changements dans votre main
git checkout main
git merge upstream/main

# Pousser vers votre fork
git push origin main

Workflow de contribution

# 1. Synchroniser avec upstream
git fetch upstream
git checkout main
git merge upstream/main

# 2. Créer une branche pour votre contribution
git checkout -b fix/bug-description

# 3. Développer
# ... modifications ...

# 4. Commiter
git add .
git commit -m "fix: resolve issue with user authentication"

# 5. Pousser vers votre fork
git push origin fix/bug-description

# 6. Créer une Pull Request vers l'upstream

Discussions GitHub

Types de discussions

  • Q&A : Questions et réponses
  • Ideas : Propositions d’idées
  • General : Discussions générales
  • Show and tell : Partager des réalisations

Créer une discussion

# Exemple de discussion "Ideas"
**Titre :** Ajouter un mode sombre à l'application

**Description :**
Je propose d'ajouter un mode sombre pour améliorer l'expérience utilisateur, 
particulièrement pour l'utilisation nocturne.

**Avantages :**
- Réduction de la fatigue oculaire
- Économie de batterie sur les écrans OLED
- Tendance moderne du design

**Questions :**
- Quelle palette de couleurs utiliser ?
- Faut-il un toggle automatique basé sur l'heure ?
- Comment gérer la compatibilité avec les thèmes existants ?

Gestion de projet avec GitHub

GitHub Projects

# Organisation d'un projet
Colonnes typiques :
- Backlog
- To Do
- In Progress
- In Review
- Done

# Automatisation
- Déplacer automatiquement les cartes selon les événements
- Lier les issues et PR aux cartes
- Filtrer par assigné, label, milestone

Milestones

# Organiser les issues par version/sprint
Milestone: Version 2.0
- Issue #45: Ajouter authentification OAuth
- Issue #46: Améliorer les performances
- Issue #47: Corriger le bug de navigation

Due date: 2024-03-15
Progress: 2/3 issues fermées (67%)

Notifications et mentions

Système de notifications

# Types de notifications
- Mentions (@username)
- Assignations
- Reviews demandées
- Commentaires sur vos PR/Issues
- Activité sur les dépôts watchés

# Gestion des notifications
Settings > Notifications
- Email notifications
- Web notifications
- Mobile notifications

Mentions et équipes

# Mentionner un utilisateur
@username pouvez-vous regarder cette PR ?

# Mentionner une équipe
@org/frontend-team cette PR concerne l'interface utilisateur

# Mentionner dans un commit
git commit -m "fix: resolve login issue

Fixes #123
cc @maintainer-team"

Sécurité et permissions

Niveaux d’accès

  • Read : Cloner et lire
  • Triage : Gérer les issues et PR
  • Write : Push et merge
  • Maintain : Gérer le dépôt sans accès destructeur
  • Admin : Accès complet

Branch protection

# Règles de protection pour main
- Require pull request reviews before merging
- Require status checks to pass before merging
- Require branches to be up to date before merging
- Require conversation resolution before merging
- Restrict pushes that create files larger than 100MB

Exercices pratiques

Exercice 1 : Première contribution

# 1. Fork un projet open source simple
# 2. Clone votre fork
git clone https://github.com/VOTRE-USERNAME/projet-fork.git

# 3. Créer une branche
git checkout -b docs/improve-readme

# 4. Améliorer la documentation
echo "## Installation\n\n\`\`\`bash\nnpm install\n\`\`\`" >> README.md

# 5. Commiter et pousser
git add README.md
git commit -m "docs: improve installation instructions"
git push origin docs/improve-readme

# 6. Créer une Pull Request

Exercice 2 : Gestion d’issues

# 1. Créer plusieurs issues dans votre dépôt
gh issue create --title "Bug: Login ne fonctionne pas" --label bug
gh issue create --title "Feature: Ajouter mode sombre" --label enhancement
gh issue create --title "Docs: Améliorer le README" --label documentation

# 2. Assigner et organiser
gh issue edit 1 --add-assignee VOTRE-USERNAME
gh issue edit 2 --add-label "good first issue"

# 3. Lier une PR à une issue
git checkout -b fix/login-bug
# ... développement ...
git commit -m "fix: resolve login authentication issue

Fixes #1"

Exercice 3 : Code Review

# 1. Créer une PR avec du code à améliorer
echo "function add(a,b){return a+b}" > math.js
git add math.js
git commit -m "add math function"
git push origin feature/math

# 2. Créer la PR et demander une review
gh pr create --title "Add math utilities" --reviewer ami-reviewer

# 3. Répondre aux commentaires et améliorer
echo "function add(a, b) {
  if (typeof a !== 'number' || typeof b !== 'number') {
    throw new Error('Both arguments must be numbers');
  }
  return a + b;
}" > math.js

git add math.js
git commit -m "improve: add input validation to math function"
git push origin feature/math

Outils et intégrations

GitHub Desktop

Interface graphique pour :

  • Visualiser les changements
  • Créer des commits
  • Gérer les branches
  • Synchroniser avec GitHub

VS Code + GitHub

Extensions utiles :

  • GitHub Pull Requests and Issues
  • GitLens
  • GitHub Copilot

Intégrations CI/CD

# .github/workflows/ci.yml
name: CI
on: [push, pull_request]
jobs:
  test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Setup Node.js
        uses: actions/setup-node@v2
        with:
          node-version: '16'
      - run: npm install
      - run: npm test

Bonnes pratiques collaboratives

Communication

  1. Soyez clair dans vos descriptions
  2. Utilisez les templates pour les issues et PR
  3. Répondez rapidement aux reviews
  4. Documentez vos décisions importantes

Organisation

  1. Utilisez des labels cohérents
  2. Organisez avec des milestones
  3. Assignez les responsabilités
  4. Fermez les issues résolues

Code

  1. Commits atomiques et descriptifs
  2. Branches courtes et focalisées
  3. Tests pour les nouvelles fonctionnalités
  4. Documentation à jour

Dépannage collaboratif

Conflits de merge dans une PR

# 1. Synchroniser avec la branche principale
git fetch origin
git checkout feature-branch
git merge origin/main

# 2. Résoudre les conflits
# ... édition manuelle ...

# 3. Commiter la résolution
git add .
git commit -m "resolve merge conflicts"
git push origin feature-branch

PR bloquée par les checks

# Vérifier les status checks
gh pr checks

# Relancer les checks si nécessaire
gh pr ready --undo  # marquer comme draft
gh pr ready         # marquer comme ready

Ressources supplémentaires

Documentation GitHub

Outils tiers

  • Conventional Commits : Standard pour les messages
  • Semantic Release : Automatisation des versions
  • All Contributors : Reconnaissance des contributeurs

Conclusion

La collaboration sur GitHub va bien au-delà du simple partage de code. C’est un écosystème complet qui facilite la communication, l’organisation et la qualité du développement logiciel. Maîtriser ces outils vous rendra plus efficace dans vos projets collaboratifs.

Dans le prochain tutoriel, nous approfondirons la résolution de conflits, un aspect crucial de la collaboration en équipe.

Temps de lecture estimé : 25 minutes
Niveau : Intermédiaire
Étape précédente : Introduction à GitHub
Prochaine étape : Résolution de conflits

← Précédent Introduction à GitHub Suivant → Résolution de conflits
← Précédent Introduction à GitHub Suivant → Résolution de conflits