24 Javascript
Avant de passer à la réalisation de votre portfolio, jetez un coup d'œil rapide à javascript.
En pratique, plus de 99 % des navigateurs actuels peuvent gérer Javascript et l'activer. Néanmoins, il y a des exceptions. Par exemple, les grandes plateformes comme Amazon doivent partir du principe que leur site web sera accessible même sur de très vieux navigateurs et ordinateurs. Comme Amazon veut toujours vendre quelque chose partout, le site doit fonctionner complètement sans Javascript au cas où celui-ci ne serait pas disponible sur le visiteur. En outre, les systèmes informatiques de nombreuses entreprises ne disposent souvent pas de mises à jour pendant des années, car les navigateurs doivent souvent s'intégrer à d'autres systèmes en place.
En principe, c'est donc une bonne chose si un site web fonctionne sans Javascript. Toutefois, cela n'est pas toujours possible ou entraînerait des coûts supplémentaires considérables. Les fournisseurs tels que Google Maps sont strictement opposés à l'abandon de Javascript et ne fournissent simplement rien à l'utilisateur si Javascript est désactivé dans le navigateur.
Les sites web simples, comme votre portfolio, peuvent se passer de langages de script dynamiques. Cependant, dès qu'il y a beaucoup de données et beaucoup d'interaction avec l'utilisateur, le HTML et le CSS statiques ne suffisent plus à eux seuls.
:hand: Tâches
Il existe une grande quantité de principes et de concepts liés au javascript. Ils sont trop nombreux pour les couvrir tous dans ce cours. C'est pourquoi vous n'apprendrez que les plus importants. Vous trouverez ci-dessous les liens appropriés si vous souhaitez apprendre Javascript par vous-même.
:memo: Note
Bien que Java et Javascript partagent de nombreux principes et portent un nom similaire, ils ne sont pas identiques ! Java est principalement utilisé pour Android et les logiciels de bureau. Le JavaScript a été développé beaucoup plus tard pour l'utilisation des navigateurs. On pense que le nom similaire a été créé suite à une décision marketing de la société Mozilla pour capitaliser sur la popularité de Java.
Pour qu'un langage de programmation puisse traiter efficacement les données, il doit savoir quel type de données il doit traiter. Javascript fait la distinction entre les "Primitives" (types de données primitives) et les "Objets" (objets).
Comme dans la plupart des langages de programmation, Javascript comporte de nombreux concepts mathématiques, de l'algèbre et de la logique. Par exemple, vous pouvez attribuer des valeurs (nombres, texte, etc.) à une variable, puis utiliser cette variable dans une équation, ou fixer des conditions pour le calcul.
Les mathématiques en Javascript
Avec Javascript, vous pouvez calculer beaucoup plus. Avec l'objet "Math", vous pouvez calculer un nombre entre un minimum et un maximum. Comme vous l'avez déjà fait dans le CSS pour le "font-size".
Les boucles sont un outil puissant pour résoudre les tâches de programmation répétitives. Supposons que vous ayez une liste de 10 000 entrées. Il serait très lourd et inefficace de traiter toutes les entrées individuellement dans votre code. Vous utiliserez plutôt une boucle qui exécute le code que vous définissez pour chaque entrée de la liste.
Note sur la syntaxe
Toutes les parenthèses []
, ()
, {}
, le point-virgule ;
et aussi la flèche =>
appartiennent à la syntaxe du Javascript. Elle permet de déterminer quelle commande commence ou où elle se termine. Si vous souhaitez apprendre Javascript en détail, vous trouverez ci-dessous des liens vers des tutoriels et de la documentation.
Chaque interaction d'un visiteur sur votre site web déclenche ce que l'on appelle des événements. Vous pouvez réagir à ces événements en Javascript. Par exemple, vous pourriez afficher un message pour chaque "clic" qu'un utilisateur fait quelque part sur votre site.
De nombreux programmes ne font des choses que lorsque certaines conditions sont remplies. Par exemple, vous ne pouvez pas soumettre un formulaire si l'adresse électronique est mal saisie. Ou vous ne pouvez pas vous connecter si le mot de passe que vous avez saisi est erroné. En Javascript, vous pouvez utiliser des conditions pour définir quand le code doit être exécuté.
En combinaison avec les opérateurs de comparaison mentionnés précédemment, vous pouvez l'utiliser pour créer des requêtes complexes et des séquences logiques. Vous pouvez également enchainer plusieurs conditions.
24. Utilisez Javascript
Maintenant que vous avez appris les principes de base du javascript, apprenez à l'utiliser dans votre portfolio.
Même les programmeurs expérimentés n'écrivent pas tout le code eux-mêmes. Ils ont souvent recours à des bibliothèques (code libraries) ou à des snippets (morceaux de code pré-construits). La plupart des bibliothèques, ainsi que les fichiers Javascript individuels, peuvent être intégrés dans un fichier HTML de la même manière qu'un fichier CSS.
Trouver des bibliothèques et des snippets
Voici quelques liens utiles où vous pouvez trouver des codes et des snippets.
Une bibliothèque seule ne fait souvent rien. Vous devez lui dire en javascript ce qu'il faut faire sur votre site web. Bien entendu, cela s'applique également à tout autre javascript qui doit être intégré indépendamment des bibliothèques ou des snippets. Vous pouvez soit écrire du Javascript directement à l'intérieur d'une balise "script" dans votre HTML, soit l'externaliser dans un fichier "js" séparé, que vous intégrerez ensuite comme décrit précédemment.
:memo: Note
L'écriture de javascript "inline", c'est-à-dire directement dans le HTML, n'a de sens que dans très peu de cas. Utilisez un fichier .js
séparé chaque fois que cela est possible.
Apprendre le Javascript
Vous pouvez également trouver d'autres liens et ressources recommandés dans le chapitre Lectures complémentaires à la fin de ce cour.
Relever les défis
Dernière mise à jour