.. raw:: html .. role:: greenbox .. role:: whitebox .. _00github: Environnement de travail du projet ---------------------------------- Le projet s'effectue dans un environnement GitHub, un service en ligne qui permet d'héberger des projets de développement logiciel. Créer un compte GitHub ...................... Pour réaliser le projet, s'il on n'en dispose pas déjà, il faut créer un compte `GitHub `_ : :whitebox:`Sign up` - ``email`` : celui de votre compte Esiee ; - ``password`` ; - ``username`` : PrenomNom (identique à celui de votre email ESIEE). .. important:: Il est fondamental de suivre les conventions ci dessus, car l'activité de chacun des membres du projet est tracée et utilisée pour l'évaluation. Une identification incorrecte pourrait vous pénaliser. Si vous disposez déjà d'un compte GitHub que vous souhaitez continuer à utiliser pour ce projet, vous pouvez modifier le ``username`` pour qu'il corresponde à la convention ci dessus. .. warning:: Pour la suite vous devez être connecté à votre compte GitHub. Le repo distant ............... Disposer d'un compte GitHub vous permet de disposer d'un espace de stockage pour votre projet. Cet espace est appelé **repo distant** (pour repository). Tout au long de la vie du projet, le repo distant sera le référentiel du projet en ce sens, qu'à chaque étape, le repo distant contiendra l'ensemble des fichiers et l'historique des modifications. Voyons maintenant comment utiliser cet espace de stockage. Contexte mono utilisateur ......................... On se place dans un contexte mono utilisateur qui dispose d'un repo distant sur GitHub. La communication avec le repo distant (unique) peut se faire à travers : - ➊ un codespace, c'est à dire un environnement de développement en ligne, accessible à travers un navigateur web, qui permet de travailler sur le projet sans avoir à installer quoi que ce soit sur sa machine. Un codespace est un container Docker (une machine virtuelle légère) qui est créé à la demande et qui est associé à un repo distant. Il nécessite un compte GitHub ; - ➋ un environnement de développement VS Code classique sur une ou plusieurs machines locales de l'utilisateur. .. figure:: images/misc-tba-github-drawio-fig-01.png :align: center Un repo distant unique et plusieurs environnements de développement associés. Par la suite **il est très fortement conseillé de travailler exclusivement à partir du seul codespace**, ce qui présente les avantages suivants: - la connexion avec le repo distant est déjà paramétrée ; - il est accessible depuis n'importe quelle machine à partir d'un simple navigateur web ; - aucune installation locale n'est nécessaire. .. figure:: images/misc-tba-github-drawio-fig-02.png :align: center Environnement conseillé : un repo distant unique et un codespace .. warning:: En cas d'utilisation de multiples environnements de développement, il est fondamental de synchroniser régulièrement le repo distant avec chacun des environnements de développement pour éviter les conflits. .. quiz:: quizz-01 :title: L'environnement mono utilisateur #. :quiz:`{"type":"TF","answer":"T"}` Un repo distant est un espace de stockage pour un projet. #. :quiz:`{"type":"TF","answer":"T"}` Il est possible de travailler sur un projet sans avoir à installer quoi que ce soit sur sa machine. #. :quiz:`{"type":"TF","answer":"T"}` Il est possible d'accéder à un repo distant à partir de n'importe quelle machine. #. :quiz:`{"type":"TF","answer":"T"}` Il est possible de travailler sur un projet à partir de plusieurs environnements de développement distincts. #. :quiz:`{"type":"TF","answer":"F"}` Il est conseillé d'installer un environnement de développement local sur sa machine #. :quiz:`{"type":"TF","answer":"T"}` Il est possible d'installer un environnement de développement local sur sa machine #. :quiz:`{"type":"TF","answer":"F"}` Un codespace est un environnement de développement local #. :quiz:`{"type":"TF","answer":"T"}` Un codespace nécessite un compte GitHub #. :quiz:`{"type":"TF","answer":"T"}` Il est possible de travailler sur un projet à partir d'un codespace #. :quiz:`{"type":"TF","answer":"T"}` Il est fortement conseillé de travailler sur un projet à partir d'un codespace #. :quiz:`{"type":"TF","answer":"T"}` Un codespace se comporte comme une machine virtuelle légère Contexte multi utilisateur .......................... Le projet s'effectue en binôme. Dans ce cadre là, **il y a toujours un seul repo distant et donc un seul référentiel pour le projet**. Mais plusieurs environnements de développement partagés entre les utilisateurs Alice et Bob. .. important:: Pour la suite, on se place dans l'environnement conseillé ci dessous, c'est à dire un repo distant unique et un codespace par utilisateur. .. figure:: images/misc-tba-github-drawio-fig-03.png :align: center Un seul repo distant et un codespace par utilisateur Puisqu'il y a un seul et unique référentiel (repo distant) pour le projet, le repo distant devra être créé par un utilisateur, qui devra ensuite ajouter les autres utilisateurs comme collaborateurs du projet. Pour la suite, et par convention, on considère que : - ``Alice`` est propriétaire du projet. Elle crée le repo distant et invite ``Bob`` comme collaborateur ; - et ``Bob`` est collaborateur du projet. Il est invité par ``Alice`` et peut contribuer au projet. .. important:: Il faut décider dès à présent dans le binôme, qui va jouer le rôle de ``Alice`` et qui va jouer le rôle de ``Bob``. Ces rôles sont définitifs et ne peuvent pas être changés en cours de projet. .. quiz:: quizz-02 :title: L'environnement multi utilisateur #. :quiz:`{"type":"TF","answer":"T"}` Un repo distant peut être partagé entre plusieurs utilisateurs. #. :quiz:`{"type":"TF","answer":"F"}` Un repo distant peut avoir plusieurs propriétaires. #. :quiz:`{"type":"TF","answer":"T"}` Un repo distant peut avoir plusieurs collaborateurs. #. :quiz:`{"type":"TF","answer":"T"}` Le repo distant est le référentiel unique du projet, même s'il y a plusieurs environnements de développement. #. :quiz:`{"type":"TF","answer":"T"}` Le repo distant est le référentiel unique du projet, même s'il y a plusieurs collaborateurs. #. :quiz:`{"type":"TF","answer":"F"}` Chaque collaborateur a son propre repo distant. #. :quiz:`{"type":"TF","answer":"T"}` Il est possible de connecter plusieurs environnements de développement distincts à un repo distant #. :quiz:`{"type":"TF","answer":"F"}` Ces environnements de développement distincts doivent appartenir à un seul propriétaire #. :quiz:`{"type":"TF","answer":"F"}` Je développe le projet directement sur le repo distant #. :quiz:`{"type":"TF","answer":"T"}` Je développe le projet à partir d'un environnement de développement connecté au repo distant #. :quiz:`{"type":"TF","answer":"T"}` Je synchronise régulièrement mon environnement de développement avec le repo distant #. :quiz:`{"type":"TF","answer":"T"}` Je peux travailler sur le projet à partir de n'importe quel environnement de développement connecté au repo distant #. :quiz:`{"type":"TF","answer":"F"}` Je peux me connecter au codespace de mon binôme Rentrons maintenant dans le détail de la création du repo distant et de l'association des environnements de développement. Alice crée le repo distant .......................... Le repo distant est créé une seule fois pour toutes, par le propriétaire du projet, ici ``Alice``. Il peut être créé vide ou à partir d'un repo distant existant. C'est ici la deuxième solution qui est retenue, en utilisant le starter code disponible dans `ce dépôt `_ utilisé comme template. - :greenbox:`Use this template` :greenbox:`Create a new repository` :whitebox:`TBA` :greenbox:`Create repository` Après création, ``Alice`` est propriétaire d'un repo distant, visible à l'adresse ``https://github.com/Alice/TBA``, qui est l'exacte copie du template. Puisque ce repo distant est public, il est également visible par ``Bob``. Puisque ``Bob`` n'a pas encore été déclaré comme collaborateur, il ne peut pas y contribuer pour l'instant. .. figure:: images/misc-tba-github-drawio-fig-04.png :align: center Alice crée le repo .. quiz:: quizz-03 :title: Création du repo distant #. :quiz:`{"type":"TF","answer":"T"}` Un utilisateur GitHub quelconque peut créer un repo distant. #. :quiz:`{"type":"TF","answer":"T"}` Un repo distant peut être créé vide. #. :quiz:`{"type":"TF","answer":"F"}` Un repo distant doit être créé vide. #. :quiz:`{"type":"TF","answer":"T"}` Un repo distant peut être créé à partir d'un repo distant existant. #. :quiz:`{"type":"TF","answer":"F"}` Un repo distant doit être créé à partir d'un repo distant existant. #. :quiz:`{"type":"TF","answer":"T"}` Sans manipulation particulière, le repo distant créé par Alice est accessible uniquement par Alice. #. :quiz:`{"type":"TF","answer":"T"}` Avec une manipulation particulière, le repo distant créé par Alice peut être accessible par Bob. .. tip:: Pour la suite, l'adresse du repo distant sera référencée par ``[GITHUB_REPOSITORY_HOMEPAGE]``. Il faut maintenant que ``Bob`` soit ajouté par ``Alice`` comme collaborateur pour pouvoir contribuer au projet. Ajouter Bob comme collaborateur ............................... Pour un travail en binome efficace, il faut que chacun des membres puisse ajouter/modifier/supprimer des fichiers dans le repo distant. C'est automatiquement le cas pour ``Alice`` qui est propriétaire du repo distant. Pour que ``Bob`` puisse contribuer au projet, ``Alice`` doit l'inviter explicitement à partir de ``[GITHUB_REPOSITORY_HOMEPAGE] >> Settings >> Collaborators >> Add people`` en lui donnant le rôle de ``Collaborator``. ``Bob`` reçoit alors une invitation. Il doit l'accepter pour pouvoir contribuer au projet. .. figure:: images/misc-tba-github-drawio-fig-05.png :align: center Alice ajoute Bob comme collaborateur .. quiz:: quizz-04 :title: Ajout d'un collaborateur #. :quiz:`{"type":"TF","answer":"T"}` Seul le propriétaire du repo distant peut ajouter un collaborateur. #. :quiz:`{"type":"TF","answer":"F"}` Un collaborateur peut utiliser GitHub pour être associé à un repo distant. #. :quiz:`{"type":"TF","answer":"T"}` Un collaborateur peut ajouter des fichiers à un repo distant. #. :quiz:`{"type":"TF","answer":"T"}` Un collaborateur peut modifier des fichiers dans un repo distant. #. :quiz:`{"type":"TF","answer":"T"}` Un collaborateur peut supprimer des fichiers dans un repo distant. Associer un codespace ..................... Depuis la ``[GITHUB_REPOSITORY_HOMEPAGE]``, ``Alice`` et ``Bob`` doivent chacun démarrer leur propre codespace (il n'est pas possible de partager un codespace). :greenbox:`Code` :greenbox:`Codespaces` :greenbox:`Create codespace on main` .. warning:: Une fois créé, le codespace est accessible à une adresse du type ``https://[STRANGE_CODESPACE_NAME].github.dev/``. Les codespaces de ``Alice`` et de ``Bob`` sont indépendants et n'ont donc pas la même adresse. Les codespaces sont associés au compte Github. Il n'est donc pas possible pour ``Alice`` d'accéder au codespace de ``Bob`` et vice versa (une erreur 404 est générée). La seule façon de partager du code entre ``Alice`` et ``Bob`` est de passer par le repo distant, qui est, on le rappelle, le référentiel unique du projet. Il est important : - de bien se répartir le travail pour limiter les conflits ; - de synchroniser régulièrement le repo distant avec les environnements de développement. .. figure:: images/misc-tba-github-drawio-fig-06.png :align: center On retrouve la configuration exposée au paragraphe `Contexte multi utilisateur`_ avec les codespaces associés à chaque utilisateur et connectés au repo distant. C'est la configuration de base. .. tip:: Les codespaces sont gérés sur la page ``_. Il faut veiller à stopper les codespaces après utilisation ou à supprimer les codespaces inutilisés pour ne pas consommer des ressources inutilement. .. quiz:: quizz-05 :title: Associer un codespace #. :quiz:`{"type":"TF","answer":"F"}` On peut partager un codespace entre plusieurs collaborateurs #. :quiz:`{"type":"TF","answer":"T"}` Chaque collaborateur doit démarrer son propre codespace #. :quiz:`{"type":"TF","answer":"T"}` Les codespaces sont associés au compte GitHub de l'utilisateur #. :quiz:`{"type":"TF","answer":"F"}` Les codespaces sont associés au projet #. :quiz:`{"type":"TF","answer":"T"}` Il est possible de supprimer un codespace inutilisé #. :quiz:`{"type":"TF","answer":"T"}` Il est impératif de stopper un codespace après utilisation #. :quiz:`{"type":"TF","answer":"T"}` A l'association du codespace avec le repo distant, le repo distant est synchronisé avec le codespace .. important:: A son démarrage, le codespace dispose d'un repo local qui est synchronisé avec le repo distant. Il est donc important de synchroniser régulièrement les repos locaux (un repo local pour chacun des environnements de développement associé) avec le repo distant pour éviter les conflits. Le workflow ........... .. important:: Les informations ci dessous sont importantes et devront être consultées tout au long de la vie du projet. Le repo distant est le référentiel du projet. A ce titre, il doit être régulièrement synchronisé avec le repo local de chacun des codespaces. ``Alice`` et ``Bob`` devront suivre la démarche suivante : - synchronisation descendante du repo local à partir du repo distant : ``git pull`` - modification/ajout/suppression de fichiers dans le codespace - ajout à l'index du repo local : ``git add .`` - insertion dans l'historique du repo local : ``git commit -m "message explicatif"`` - synchronisation montante du repo local avec le repo distant: ``git push`` .. quiz:: quizz-06 :title: Synchroniser #. :quiz:`{"type":"TF","answer":"T"}` La synchronisation descendante consiste à récupérer les modifications du repo distant #. :quiz:`{"type":"TF","answer":"T"}` La commande ``git pull`` transfère l'historique du repo distant vers le repo local du codespace #. :quiz:`{"type":"TF","answer":"T"}` La synchronisation montante consiste à envoyer les modifications du repo local vers le repo distant #. :quiz:`{"type":"TF","answer":"T"}` La commande ``git push`` envoie les modifications du repo local vers le repo distant #. :quiz:`{"type":"TF","answer":"T"}` Il faut ajouter les fichiers à l'index avant de les insérer dans l'historique du repo local #. :quiz:`{"type":"TF","answer":"T"}` L'historique est d'abord généré dans le repo local #. :quiz:`{"type":"TF","answer":"T"}` La commande ``git commit`` ajoute un élément à l'historique du repo local #. :quiz:`{"type":"TF","answer":"T"}` La commande ``git commit`` est accompagnée d'un message explicatif #. :quiz:`{"type":"TF","answer":"T"}` Les modifications sont effectuées dans le repo local et transférées vers le repo distant #. :quiz:`{"type":"TF","answer":"T"}` Les modifications disponibles dans le repo distant peuvent être transférées dans le repo local Etape initiale !!!!!!!!!!!!!! Au démarrage, le repo distant et le repo local de chacun des codespaces sont synchronisés comme l'indique la figure ci dessous. ``1e14`` est le commit initial et ne contient que le fichier ``README.md``. .. image:: images/misc-tba-github-drawio-fig-07.png :align: center Pour Alice, dans le terminal du codespace :: Alice $ git log --format="%h" 1e14 Même chose pour Bob :: Bob $ git log --format="%h" 1e14 Alice ajoute du code !!!!!!!!!!!!!!!!!!!! Alice ajoute du code dans son codespace. Puis elle ajoute ces fichiers à l'index, et crée le commit. Dans le terminal du codespace :: Alice $ git add . Alice $ git commit -m "Ajout de code" Alice $ git log --format="%h" 78de 1e14 .. image:: images/misc-tba-github-drawio-fig-08.png :align: center A présent, le codespace de ``Alice`` est en avance sur le repo :: Alice $ git status # On branch master # Your branch is ahead of 'origin/master' by 1 commit. # nothing to commit (working directory clean) Alice synchronise son codespace avec le repo !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! Pour maintenir le repo à jour avec ses dernières modifications, Alice doit synchroniser son codespace avec le repo. Elle pousse son commit ``78de`` :: Alice $ git push .. image:: images/misc-tba-github-drawio-fig-09.png :align: center Le repo est à jour mais pas le codespace de Bob :: Alice $ git status On branch master Your branch is up to date with 'origin/master'. nothing to commit, working tree clean Bob récupère les modifications d'Alice !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! Bob récupère les modifications d'Alice en synchronisant son codespace avec le repo. Il tire le commit ``78de`` :: Bob $ git pull remote: Enumerating objects: 1, done. remote: Counting objects: 100% (1/1), done. remote: Compressing objects: 100% (1/1), done. remote: Total 1 (delta 0), reused 0 (delta 0), pack-reused 0 Unpacking objects: 100% (1/1), done. From https://github.com/Alice/TBA 1e14..78de master -> origin/master Updating 1e14..78de Fast-forward file1.txt | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) .. image:: images/misc-tba-github-drawio-fig-10.png :align: center Le codespace de Bob est synchronisé avec le repo :: Bob $ git status On branch master Your branch is up to date with 'origin/master'. $ git log --format="%h" 78de 1e14 Bob ajoute du code !!!!!!!!!!!!!!!!!! Il peut se trouver une situation dans laquelle Bob travaille de son côté, et crée le commit ``e094`` :: Bob $ git add . Bob $ git commit -m "Ajout d'autre code" Bob $ git log --format="%h" e094 1e14 .. image:: images/misc-tba-github-drawio-fig-11.png :align: center Lorsque Bob veut synchroniser son codespace avec le repo, il va se produire une erreur puisqu'il ne dispose pas du commit ``78de``:: Bob $ git push To github.com:Alice/TBA ! [rejected] master -> master (fetch first) error: impossible de pousser des références vers 'github.com:Alice/TBA' astuce: Les mises à jour ont été rejetées car la branche distante contient du travail que astuce: vous n'avez pas en local. Ceci est généralement causé par un autre dépôt poussé astuce: vers la même référence. Vous pourriez intégrer d'abord les changements distants astuce: (par exemple 'git pull ...') avant de pousser à nouveau. astuce: Voir la 'Note à propos des avances rapides' dans 'git push --help' pour plus d'information. Si les modifications de Bob ne sont pas en conflit avec celles d'Alice, il peut tirer les modifications d'Alice, ajouter ses fichiers à l'index, créer le commit et pousser les modifications :: Bob $ git pull Bob $ git add . Bob $ git commit -m "Ajout d'autre code" Bob $ git log --format="%h" e094 78de 1e14 .. image:: images/misc-tba-github-drawio-fig-12.png :align: center Bob peut synchroniser son codespace avec le repo :: Bob $ git push .. image:: images/misc-tba-github-drawio-fig-13.png :align: center Le repo est à jour et Alice peut récupérer les modifications de Bob :: Bob $ git pull .. image:: images/misc-tba-github-drawio-fig-14.png :align: center Résolution de conflit !!!!!!!!!!!!!!!!!!!!! Il peut y avoir une situation pour laquelle Bob a effectué des modifications contradictoires avec le repo, par exemple modifié le même fichier qu'Alice. Dans ce cas, il y a un conflit et lorsque Bob tire les modifications d'Alice, il obtient un message d'erreur :: Bob $ git pull ! [rejected] master -> master (non-fast-forward) error: failed to push some refs to 'https://github.com/yourusername/yourrepo' hint: Updates were rejected because the tip of your current branch is behind hint: its remote counterpart. Integrate the remote changes (e.g. 'git pull') hint: before pushing again. Bob doit résoudre le conflit en éditant le fichier conflictuel. Il doit supprimer les marqueurs de conflit et choisir les modifications à conserver. Une fois le conflit résolu, il ajoute le fichier à l'index, crée un commit de résolution de conflit qui fait l'interface entre ``78de`` et ``e094`` :: Bob $ git add . Bob $ git commit -m "Résolution du conflit" Bob $ git log --format="%h" e094 4a82 78de 1e14 .. image:: images/misc-tba-github-drawio-fig-15.png :align: center Bob peut alors synchroniser son codespace avec le repo et il sera possible à Alice de récupérer les modifications apportées par Bob :: Bob $ git push