Introduction
Le JavaScript
1. Une rapide histoire du JavaScript
Ce langage est né en 1995 sous la houlette de Brendan Eich, qui travaillait chez Netscape. La légende dit que Eich créa ce langage en une dizaine de jours seulement ! Le projet initial fut baptisé Mocha.
Initialement, Brendan Eich développe le langage LiveScript qui est fait pour être utilisé côté serveur. En 1996, avec la sortie de la version 2 du navigateur de Netscape, Netscape Navigator, ce langage fut intégré au moteur du navigateur et nommé JavaScript.
Le point fort du JavaScript est qu’il n’a pas besoin d’être traduit par les navigateurs pour y être interprété et exécuté. Non, JavaScript est immédiatement disponible, comme les autres ressources de type texte et image, pour construire les pages web. JavaScript est exécuté par le navigateur.
Très rapidement, Microsoft créa un clone parfait du JavaScript qu’il nomma JScript et qui fut intégré à Internet Explorer dans sa version 3.
Ensuite, en 1997, JavaScript fut soumis à l’ECMA (European Computer Manufacturers Association) pour y être standardisé sous le nom d’ECMAScript. Actuellement, c’est toujours l’ECMA qui édicte ce standard sous le nom de Standard ECMA-262. La dernière version date de juin 2018...
Les objectifs du JavaScript
1. Dynamiser les pages web
JavaScript a pour simple objectif initial de dynamiser les pages web, en y ajoutant des interactions avec les visiteurs. Les premiers développeurs qui développaient en JavaScript affichaient dans les pages web des menus déroulants, des fenêtres surgissantes (appelées maintenant des popups), voire des flocons de neige à Noël. Actuellement, ces effets semblent bien banals et un peu d’un autre âge, mais à l’époque, c’était attrayant !
De nos jours, JavaScript s’insère en tant que constructeur dynamique des pages web, à côté de la structure, définie par le HTML, et la mise en forme et la mise en page, définies par les CSS.
JavaScript va permettre d’interagir et de contrôler les actions des visiteurs. Cela va du contrôle des saisies au formulaire, aux diaporamas, jusqu’au déplacement d’objets dans une page.
2. Le JavaScript côté serveur et côté client
Depuis quelques années déjà, JavaScript s’est très fortement développé. Mais si le langage reste le même pour tous, il est utilisé par deux types de profils différents.
D’un côté, vous avez le développement d’applications côté serveur, avec des frameworks très...
Les prérequis
Pour suivre au mieux le déroulement de ce livre et comprendre les exemples dispensés, vous devez être à l’aise avec les langages HTML5 et CSS3. Vous le savez, HTML5 gère la structure des pages web et les CSS s’occupent de la mise en forme et de la mise en page.
Les logiciels de développement
Pour développer avec efficacité et rapidité, il vous faudra utiliser un outil de développement, un logiciel pour rédiger, pour coder vos pages web et vos scripts. Vous avez un certain nombre de solutions à votre disposition. Citons ces solutions qui sont multiplateformes :
-
Adobe Brackets : http://brackets.io
-
Sublime Text : https://www.sublimetext.com
-
Microsoft Visual Studio Code : https://code.visualstudio.com
Ces trois outils majeurs possèdent des qualités et des points d’amélioration, ils sont extensibles avec des plugins et personnalisables selon vos habitudes de travail.
Les outils dans les navigateurs
Une fois que votre code JavaScript, HTML et CSS sera rédigé, il faudra tester vos pages web dans votre navigateur. Et il faudra certainement le déboguer pour trouver les erreurs de code. Pour ce faire, tous les navigateurs permettent d’afficher le code source généré et la structure HTML/CSS des pages créées, mais aussi d’afficher la console JavaScript.
-
Avec Apple Safari, il faut aller dans les Préférences, dans la catégorie Avancés et cocher l’option Afficher le menu Développement dans la barre des menus. Vous aurez alors un menu Développement vous donnant accès à tous les outils voulus.
-
Avec Google Chrome, dans le menu Afficher, choisissez Options pour les développeurs. Vous y trouverez tous les outils de développement et de débogage.
-
Avec Mozilla Firefox, dans le menu Outils, Développement web, choisissez Outils de développement.
-
Avec Microsoft Edge, dans le menu Paramètres, etc., choisissez Outils de développement F12.