Les fondamentaux d’AJAX par la pratique

« Que peut faire un débutant ? » ou « Comment aborder AJAX pour une personne qui débute ? » : voilà bien une question récurrente. La réponse est complexe, car AJAX n'est pas une technologie en soi, mais plutôt un ensemble de technologies regroupant le HTML, les CSS, le JavaScript, le DOM, un objet de requête client serveur, la programmation côté serveur, des langages structurés comme XML, XSLT, ou Jason... Bref, il est bien difficile de pouvoir cerner les points forts ou les lacunes de ce « débutant virtuel » afin de mieux répondre à ses attentes.

En outre, AJAX ne se résume pas un ensemble de technologies. C'est aussi une manière de concevoir des applications, une manière d'aborder le développement qui implique des compétences en architecture d'information, en structuration, voire en sémantique, en accessibilité, en ergonomie, et la liste pourrait encore s'allonger... Là encore, il est difficile de pouvoir cerner les points forts et les lacunes de ce débutant de plus en plus virtuel et de répondre correctement à ses attentes.

La solution consistant à aborder AJAX par la pratique, en s'appuyant sur le développement d'une mini-application, semble pouvoir apporter un début de réponse à l’ensemble des débutants. Chacun pourra y consolider ses points forts et combler ou pallier ses lacunes sur d'autres points.
Nous sommes convaincus que ce choix est le bon et que vous trouverez suffisamment de matériaux dans cette formation vidéo pour vous permettre d’aborder tranquillement AJAX.

Vue d’ensemble de la formation :

Introduction et présentation

Qu'est-ce qu'AJAX ? Est-ce une nouveauté ou un effet de mode ? Est-ce une technologie ou une philosophie de travail ? Quels sont les logiciels nécessaires pour utiliser AJAX ? Est-il facile de développer une application AJAX ? Voilà autant de questions que ce chapitre va aborder.

Environnement de travail

Voilà, la présentation d'AJAX devrait être acquise. Il ne nous reste plus qu'à configurer un environnement de travail complet qui va nous permettre d'aller plus loin dans l'exploration d'AJAX.

Structure HTML et Affichage CSS

Base de toute application en ligne : la page web. Nous allons au cours de ce chapitre dresser la structure élémentaire de notre page et la faire évoluer en fonction des besoins, tout au long de ces étapes.

DOM et JavaScript

Cette étape approche l'aspect dynamique de la structure de la page. Deux éléments fondamentaux vont y être abordés : JavaScript et DOM. Leur utilisation commune est appelée le DOM Scripting.

XMLHttpRequest - XML

Le coeur d'AJAX repose sur la possibilité d'utiliser le protocole HTTP sans avoir à recharger la page. Nous allons au cours de ce chapitre décortiquer et mettre en place les mécaniques qui nous permettent d'utiliser l'objet XMLHttpRequest.

XMLHttpRequest - Jason

Nous allons aborder au cours de cette étape une autre manière de formater les données renvoyées par le serveur: Jason, pour JavaScript Object Notation. Nous l'utiliserons pour récupérer les informations propres à chaque diapositive.

Préparation côté Serveur

Dans ce chapitre, nous allons apporter la dimension dynamique à notre application. Nous allons connecter la page HTML à une base de données dans laquelle elle pourra aller puiser les informations à afficher.

Sélection Galerie

La connexion au système d'information est établie. Nous allons au cours de ce chapitre utiliser PHP pour générer du XML afin d'afficher les galeries, puis du Jason pour afficher les informations propres à chaque diapositive.

Mode éditable des informations

Autre particularité d'AJAX : la modification de la page en cours de lecture, et cela sans avoir à recharger celle-ci à aucun moment. Nous allons au cours de ce chapitre mettre en place cette fonctionnalité nous permettant de modifier les informations d'une fiche de diapositives.

Autocomplete

On ne pouvait pas aborder AJAX sans aborder la fameuse fonctionnalité d'Autocomplete. Nous allons donc au cours de ce chapitre l'implémenter à notre application.

Enrichissements

Jusqu'à présent, nous avons exploré les fonctionnalités dynamiques d'un point de vue base de données. Nous allons maintenant aborder un aspect plus dynamique d'un point de vue visuel. Nous allons utiliser des images animées, des animations de transition et des animations utilisateur.

Conclusion

On pourrait encore s'étendre sur AJAX et creuser plus en détail chacune des fonctionnalités abordées durant cette formation. Cela fera peut être l'objet d'un volume II…

ATTENTION : L'application développée au cours de cette formation n'est pas exempte de bogues ou de dysfonctionnements. Son développement a été réduit au minimum afin d'aborder divers aspects des technologies utilisées sans pour cela surcharger le contenu des modules d'apprentissage. Il est vrai que cette introduction peut être complétée par des modules plus verticaux propres à chaque technologie, comme PHP, JavaScript ou CSS. Quoi qu'il en soit, si un bogue gênait votre progression ou votre compréhension du module, n'hésitez surtout pas à nous contacter, nous nous ferons un plaisir de voir avec vous ce problème.