7 ressources indispensables en AJAX

7 ressources indispensables en AJAX

Avis à la population !! Que ceux qui pensent qu’AJAX est un produit de nettoyage ou un club de foot, cet article n’est absolument pas fait pour vous. Mais vous pouvez tout de même rester et découvrir ce qu’est AJAX pour les développeurs.

Avant de vous présenter cette petite liste de ressources, je vais vous faire un petit topo sur AJAX.

Silence au fond, le cours commence :

AJAX (Asynchronous Javascript And XML) est une manière de développer en utilisant plusieurs technologies web, afin de rendre vos applications web plus dynamiques et plus proches d’une ergonomie présente sur des applications bureaux. C’est utiliser pour former des RIA (Rich Internet Application), telles que Flex ou Silverlight par exemple. Mais l’avantage indéniable d’AJAX (enfin de Javascript) est sa légèreté et sa compatibilité avec tous les navigateurs (oui, même IE6).

AJAX est donc composé des technologies suivantes :

  • Le DOM et Javascript, utilisés pour modifier les informations présentés sur la page côté client
  • L’objet XmlHttpRequest, qui permet de dialoguer de manière asynchrone avec le serveur web
  • XML, afin de structurer les informations qui transitent entre le serveur web et la page web. A noter que l’on peut aussi utiliser le format texte ou JSON

Le principe d’AJAX

L’important dans AJAX, c’est le premier A. Asynchrone. Car habituellement, le dialogue entre le serveur web et la page affichée se fait de manière synchrone. L’utilisateur appuie sur un bouton, par exemple, ce qui va appeler le serveur, lequel renverra une réponse au poste client qui va l’afficher. Pendant ce temps, l’internaute va voir sa page se recharger, et attendre le temps que tout soit chargé.

Avec AJAX, un programme, développé en Javascript, va appeler le serveur et récupérer les informations retournée, afin de ne modifier qu’une seule partie de la page. Ainsi, pas besoin de tout recharger, et surtout, une expérience utilisateur plus agréable.

A savoir que de nombreux Frameworks, tel que jQuery, par exemple, proposent des fonctions très simple afin d’utiliser AJAX plus facilement.

Bon, je vous ai assez fait attendre, voici une petite liste de ressources qui vont en diront plus et vous permettront de maitriser AJAX.

Liste des ressources

 

 A Simple AJAX Website with jQuery

 

 

Proposé par Tutorialzine, ce tuto vous apprends la base d’AJAX avec jQuery, PHP et CSS.

Ici, le principe est de créer un menu, qui au lieu de charger les différentes pages avec PHP, le fera en AJAX, de manière asynchrone. Un très bon article pour débuter.

Lien du tutoriel

 

 

 An AJAX based Shopping Card

 

 

Un second tuto proposé par Tutorialzine (oui, ils proposent beaucoup de très bons articles).

Dans ce tuto, vous apprendrez a réaliser une panier pour vos sites d’e-commerce, avec la mise en panier des produits en drag’n'drop, et la mise à jour de votre liste en AJAX. Un article très intéressant.

Lien du tutoriel

 

 

Jquery AJAX Delete

 

 

Pouvoir supprimer des données en temps réel sur un site peut s’avérer très pratique. Et très ergonomique.

Reste plus qu’à l’adapter pour en faire un outil CRUD complet. Ici, vous en apprendrez les bases.

Lien du tutoriel

 

Creating a Dynamic Poll with jQuery and PHP

 

 

Un système de vote dynamique, développé en PHP et jQuery.

Peut s’avérer très pratique à insérer sur vos sites.

 

Lien du tutoriel

 

 AJAX autocomplete

 

 

L’auto-complétion dans une textbox, un classique en AJAX.

 

Lien du tutoriel

 

 

Making Our Own Twitter Timeline

 

 

Créer une timeline style Twitter en AJAX, avec jQuery, ça vous tente ?

Grâce à ce tuto, vous pourrez poster des messages, les valider et les afficher, tout cela en mode asynchrone. Fini les systèmes de commentaires à l’ancienne.

Lien du Tutoriel

 

 

AJAX ZOOM : 360°

 

 

Visualiser une image à 360°, zommer, la déplacer … voici un super article !!

 

Lien du tutoriel

 

Be Sociable, Share!

1








Jeff

About the Author

Jeff est Consultant Maitrise et Développement .NET, avec de solides connaissances en Javascript (jQuery, Angular) et HTML5.