« JavaScript dans le navigateur » : différence entre les versions

De EduTech Wiki
Aller à la navigation Aller à la recherche
 
(2 versions intermédiaires par le même utilisateur non affichées)
Ligne 12 : Ligne 12 :
== Description du module ==
== Description du module ==


Dans ce troisième 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.
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ée avec le HTML de la page et exécuté dans le navigateur. Ce principe est à la base de l'interactivité des pages web.
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 [[HTML5 audio et video|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.
Nous poursuivrons cet aspect en l'appliquant à des contextes plus spécifiques, comme l'intégration avec des composantes [[HTML5 audio et video|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 [[SVG avec JavaScript|JavaScript permet de les manipuler facilement]].
Un autre aspect qui sera abordé dans le module est le principe d'[[Animation avec JavaScript|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 [[SVG avec JavaScript|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.
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.

Dernière version du 14 avril 2020 à 13:22

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.