> For the complete documentation index, see [llms.txt](https://students.corentindesfarges.fr/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://students.corentindesfarges.fr/cnam-fip-1a/tp-git-et-les-branches.md).
# TP : Git et les branches
## Mise en place et instructions
Pour ce TP, vous aurez besoin de [Git et Git Bash](https://gitforwindows.org/) (ou d'un terminal Unix).
**À la fin de la séance du 01/10/2020**, merci de déposer un fichier .zip/.rar (ou équivalent) à [cette adresse](https://drive.google.com/open?id=16bdjkyc5FAR1SGGUf0SXYq9AVnM89L6e), au format **NOM\_prenom\_TP02.zip**, contenant :\
\- L'intégralité de votre dossier de travail (le dossier masqué .git doit être présent)\
\- Un fichier (txt, pdf, docx, ...) contenant les commandes jouées lors de ce TP
Vous êtes libre d'ajouter à votre rapport les difficultés rencontrées.
## Enrichir le projet de nouvelles fonctionnalités
Reprenez le projet du TP précédent. Vous pouvez copier votre dossier de travail pour être en mesure de recommencer au besoin.
### Créer des "feature-branches"
On souhaite effectuer deux évolutions sur notre projet. On va pour cela créer deux branches :
* ajout-styles
* modification-textes
Créez la première branche, et sur celle-ci, ajoutez le fichier `styles.css`, contenant le code suivant :
{% code title="styles.css" %}
```css
p .blue {
color: "blue"
}
```
{% endcode %}
Ajoutez ensuite la classe `blue` au paragraphe dans le fichier `index.html`.
{% code title="index.html" %}
```markup
Welcome
This is a Heading
This is a paragraph
```
{% endcode %}
Commitez ces changements en indiquant un message approprié.
En parallèle, on souhaite changer le texte de notre fichier. Placez-vous alors sur la branche `master`.
{% hint style="info" %}
Si vous consultez l'historique des commits depuis la branche `master`, vous ne devez pas voir le dernier commit concernant l'ajout des styles, puisque celui-ci appartient à une branche différente. **Vérifiez que vous êtes bien dans cette situation.**
{% endhint %}
Créez la seconde branche, et sur celle-ci, remplacer le texte du paragraphe par le message suivante : "Git c'est merveilleux". Le fichier index.html doit alors ressembler à :
{% code title="index.html" %}
```markup
Welcome
This is a Heading
Git c'est merveilleux
```
{% endcode %}
Commitez ce changement, puis modifiez le titre de la page : "TP Git". Cette fois, le fichier se présente comme suit :
{% code title="index.html" %}
```markup
TP Git
This is a Heading
Git c'est merveilleux
```
{% endcode %}
Commitez également ces changements. Sur cette branche, l'historique devrait ressembler à :
```
commit 43330ba53e6859da860cd9ecb932c5d39bdd84c5 (HEAD -> modification-textes)
Author: Corentin Desfarges
Date: Sun Sep 23 23:29:39 2018 +0200
Modification du titre de la page
commit ce5bbaa05924fc7371b93e31740a388fb9ff38ee
Author: Corentin Desfarges
Date: Sun Sep 23 23:29:17 2018 +0200
Modification du paragraphe
commit 8ce658a80f605415a3104614874d8497132a6ec5 (master)
Author: Corentin Desfarges
Date: Sun Sep 23 11:39:51 2018 +0200
Ajout du fichier index.html
```
### Rapatrier le travail sur la branche master
Une fois le travail sur chaque branche terminée, on souhaite naturellement le voir rapatrié sur la branche principale, à savoir la branche `master`.
Placez-vous sur la branche `master`. L'historique des commits ne présente qu'un seul résultat à ce moment de l'exercice. Nous allons tout d'abord rapatrier les changements de la branche `modifications-textes`.
Utiliser la commande appropriée pour fusionner cette branche dans la branche `master`. Le résultat de cette commande est le suivant :
```
Updating 8ce658a..43330ba
Fast-forward
index.html | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
```
Si je consulte l'historique de la branche master, je constate désormais que des commits ont bien été ajoutés à la branche principale. Si j'ouvre le fichier `index.html`, les textes sont bien à jour.
Tentez ensuite de rapatrier le commit de la branche `ajout-styles`. Le message apparaît alors :
```
Auto-merging index.html
CONFLICT (content): Merge conflict in index.html
Automatic merge failed; fix conflicts and then commit the result.
```
Observez ce message d'erreur, ainsi que l'état du dépôt :
```
On branch master
You have unmerged paths.
(fix conflicts and run "git commit")
(use "git merge --abort" to abort the merge)
Unmerged paths:
(use "git add ..." to mark resolution)
both modified: index.html
Untracked files:
(use "git add ..." to include in what will be committed)
styles.css
no changes added to commit (use "git add" and/or "git commit -a")
```
Un conflit s'est produit lors de la fusion des branches. Ouvrez le fichier `index.html` afin de pouvoir observer les parties du code que Git n'a pas réussi à fusionner.
Le conflit se présente comme suit :
{% code title="index.html" %}
```markup
TP Git
This is a Heading
<<<<<<< HEAD
Git c'est merveilleux
=======
This is a paragraph
>>>>>>> ajout-styles
```
{% endcode %}
{% hint style="info" %}
`HEAD` correspond à l'état du dépôt lors du dernier commit valide de la branche. On retrouve donc le texte original, puisque la branche modifications-texte a déjà été mergée dans `master`.
La partie sous les symboles ======= correspond à l'état de la branche que l'on tente de fusionner.
{% endhint %}
Résolvez le conflit de manière intelligente : on souhaite conserver le nouveau texte, mais également la classe ajoutée. En utilisant la commande `git log --graph`, vous devriez observer un résultat très similaire à celui-ci :
```
* commit f8f53f4d023fed26acf6dae999beea433448f4da (HEAD -> master)
|\ Merge: 43330ba db77cf5
| | Author: Corentin Desfarges
| | Date: Sun Sep 23 23:47:46 2018 +0200
| |
| | Commit de fusion de la branche ajout-styles dans master
| |
| * commit db77cf58b91adcaf6e175615b3b8afb4506cda9e (ajout-styles)
| | Author: Corentin Desfarges
| | Date: Sun Sep 23 23:27:39 2018 +0200
| |
| | Ajout des styles
| |
* | commit 43330ba53e6859da860cd9ecb932c5d39bdd84c5 (modification-textes)
| | Author: Corentin Desfarges
| | Date: Sun Sep 23 23:29:39 2018 +0200
| |
| | Modification du titre de la page
| |
* | commit ce5bbaa05924fc7371b93e31740a388fb9ff38ee
|/ Author: Corentin Desfarges
| Date: Sun Sep 23 23:29:17 2018 +0200
|
| Modification du paragraphe
|
* commit 8ce658a80f605415a3104614874d8497132a6ec5
Author: Corentin Desfarges
Date: Sun Sep 23 11:39:51 2018 +0200
Ajout du fichier index.html
```
Vous savez désormais travailler avec les branches, et êtes en mesure de rapatrier les changements sur la branche principale !
### Partagez vos branches
Essayez désormais de publier votre projet (les trois branches) sur GitLab. Pensez à me donner l'accès `Maintainer` (@corentin.desfarges) et à ajouter l'URL de votre dépôt dans votre rapport.
### Nettoyer votre dépôt local
Les branches de travail ayant été mergées sur `master`, elles ne devraient plus vous êtes utiles. Supprimez-les. La commande `git branch` ne devrait alors plus vous affichez que la branche `master`.
{% hint style="info" %}
Veillez à conserver les branches de travail sur GitLab.
{% endhint %}
### Questions
Dans votre rapport, ajoutez les réponses aux questions suivantes :
1. Après avoir effectué le premier merge, il était question de `Fast-forward` dans le log. Expliquez ce que cela signifie.
2. Réexpliquez brièvement pourquoi il y a eu un conflit lors du second merge.
3. Après avoir supprimé les branches localement, pouvez-vous les récupérer ? Si oui, comment ? Si non, pourquoi ?
4. Que pensez-vous du graph de votre projet visible sur GitLab (sous Repository/Graph) ?