GitHub : explorer l’interface avant de connecter un projet
Si Git vous permet de versionner vos fichiers en local, GitHub vous offre un espace distant pour les partager, les sauvegarder et collaborer. Avant d’y envoyer notre premier projet, prenons le temps de comprendre ce que propose la plateforme : comment créer un compte, quels outils sont à disposition, et comment s’organise l’interface.
Ce tour d’horizon nous aidera à mieux naviguer dans GitHub, seul·e ou en équipe. En complément de l’article Démystifier Git : à quoi ça sert vraiment ?, nous verrons ici ce que GitHub apporte, au-delà du terminal. Ce sera également une bonne base avant l’article GitHub : travailler seul ou à plusieurs depuis un seul dépôt distant, qui expliquera la mise en relation concrète entre notre code local et GitHub.
Créer un compte GitHub
Pour utiliser GitHub, il faut commencer par créer un compte gratuit sur github.com. L’inscription se fait en quelques étapes (Sign up) : une adresse e-mail, un mot de passe, un nom d’utilisateur, et la validation d’un captcha. GitHub vous propose ensuite de choisir un plan (le plan gratuit suffit largement pour débuter), puis vous guide pour personnaliser votre profil.
Une fois inscrit, vous pouvez accéder à votre tableau de bord, créer votre premier dépôt, ou explorer ceux des autres. Pensez à vérifier l’e-mail reçu pour activer votre compte. GitHub vous invite aussi à activer l’authentification à deux facteurs (2FA) — ce n’est pas obligatoire, mais fortement recommandé pour sécuriser vos projets, surtout si vous travaillez en équipe ou sur des dépôts publics.
Découvrir le tableau de bord GitHub
Une fois connecté à votre compte, vous arrivez sur une interface claire, organisée autour d’un tableau de bord. Tout en haut, une barre de menu permet d’accéder aux fonctions principales : recherche, notifications, gestion des dépôts, création rapide, et accès à votre profil.
Ce tableau de bord vous présente d’abord vos projets récents, les activités des dépôts que vous suivez, et les suggestions de la plateforme. GitHub propose aussi un menu latéral permettant d’accéder à vos dépôts, à vos contributions, à vos organisations, ou à vos projets favoris.
Tout dans cette interface est personnalisable : l’apparence (clair/sombre), les préférences de notification, l’accès aux outils (Codespaces, Gists, etc.), ou encore les éléments affichés sur votre profil public. Même les dépôts peuvent être réorganisés ou triés selon votre usage. Cette souplesse permet d’adapter GitHub à votre façon de travailler.
Remarque : Plus vous utilisez GitHub, plus cet espace vous proposera des raccourcis et suggestions utiles, basés sur vos dépôts actifs, les pull requests en attente, ou les discussions en cours.
Naviguer dans GitHub : comprendre la barre supérieure
Une fois connecté, GitHub vous présente une barre horizontale qui traverse toutes les pages. Elle vous permet de naviguer dans l’ensemble de la plateforme, quel que soit l’endroit où vous êtes. Elle se compose de trois grandes zones : un menu de navigation à gauche, un ensemble de raccourcis à droite, et votre espace personnel tout au bout.
Sur la gauche : le menu principal
En cliquant sur l’icône ☰ (menu hamburger), vous ouvrez le panneau latéral. Il donne accès à l’ensemble des fonctionnalités transversales de GitHub. Voici les plus importantes
| Section | Fonction | Exemples ou usages |
|---|---|---|
| Issues | Suivre des tâches ou signaler un problème | Rédiger une liste de choses à faire, signaler un bug, attribuer une tâche à un·e collègue, commenter son avancement. |
| Pull requests | Proposer des modifications de code | Comparer deux branches, demander une relecture, intégrer un correctif. Chaque pull request peut être discutée ligne par ligne. |
| Projects | Organiser visuellement un projet | Créer des tableaux de type kanban avec des colonnes personnalisées (À faire, En cours, Terminé…). Chaque carte peut être liée à une issue ou une tâche. |
| Discussions | Échanger en dehors du code | Une sorte de forum intégré : on peut y poser des questions ouvertes, faire des propositions, accueillir les nouveaux contributeurs, ou documenter des décisions d’équipe. |
| Codespaces | Coder directement dans le navigateur | Un environnement de développement préconfiguré avec Visual Studio Code accessible depuis n’importe où, sans rien installer localement. Pratique pour tester ou corriger sans délai. |
| Copilot | Assistant de développement par IA | GitHub Copilot suggère du code automatiquement en analysant ce que vous tapez. Il peut compléter des lignes entières, générer des fonctions, ou proposer des corrections. |
| Explore | Découvrir des projets publics | Une porte d’entrée vers des dépôts populaires, des tendances par langage, ou des collections thématiques. Pratique pour apprendre par l’exemple ou trouver une base solide. |
| Marketplace | Ajouter des outils connectés à GitHub | Intégrations avec des outils comme Slack, Trello, ou des services d’automatisation de tests et déploiements (CI/CD avec GitHub Actions). |
Sur la droite : raccourcis vers vos actions personnelles
En haut à droite, plusieurs icônes permettent d’accéder rapidement aux éléments qui vous concernent :
| Élément | Description | Utilisation |
|---|---|---|
| Champ de recherche | Recherche intégrée à GitHub | Permet de retrouver un dépôt, un utilisateur, un fichier ou une branche. Peut aussi retrouver une issue ou un commit précis. |
| Copilot | Accès à l’assistant IA | Propose des suggestions de code en temps réel. Configuration possible et installation pour Visual Studio Code, Xcode, JetBrains, GitHub CLI, etc. |
| Menu “New” | Création rapide de contenu |
Permet de :
|
| Vos issues | Billets ouverts où vous êtes impliqué | Raccourci vers toutes les issues où vous avez été mentionné ou assigné, dans tous les dépôts. |
| Vos pull requests | Demandes de fusion liées à votre activité | Accès aux PR que vous avez créées, commentées ou dont la relecture vous a été demandée. |
| Notifications | Suivi centralisé des activités | Regroupe les alertes concernant vos dépôts, vos assignations, vos discussions, vos revues. |
Tout au bout : votre profil et ses réglages
Enfin, l’icône avec votre avatar ouvre un menu personnel très complet. Il vous permet d’accéder à :
| Section | Description | Utilisation |
|---|---|---|
| Profil | Page publique visible par tous | Affiche votre bio, vos dépôts publics, vos statistiques de contribution, vos followers… |
| Dépôts, projets, gists, organisations | Vos ressources visibles ou collaboratives | Accès rapide à tous vos dépôts (publics ou privés), vos gists, projets collaboratifs ou structures d’équipe. |
| Copilot | Réglages IA personnels | Permet de désactiver Copilot, changer vos préférences de suggestion, ou consulter l’usage. |
| Paramètres | Options avancées du compte | Gérez la sécurité (2FA, clés SSH), l’apparence, les emails, les préférences GitHub ou la visibilité des dépôts. |
| Support, documentation, communauté | Aide officielle et forums | Redirection vers la documentation GitHub, le support technique ou la communauté de contributeurs. |
Créer un dépôt GitHub : nouveau ou importé ?
Dès que vous cliquez sur l’icône ➕ (ou dans le menu “New”), GitHub vous propose plusieurs options. Pour héberger un projet, deux choix reviennent souvent :
New repository ou Import repository.
- New repository sert à créer un projet vide (ou presque), dont vous êtes l’auteur ou l’initiatrice. On part d’une page blanche, même si quelques fichiers initiaux peuvent être ajoutés (README,
.gitignore, licence). - Import repository permet d’importer un projet existant, déjà hébergé ailleurs (par exemple sur GitLab, Bitbucket, ou un serveur personnel), en copiant son contenu dans GitHub.
Nous allons ici nous concentrer sur la création d’un nouveau dépôt. Lorsque vous créez un dépôt, GitHub vous demande quelques informations importantes :
| Élément | Explication | Exemple ou conseil |
|---|---|---|
| Repository name | Le nom unique du projet. Il apparaîtra dans l’URL. | mon-site-html, outil-videos, etc. |
| Description | Un court résumé visible dans les listes et profils. | Structure de base pour site HTML/CSS/JS |
| Public / Private | Définit si le dépôt est visible par tous ou seulement par vous et vos collaborateurs. | Un projet de formation peut rester privé au début. |
| Initialize with a README | Crée un fichier d’accueil que Git reconnaît. Utile pour documenter le projet. | Pratique si vous ne liez pas encore le dépôt à un projet local. |
| Add .gitignore | Permet d’exclure certains fichiers dès le départ du suivi de version. | Nous verrons ce fichier plus en détail dans un autre article. |
| Choose a license | Optionnel mais utile si vous partagez du code en open source. | MIT, GPL, etc. GitHub propose des modèles types. |
Dans notre cas, nous ne finaliserons pas la création du dépôt en ligne. Nous nous contentons ici de préparer l’espace distant qui accueillera notre projet local. Pour cela, il est important de ne pas cocher l’option “Initialize with a README”, ni d’ajouter un fichier .gitignore ou une licence. Cela permet à GitHub de créer un dépôt réellement vide, compatible avec un futur git push depuis notre poste de travail. Si un seul fichier est généré à cette étape, Git considérera le dépôt comme initialisé, ce qui empêcherait une synchronisation directe sans pull préalable.
Nous reviendrons plus en détail sur ces différentes options dans l’article GitHub : interface et prise en main, pour bien comprendre les implications de chaque choix.
Fiche d’un dépôt GitHub : code, commits, branches, releases…
Lorsqu’un dépôt est bien rempli, son interface devient un véritable centre de pilotage pour le code, les versions et les échanges entre contributeurs. Pour bien comprendre comment tout cela s’organise, prenons quelques exemples concrets.
Le dépôt mdn/beginner-html-site, proposé par Mozilla, est un bon point de départ. Il contient un simple site HTML pour débutant. Sur sa page principale, l’onglet Code permet de naviguer dans l’arborescence des fichiers. Juste au-dessus, on voit le nombre de commits réalisés, les branches existantes, et les éventuelles pull requests ouvertes. C’est un bon exemple pour découvrir la structure d’un dépôt sans se perdre dans sa complexité.
Si l’on souhaite voir un projet open source plus avancé, le dépôt vuejs/core montre toute la richesse de GitHub. En plus du code, les onglets Issues et Discussions regroupent les questions, suggestions, ou problèmes rencontrés par la communauté. L’onglet Actions révèle les automatisations en place (tests, déploiement, etc.), tandis que Releases affiche les versions publiées du framework Vue. C’est un très bon cas pour comprendre la collaboration à grande échelle.
Automatiser avec Actions : tests, déploiement et plus encore
L’onglet Actions permet d’activer des tâches automatiques à chaque mise à jour du dépôt. On parle alors de pipeline CI/CD (Continuous Integration / Continuous Deployment). Ces workflows automatisent des opérations comme lancer des tests, vérifier le bon fonctionnement du code, ou déployer automatiquement une version sur un site ou un serveur. GitHub exécute chaque étape selon un scénario défini dans un fichier de configuration
.yml, et affiche ensuite le détail de chaque tâche exécutée. Pour voir un exemple concret, vous pouvez consulter le dépôt actions/starter-workflows et explorer l’onglet Actions : chaque ligne correspond à une exécution, avec son statut (réussi ou échoué), son historique, et les journaux complets.
Enfin, pour se rendre compte de l’usage d’un Wiki, ou des échanges structurés dans Projects et Discussions, le dépôt microsoft/vscode est un cas d’école. Il regroupe de nombreux collaborateurs, propose une documentation collaborative, et montre comment un grand projet organise ses tickets, ses contributions et ses versions en parallèle.
Chaque onglet a sa fonction. Même si nous ne les explorerons pas tous en détail ici, ces exemples permettent de visualiser la puissance d’un dépôt GitHub et les nombreuses interactions qui s’y jouent au quotidien.
Paramètres généraux du compte
Dans le menu déroulant de votre profil (en haut à droite), l’entrée Settings donne accès à tous les réglages de votre compte GitHub. C’est ici que vous pouvez personnaliser votre apparence (thème clair ou sombre), sécuriser votre accès avec une clé SSH ou une authentification à deux facteurs, gérer vos notifications ou encore définir vos préférences par défaut pour chaque nouveau dépôt.
Ces paramètres n’agissent pas sur un projet en particulier, mais sur l’ensemble de votre environnement GitHub. Si vous travaillez régulièrement depuis un éditeur ou en équipe, prendre quelques minutes pour ajuster ces préférences peut vraiment simplifier votre quotidien.
Personnalisation de l’environnement
GitHub permet d’adapter finement son interface de travail. Dans les paramètres du compte, vous pouvez choisir votre thème (clair, sombre, dynamique), réorganiser les éléments de votre profil public, ou encore mettre en avant certains dépôts ou projets. L’objectif : faire apparaître rapidement ce qui vous est utile, et rendre votre page GitHub plus lisible pour les autres utilisateurs.
Si vous êtes actif sur plusieurs projets ou si vous contribuez à des dépôts open source, ces options de personnalisation sont un vrai plus pour clarifier vos rôles, valoriser votre travail, et garder une interface épurée.
Pourquoi utiliser GitHub ?
GitHub n’est pas seulement un endroit pour stocker du code. C’est une plateforme pensée pour travailler à plusieurs, garder une trace de chaque évolution, documenter son projet, corriger à plusieurs mains, et publier des versions stables. L’historique distribué de Git, combiné à une interface claire et collaborative, permet de gérer des projets complexes de manière fluide.
Même en solo, GitHub reste utile : il offre une sauvegarde distante, un historique consultable, des automatisations, et une documentation accessible. Et dès qu’un autre développeur souhaite contribuer ou proposer une amélioration, tout est déjà en place pour faciliter la collaboration.
Conclusion
Dans un prochain article, nous verrons comment relier un projet Git local à un dépôt GitHub. Nous apprendrons à publier notre code avec git push, à récupérer les mises à jour avec git pull, et à travailler de manière fluide entre local et distant. Ce sera aussi l’occasion d’explorer les bonnes pratiques de collaboration à plusieurs, et de comprendre ce que signifie vraiment “travailler en équipe” avec Git et GitHub.
