Les élèves peuvent-ils utiliser un framework ?

Il s’agit de HTML, de CSS et de JavaScript sans framework, comme le demandent les programmes. Une variante TypeScript est disponible pour les classes plus avancées.

L’aperçu exécute-t-il leur JavaScript ?

Oui, dans un cadre isolé qui ne peut lire ni les cookies ni les données enregistrées du site : une boucle infinie ne bloque que l’aperçu.

Créer une tâche HTML, CSS et JavaScript

Une tâche web comporte trois fichiers au lieu d’un : la page, les styles et le script. L’élève modifie celui de son choix, et l’aperçu affiché à côté de l’éditeur se met à jour.

Trois volets et un aperçu

Chaque onglet correspond à un fichier. L’aperçu affiche la page dans son état actuel, dans un cadre isolé : un script défaillant ne casse que l’aperçu.

Aucun serveur à lancer, aucun fichier à enregistrer sur le bureau. Vous faites ainsi l’économie de la première séance habituelle d’une séquence sur le web, qui consiste à expliquer à trente élèves où est passé leur fichier.

La page est construite et exécutée dans le navigateur de l’élève : une tâche web n’a donc ni bouton « Exécuter », ni file d’attente, ni durée d’exécution à régler. L’aperçu est l’exécution, et il suit la frappe. Un document HTML complet collé dans le volet HTML est utilisé tel quel, avec les styles et le script placés à l’intérieur, au lieu d’être enveloppé dans une seconde page.

Un éditeur HTML, CSS et JavaScript à trois onglets, avec la page obtenue affichée à côté — La page, les styles et le script dans trois onglets, avec le résultat à côté. Rien à enregistrer, aucun serveur à lancer.

Ce que vous préparez, et ce que les élèves rendent

Vous rédigez les trois fichiers de départ, et chaque élève commence avec ce que vous y avez laissé : une page sans styles, une feuille de style avec un commentaire là où la règle doit être écrite, ou trois fichiers vides.

Il est impossible d’ajouter un quatrième fichier à une tâche web, car ce sont ses trois volets qui la définissent. C’est voulu : si la structure d’une tâche peut varier, le correcteur en est réduit à deviner.

Il existe une variante TypeScript, Web (TS), avec les trois mêmes volets, où le script est en TypeScript. Il est compilé dans l’onglet au fil de la frappe, et une erreur de type ne bloque jamais l’aperçu, puisqu’il n’y a pas de bouton « Exécuter » pour la refuser.

Dans une leçon

Un bloc de code Web ou Web (TS) dans une leçon a les trois mêmes onglets et le même aperçu : la classe peut modifier une page sans quitter la leçon. Ce que vous écrivez dans le bloc est le point de départ de chaque élève, et les modifications de chacun sont enregistrées dans sa propre copie : la vôtre ne bouge jamais.

Cochez « Permettre aux élèves de modifier cette page et de la voir » sur le bloc, option activée à la création du bloc. Décochée, la page est présentée comme du code à lire, comme avant. Il n’y a ni bouton « Exécuter » ni zone de saisie, car une page n’en a pas : l’aperçu est son exécution.

Questions fréquentes

Les élèves peuvent-ils utiliser un framework ?: Il s’agit de HTML, de CSS et de JavaScript sans framework, comme le demandent les programmes. Une variante TypeScript est disponible pour les classes plus avancées.
L’aperçu exécute-t-il leur JavaScript ?: Oui, dans un cadre isolé qui ne peut lire ni les cookies ni les données enregistrées du site : une boucle infinie ne bloque que l’aperçu.