Introduction :

• Qu’est-ce qu’une page Web ?
• Brève histoire et évolution de JavaScript
• ECMAScript et JavaScript
• Que fait JavaScript concrètement ?

Premiers pas :

• Présentation des outils : Sublime Text, le navigateur
• Console et outils de débogage
• Insertion de JavaScript dans des pages
• Notions de variables et de données

Les types et operateurs : 

• Les nombres (type Number)
• Opérateurs numériques : + * / %
• Autres opérateurs : ++ -+=…
• Math : la “calculette” du développeur
• Les chaînes (type String) et la concaténation
• Fonctions liées aux chaînes
• Les booléens (type Boolean)

Les conditions :

• Structure conditionnelle : if, else, else if
• Écriture des tests : opérateurs de comparaison
• Exemple avec une page login

La notion d’objet :

• Comment définir un objet ?
• Propriétés, méthodes et événements

Les événements liés à l’utilisateur :

• MouseEvent : click, mouseover, mouseout, mousemove…
• KeyboardEvent

Le DOM : modifier la page avec JavaScript :

• L’arbre DOM, les noeuds, les parents, les enfants
• Accéder aux éléments de la page
• Accès aux attributs, aux styles et aux classes
• Création, modification et suppression d’éléments DOM
• Quelques mots sur jQuery

Les fonctions :

• Déclaration et appel d’une fonction
• Paramètres des fonctions
• Usage et exemples de fonctions utilitaires courantes

Les boucles :

• La boucle for, variable d’incrémentation
• La boucle while
• Création d’un menu dynamique avec une boucle

Les tableaux : Array

• La notion d’index
• Array et boucles
• Manipuler un Array : exemple d’un panier de courses

Les dates :

• Gestion du temps avec les dates
• Création d'une horloge digitale

Exercices Evénements et données :

• Organisation des événements. Impact des événements sur les types de navigateurs et versions de DOM
• Positionner des écouteurs sur des événements par programme et paramétrage de balises HTML
• Règles pour faire un codage multinavigateur
• Créer, détruire des écouteurs
• Les traitements événementiels JavaScript : gestionnaire clavier, souris, formulaires, rollover, menus dynamiques
• L'objet Event et son utilisation
• Les objets du DOM (window, document...) et leur manipulation
• Manipulation des URL (redirections http ...).
• Gestion des cookies (lecture et écriture)
• Programmation d'événements multiples sur les éléments formulaire, souris, clavier...

 
Exercice Gestion de formulaires HTML :

• Manipulation de contenu de formulaires
• Accès et modification dynamique des composants du formulaire : zone de saisie, cases à cocher, cases d'options...
• Fonctions de validation de formulaire
• Evénements liés aux éléments de formulaire : changement, initialisation, clic... 
• Conception de fonctions personnalisées contrôlant les activités de l'utilisateur

 
Exercice Javascript et CSS : 

• Rappel sur les feuilles de style en cascade (CSS-1, CSS-2)
• Les outils pour les manipuler
• Implémentation des CSS en tant que propriétés des objets du DOM
• Modification directe des propriétés CSS des objets du DOM
• Modification de l'objet CSS stylesheets
• Rendre la page dynamique via le changement des propriétés de style
• Réalisation de pages simples afin de se familiariser à l'utilisation de feuilles de style et à leur manipulation à travers JavaScript

Exercice Javascript DOM XML :

• Présentation du langage XML (éléments attributs)
• Implémentation des parseurs XML chez Microsoft IE et les autres : variantes entre les navigateurs, maintenance...
• Manipulation des objets du DOM (lecture, ajout, suppression, modification de noeuds)
• Familiarisation à la construction d'un chemin d'accès à un élément du DOM

Exercice AJAX : 

• Enjeux, solutions et alternatives
• Les bibliothèques du marché
• HTTP et Ajax : échanges HTTP et l'objet XMLHttpRequest
• Récupération de données XML et affichage des données. Interrogation d'une base de données. Création d'un formulaire de connexion

Autres sujets avancés :

• Créer un menu en HTML / CSS
• Graphisme avancé : canvas, SVG
• Responsive design pour les mobiles
• Convertir et insérer des sons, musiques
• Convertir et Insérer des videos
• Couleurs et dégradés de couleurs
• Polices de caractères hébergées
• frames, iframes, pseudo frames en CSS
• Champs formulairés spéciaux : Date, Time, Email, URL ; number, min, max, step, range ; Required, Focus
• Controle avec RegExp
• header / footer
• Datalist et Ajax
• GPS
• Webcam API
• Boutons avancés avec CSS3
• Flash et alternatives
• CSS transition, CSS animation, SVG, Canvas
• HTML5 cache
• Javascript et Jquery : cours et exercices
• Google Map, KML
• Emailing, newsletter, HTML et CSS adaptés ; plateformes hébergées comme mailchimp, phplist, wordpress, drupal et proappli.com
• introduction aux services Web REST
• Balises sémantiques avancées
• Securité : SSL, .htaccess, hacking etc ...
• Paiment par internet, Paypal etc ...
• Considérations techniques et de contenu à prendre en compte pour optimiser le référencement (SEO)
• Exercices pratiques avec un hebérgement ou sur plateforme proappli.com