Mon premier site
Séances 2 à 4
Dans trois séances, vous aurez un site en ligne. Une vraie adresse, que vous pourrez envoyer à n'importe qui et ouvrir sur votre téléphone. C'est le premier acquis d'apprentissage du cours : identifier, choisir et utiliser un service web pour diffuser un site.
Le site, c'est vous qui le choisissez, et il peut être spectaculaire : un instrument de musique piloté par la webcam, un jeu à la manette, un CV jouable, une illustration de votre ville où il pleut quand il pleut vraiment… Vous le construisez en HTML, CSS et JavaScript, avec l'aide d'un assistant IA. Ce qui compte ici, c'est le chemin qu'il parcourt, de votre ordinateur jusqu'au navigateur de vos visiteurs. Ce chemin, les professionnels l'empruntent tous les jours.
La chaîne de publication
Chaque outil a sa raison d'être :
- VS Code est l'éditeur de code le plus utilisé par les développeurs et les intégrateurs. Il est gratuit, et vous le retrouverez dans tous les cours de programmation du cursus.
- GitHub est l'endroit où les équipes rangent et partagent leur code. Il garde l'historique de chaque version : si vous cassez quelque chose, vous revenez en arrière.
- Vercel est un hébergeur gratuit pour les sites comme le vôtre. Il récupère votre code sur GitHub et le met en ligne à chaque modification, sans rien installer. C'est celui que je montre en classe ; vous pourrez en choisir un autre, repéré pendant vos recherches.
Ce ne sont pas des outils d'école. Ce sont ceux que vous retrouverez en stage.
Ce qu'on fera, séance par séance
| Séance | Ce que vous faites | Chapitres |
|---|---|---|
| 2 · ve 25/09 | Vous cherchez ce que veut dire « héberger un site » et quelles solutions existent. À terminer à la maison. | Recherches : héberger un site |
| 3 · me 30/09 | Vous installez l'éditeur, vous découvrez le HTML et les règles d'ergonomie, puis vous construisez votre site avec un assistant IA. Vous comparez ce qu'il a produit aux règles d'ergonomie, et vous regardez l'enseignant faire le même exercice. | VS Code, HTML, Ergonomie, Premier site |
| 4 · ve 02/10 | Vous déposez votre site sur GitHub, vous le mettez en ligne avec Vercel ou un autre hébergeur gratuit, et vous remplissez votre carnet d'usage de l'IA. | GitHub, Vercel |
| Remise · fin de la séance 4, ve 02/10 | Le lien du dépôt, le lien du site en ligne et le carnet en PDF, dans le devoir Teams. | Premier site |
Ce qu'on attend de vous
- Comprendre ce que vous publiez. L'assistant peut écrire le code, mais vous devez pouvoir expliquer chaque bloc de votre page. Les prompts tuteurs du chapitre Prompting sont là pour ça.
- Suivre la chaîne jusqu'au bout. Un site qui marche sur votre ordinateur n'est pas encore un site en ligne. L'objectif est une adresse publique qui fonctionne.
- Noter votre usage de l'IA dans le carnet, comme pour les recherches.
À la fin de la séance 4, vous aurez parcouru toute la chaîne une fois. C'est elle que vous réutiliserez pour le site de veille de l'examen.