JavaScript dans le navigateur

De EduTech Wiki
Version datée du 14 avril 2020 à 13:22 par Mattia A. Fritz (discussion | contributions) (→‎Description du module)
(diff) ← Version précédente | Voir la version actuelle (diff) | Version suivante → (diff)
Aller à la navigation Aller à la recherche
Initiation à la pensée computationnelle avec JavaScript
Page d'entrée du module
JavaScript dans le navigateur
◀▬▬▶
à finaliser
2020/04/14
Catégorie: JavaScript

Description du module

Dans ce module de l'initiation à la pensée computationnelle avec JavaScript nous allons illustrer plus en détail l'application plus répandue, à présent, de JavaScript : la création de pages web dynamiques qui permettent au contenu de la page d'évoluer, notamment en fonction des actions de l'utilisateur, sans la nécessité d'effectuer une nouvelle requête au serveur.

Le siège de la computation est dans ce cas l'ordinateur de l'utilisateur, plus précisément le navigateur web qui est utilisé pour télécharger le contenu de la page et l'afficher à l'écran. Comme on l'a vu dans le module précédent, Concepts de base de JavaScript, lorsqu'une page web possède du code JavaScript, celui-ci est téléchargé avec le HTML de la page et exécuté dans le navigateur. Ce principe est à la base de l'interactivité des pages web.

Nous poursuivrons cet aspect en l'appliquant à des contextes plus spécifiques, comme l'intégration avec des composantes audio et vidéo. En effet, grâce à l'intégration de JavaScript avec le DOM, il est possible de contrôler de manière automatisée la lecture de contenus audio-visuels. Par exemple, on peut instruire une page qui contient une vidéo afin qu'elle mette en pause la lecture à un moment donnée pour afficher une question de compréhension.

Un autre aspect qui sera abordé dans le module est le principe d'animation. JavaScript permet en effet d'animer toutes les composantes qui sont présentes dans une page web, à travers la modification programmée de leurs attributs comme la taille, la position, la couleur ou l'opacité. Particulièrement utiles à l'animation, mais au graphisme en général, nous aborderons également les SVG et comment JavaScript permet de les manipuler facilement.

Enfin, une partie importante du module sera consacrée aux bibliothèques JavaScript, c'est-à-dire du code qui a déjà été développé par d'autres programmeurs et qui peut être réutilisé dans sa propre application. En particulier, nous verrons une bibliothèque, jQuery, qui facilite la manipulation du DOM, et sa déclinaison jQuery UI qui permet d'ajouter des fonctionnalités de type glisser-poser à une page web.