Code et anime tes premiers projets en Javascript
Formations requises
- Outil Javascript
- Module : Code et anime tes premiers projets en Javascript
Description du module
Les objectifs pédagogiques
Dans ce module, les makers vont découvrir les bases de JavaScript côté navigateur. Ils s’initieront également à la manipulation du DOM et à la gestion d’événements, pour rendre leurs pages interactives.
Ils vont apprendre à :
- Comprendre le rôle de JavaScript par rapport à HTML/CSS
- Utiliser la console et déboguer (messages, erreurs, console.log)
- Manipuler les variables, types et opérateurs
- Écrire des conditions et des boucles (contrôler le flux du programme)
- Créer et appeler des fonctions (réutiliser du code)
- Sélectionner et modifier le DOM (texte, attributs, classes, styles)
- Écouter et gérer les événements (clic, clavier, saisie)
- Structurer un petit script propre (noms clairs, indentation, commentaires)
- Réaliser de petites interactions (ex. bouton “dark mode”, compteur, menu déroulant)
Les activités du module
Voici les différentes activités du module
Jour 1
Jour 2
Jour 3
Jour 4
Jour 5
1h
Explorations JS
Diaporama
Création d’un site interactif
Création d'un site interactif
Création d'un site interactif
30 min
Explorations JS
Diaporama
Création d’un site interactif
Création d'un site interactif
Création d'un site interactif
30 min
Explorations JS
Diaporama
Création d'un site interactif
Création d'un site interactif
Création d'un site interactif
1h
Explorations JS
DIaporama
Création d'un site interactif
Création d'un site interactif
Création d'un site interactif
Adaptation formats spéciaux
Les activités
Exploration JS
À travers plusieurs mini-projets, les makers vont découvrir les bases de JavaScript et comprendre comment ce langage permet d’interagir avec l’HTML et le CSS pour rendre une page web dynamique.
Diaporama
Dans cette activité, les makers vont concevoir un diaporama d’images qui se défilent automatiquement, un incontournable pour donner du mouvement et de la vie à leur page web.
Création d’un site interactif
Les makers vont expérimenter différents effets visuels et interactifs en JavaScript pour transformer leurs pages statiques en véritables sites dynamiques et expressifs.
Lien vers la fiche d’activité
BONUS : Tableau dynamique
Dans cette activité, les makers vont apprendre à manipuler le contenu d’une page web avec JavaScript en écrivant dynamiquement du texte sur une image.
Ils découvriront comment le code peut modifier le HTML en temps réel et réagir aux actions de l’utilisateur.