Les Outils du bâtisseur

Pour écrire du HTML, devine quoi ? Tu n'as littéralement besoin de rien de plus que :

1. De quoi écrire du texte.
2. De quoi lire du texte.

Sur le papier, le Bloc-Notes de Windows suffit ! (Mais on ne va quand même pas s'infliger ça). Voici donc le "starter pack" du pro.

L'Éditeur de Code : Visual Studio Code

C'est la norme aujourd'hui dans l'industrie. C'est gratuit, c'est puissant, c'est développé par Microsoft (mais c'est open source). C'est comme Word, mais fait exprès pour les développeurs. Ça va colorer ton texte pour le rendre plus lisible, ça va automatiquement fermer tes balises (magique, tu devras écrire deux fois moins vite !)

👉 Si ce n'est pas déjà fait : télécharge-le sur code.visualstudio.com.

Les extensions utiles (à installer dans VS Code) :

• Prettier - Code formatter : Parce qu'un code bien indenté (bien aligné) est un code lisible.
• Live Server : Ça, c'est le MUST HAVE (l'indispensable) ! Ça va te créer un mini-serveur local qui rechargera automatiquement ta page web dans le navigateur dès que tu fais CTRL+S (Sauvegarder). Plus besoin d'appuyer sur F5 comme un fou à la moindre modification.

Le Navigateur Web

C'est lui qui interprète ton texte brut pour en faire des jolies images et textes en gras. Tu connais certainement Chrome, Firefox, Safari ou Edge.

On recommande souvent Google Chrome ou Firefox parce qu'ils viennent avec des Outils de développement (DevTools) incroyables. Quand on passera au CSS ou au JavaScript, on aura souvent besoin d'appuyer sur la fameuse touche "F12" ("Inspecter l'élément") ou "Clic-Droit -> Inspecter" pour voir les coulisses de notre page, et Chrome est le roi pour ça.

L'organisation des dossiers

Un site web n'est rien d'autre qu'un dossier sur ton ordinateur contenant des petits fichiers texte et des images. Pour bien démarrer :

1. Crée un dossier "Mes Projets", et fais-le glisser carrément dans ton Visual Studio Code.
2. BOOM. Tu as ton environnement de travail.

On est armés, il est temps de faire cracher ses premiers mots à notre écran. Go à la leçon 0.4 !