8. Hello, World !

Alors pour le moment c’est bien beau, on a vu beaucoup de choses mais nous n’avons toujours rien fait de concret. Il est temps de rentrer dans le vif du sujet.

Nous allons donc créer notre toute première page Web. C’est toujours un moment émouvant dans la vie d’un développeur Web !

Mais la question c’est, comment développer cette fameuse première page ?

Si vous vous rappelez bien, une page web est composée au minimum d’un fichier HTML. Pour se faire, il suffit donc de :

  1. Créer un nouveau fichier dans VSCode
  2. Écrire un petit message à l’intérieur de ce fichier, comme Hello, World par exemple.
  3. Enregistrer ce fichier avec l’extension .html.

Voici ce que j’obtiens de mon côté :

J’enregistre mon premier site, créer avec Visual Studio Code.

Ensuite, dans votre gestionnaire de fichiers (ou Finder si vous êtes sur Mac), allez à l’emplacement du fichier en question et double cliquez dessus, ou faites un Clic droit > Ouvrir avec, si vous souhaitez choisir le navigateur de votre choix :

Et là, magique ! Un site apparaît avec le texte que vous avez rentré :

Notre premier site Web en action, félicitations ! 🎉

Eh bien voilà, vous venez de créer votre première site Web, et admirer le résultat. Bravo à vous, vraiment !

Nous avons là un site qui fonctionne comme sur internet :

  1. Le code HTML, c’est le texte que vous avez tapé dans votre fichier site.html.
  2. Le navigateur, c’est celui que vous avez utilisé pour aller sur votre site. Il a « traduit » votre fichier HTML pour en faire un page web.
  3. Le serveur, c’est un peu votre gestionnaire de dossier pour le moment, qui a envoyé au navigateur le fichier nécessaire pour afficher notre site.
  4. Notre modeste site n’a pas encore de code CSS, car c’est un langage optionnel si vous vous rappelez bien.

Alors, je dois vous avouer qu’en réalité, le petit bout de texte que nous avons écrit dans notre fichier, ce n’est pas exactement du HTML, car nous n’avons pas utiliser de balises HTML, mais du simple texte. Cependant, le navigateur a quand même eu l’intelligence de comprendre ce qu’il devait l’afficher. Dans le prochain chapitre, nous allons nous attaquer aux choses sérieuses, et commencer le développement de notre superbe Pokédex !

En principe, le fichier de base d’un site web se nomme index.html, et non site.html comme nous l’avons fait. Il s’agit que d’une convention, que l’on va commencer à suivre pour la suite. 😉