« JavaScript dans le navigateur » : différence entre les versions
(Page créée avec « {{tutoriel |fait_partie_du_cours=Initiation à la pensée computationnelle avec JavaScript |fait_partie_du_module=JavaScript dans le navigateur |module_suivant=Concepts de... ») |
|||
| (5 versions intermédiaires par le même utilisateur non affichées) | |||
| Ligne 1 : | Ligne 1 : | ||
{{tutoriel | {{tutoriel | ||
|fait_partie_du_cours=Initiation à la pensée computationnelle avec JavaScript | |fait_partie_du_cours=Initiation à la pensée computationnelle avec JavaScript | ||
| | |est_module_de=JavaScript dans le navigateur | ||
| | |module_précédant=Concepts de base de JavaScript | ||
|module_suivant=JavaScript sur le serveur | |||
|pas_afficher_sous-page=Non | |pas_afficher_sous-page=Non | ||
|page_precedente= | |page_precedente=Interactivité avec JavaScript | ||
|page_suivante= | |page_suivante=HTML5 audio et video | ||
|statut=à finaliser | |statut=à finaliser | ||
|cat tutoriels=JavaScript | |cat tutoriels=JavaScript | ||
}} | }} | ||
== Description du module == | == Description du module == | ||
Dans ce | 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 | 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 | 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 | 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.