Sans library

• Convertir un nombre en lettres ( règles belges )
• Créer une communication structurée belge
• Afficher / Cacher une zone de texte
• Faire une rotation (d'une image)
• Si le fichier est en ligne : AJAX
  • Mettre à jour qu'une partie de la page web
  • Envoyer une information à un autre site web
    • Compteur JS-PHP-TXT (statistiques mensuelles relatives à un site indépendant)
    • Compteur JS-PHP-MySQL (pour plusieurs sites)
  • de connaître l'adresse IP du visiteur

Plus d'info sur AJAX (en anglais)

Et, après l'ajout d'une bibliothèque ad hoc :

Avec library

Une bibliothèque, souvent désignée par son terme anglais "framework", permet souvent de créer des objets, d'utiliser leurs méthodes et propriétés; ou contient des fonctions supplémentaires (aux fonctions natives de JavaScript). Souvent, cette bibliothèque est un simple fichier .js qui peut être ajouté à ses propres fichiers .js. Rappel : Un fichier HTML peut appeler plusieurs fichiers .js. Utiliser une bibliothèque est donc très simple.
Il faut (normalement) être connecté à internet pour les utiliser (depuis le cache du navigateur)

• w3.JS : Cette bibliothèque permet d'ajouter facilement des données contenues dans un data-objet, au format JSON, dans une page web, via des {{ }}. Elle est donc une alternative light (13 ko) à AngularJS. Exemples :

  • Filtrer les lignes et trier les colonnes
  • Filtrer, trier et totaliser

• chart.js : Cette bibliothèque permet d'ajouter très facilement des graphiques.

• three.js (très compliqué) : Cette bibliothèque permet d'ajouter la 3D à une page web.

• AngularJS : Cette bibliothèque permet de créer plus facilement des applications sur une seule page web. Les données récupérées sont affichées au visiteur indépendamment du serveur (sans lancer une nouvelle requête). Ce qui rend l'affichage plus rapide (et soulage les serveurs et les autoroutes de l'information).
  • Filtrer les lignes et trier les colonnes
  • Filtrer, trier et totaliser
  • Résumé d'AngularJS
• React JS (compliqué) : wikipedia
• JQuery (obsolète) : Cette bibliothèque, principalement dédiée au design permet un contrôle facile et total de la page. Un peu désuète depuis l'apparition de w3.css et w3.js, elle demeure souvent utilisée sur une page visuellement sophistiquée :
  • de créer des effets visuels
• Vue JS (très compliqué) : wikipédia
• Google maps : carte d'un lieu
• Google charts (obsolète):
  • Graphique avec secteurs
  • Graphique avec ligne(s) courbé(s)

Avec un peu de JavaScript, via AJAX, JSON, Google Charts, PHP et une base de données, il est possible de mettre à jour les graphiques de sa page web représentant des cours de bourse, en temps réel ! Comme ici.

Plus ludique : un mécanisme d'horloge et des jeux (créés en JavaScript !).

Si vous souhaitez créer des pages web professionnelles, je vous recommande, dans l'ordre, les courtes études suivantes (en anglais) :

1. AJAX (requiert un serveur web, donc après le mini-cours en PHP)
2. Google maps
3. Librairies obsolètes :
   • JQuery (obsolète) : w3schools, OpenClassRooms (fr)
   • Google Chart (obsolète)
   • AngularJS (obsolète): w3schools