Mon premier coffre à trésors numérique : GitHub et vscode.dev !

Salut les développeurs en herbe ! Aujourd’hui, on va explorer un outil magique qui va révolutionner la façon dont vous travaillez sur vos projets informatiques. Imaginez un peu : un endroit où vous pouvez ranger toutes vos créations, les modifier sans peur, revenir en arrière si vous faites une bêtise, et même travailler à plusieurs sur le même projet sans se marcher sur les pieds. C’est un peu comme un cahier de brouillon super intelligent ou une boîte à outils partagée pour vos codes !

Cet outil, c’est GitHub ! Et pour y mettre les mains dans le cambouis, on va utiliser vscode.dev, la version en ligne de votre éditeur de code préféré. C’est parti pour l’aventure !

Étape 1 : Le sésame pour entrer (se connecter ou créer son compte GitHub)

Pour commencer, il nous faut une clé pour ouvrir la porte de GitHub. Si tu as déjà un compte, connecte-toi (attention à ne pas te tromper de mot de passe, on n’est pas chez les Bisounours ici !). Si ce n’est pas le cas, pas de panique, on va en créer un ensemble. C’est simple comme bonjour :

1. Ouvre ton navigateur web préféré (Chrome, Firefox, Edge, même Brave si tu es un aventurier !) et va sur github.com.
2. Clique sur “Sign up” (ou “S’inscrire”) si tu n’as pas de compte. Suis les étapes : choisis un nom d’utilisateur (ton “pseudo de super-héros du code”), un e-mail et un mot de passe costaud. Il y aura peut-être un petit jeu pour prouver que tu n’es pas un robot (ces coquins adorent se faire passer pour nous !).
3. Une fois ton compte créé et vérifié (regarde dans tes mails, ils t’enverront un lien pour activer ton compte), connecte-toi.

Étape 2 : Créons notre premier “coffre à trésors” (notre repository) !

Maintenant que tu es connecté, tu es sur la page d’accueil de GitHub. C’est là que la magie commence ! Un repository (ou “repo” pour les intimes) c’est comme un dossier spécial pour ton projet. Mais un dossier intelligent !

1. Sur la page d’accueil de GitHub, cherche le bouton “New” (Nouveau) ou le petit signe + en haut à droite, puis clique sur “New repository”.
2. Nom du repository : Donne un nom clair et simple à ton projet. Par exemple : mon-premier-projet-super. Évite les espaces et les caractères spéciaux, utilise des tirets - si tu veux séparer les mots (c’est la bonne pratique !).
3. Description (optionnel mais recommandé) : Ajoute une petite phrase pour expliquer ce que c’est. Par exemple : “Mon tout premier projet pour apprendre GitHub et vscode.dev.”
4. Public ou Private ? C’est le grand dilemme ! Pour nos premiers pas, et pour garder tes expériences secrètes (on ne montre pas ses brouillons à tout le monde, n’est-ce pas ?), choisis “Private”. C’est super important ! Ça veut dire que seuls toi et ceux que tu autorises pourront voir ton travail.
5. Add a README file : Coche cette case ! Un fichier README.md (pour “Read Me”, “Lis-moi”) c’est la carte d’identité de ton projet. C’est la première chose que les gens (ou toi plus tard) verront en arrivant sur ton repo. Il doit contenir un minimum d’explications sur ce que contient ton “coffre”.
6. Clique sur “Create repository”. Et voilà ! Ton premier coffre à trésors est créé !

Étape 3 : Ouvrons la boîte à outils magique (vscode.dev) !

Maintenant que notre “coffre” est prêt, on va l’ouvrir avec notre éditeur de code en ligne préféré, vscode.dev.

1. Ouvre un nouvel onglet dans ton navigateur.
2. Tape simplement vscode.dev dans la barre d’adresse et appuie sur Enter. Tu verras une version allégée mais super efficace de Visual Studio Code apparaître.
3. Dans vscode.dev, clique sur le menu “File” (Fichier) en haut à gauche, puis “Open Remote…” (Ouvrir distant…).
4. Choisis “Open Repository…” (Ouvrir un dépôt…). Une fenêtre s’ouvrira et te demandera de te connecter à GitHub si ce n’est pas déjà fait. Suis les instructions.
5. Une fois connecté, tu verras la liste de tes repositories. Cherche celui que tu viens de créer (mon-premier-projet-super) et clique dessus pour l’ouvrir.

Étape 4 : Les premières modifications dans notre coffre !

Tu es maintenant dans vscode.dev, avec ton repository ouvert. Tu devrais voir ton fichier README.md sur la gauche.

1. Ajoutons un nouveau fichier : Sur la gauche, dans l’explorateur de fichiers, clique sur l’icône “New File” (Nouveau fichier), c’est une petite feuille avec un signe +. Nomme-le salut.txt.
2. Dans ce nouveau fichier salut.txt, écris un petit message, par exemple : “Salut le monde ! C’est mon premier fichier sur GitHub !”
3. Modifions le README.md : Clique sur README.md pour l’ouvrir. Tu peux ajouter une ligne en dessous du texte existant, par exemple : “Ce projet contient un fichier salut.txt pour dire bonjour !”

Étape 5 : “Commit” ! L’instant photo de ton travail !

Tu as fait des modifications, super ! Maintenant, il faut les enregistrer sur GitHub. C’est ce qu’on appelle un “commit”. Imagine que c’est comme prendre une photo instantanée de l’état de ton travail à un moment précis. C’est super important, car ça te permet de revenir en arrière si tu te trompes, ou de voir l’historique de toutes tes modifications.

1. Sur la gauche de vscode.dev, clique sur l’icône du contrôle de source (une sorte de petite fourche ou de trois cercles connectés par des lignes). C’est la troisième icône en partant du haut.
2. Tu verras la liste des fichiers que tu as modifiés (salut.txt et README.md).
3. Dans la zone de texte au-dessus de “Changes” (Modifications), écris un message de commit clair et précis. C’est comme une petite note pour te rappeler ce que tu as fait. Par exemple : “Ajout du fichier salut.txt et mise à jour du README.”
4. Clique sur le bouton “Commit & Push” (Valider et pousser). Si on te demande de te connecter à GitHub, fais-le. Ça envoie tes modifications de vscode.dev vers ton “coffre” sur GitHub.

Étape 6 : Admirons le travail sur GitHub !

Retournons sur le site de GitHub pour voir si nos modifications sont bien arrivées !

1. Retourne sur l’onglet de ton navigateur où tu as GitHub ouvert (sur la page de ton repository mon-premier-projet-super).
2. Actualise la page (F5 ou le bouton de rafraîchissement).
3. Magie ! Tu devrais voir ton fichier salut.txt apparaître, et le contenu de ton README.md sera mis à jour. Tu verras même ton message de commit ! C’est pas génial, ça ?

Félicitations ! Tu as créé ton premier repository, modifié des fichiers en ligne et enregistré tes changements. Tu es officiellement un explorateur de GitHub ! N’hésite pas à expérimenter, c’est comme ça qu’on apprend le mieux. Et si tu as des questions, n’hésite pas à demander à ton prof préféré (moi, bien sûr !) 😉