RestFul Evented Javascript                   avec sammyjs et jqueryFabien Baligand                          Copyright©Sfei...
Constat Les applications RIA / SPA ont quelques inconvénients :    Pas d’historique de navigation    Bouton “Rafraichir” q...
Solution : RestFul Evented Javascript Utiliser la partie hash de l’URL pour stocker l’état actuel de l’application, donc l...
Solution : RestFul Evented Javascript1. Pour chaque vue, définir une URI REST associée   Exemple: /products/{productId}2. ...
Solution : RestFul Evented Javascript Avantages :    Les changements de hash dans l’URL sont historisés    => vous pouvez ...
Et sammyjs dans tout ça ? Librairie JavaScript Basée sur jQuery Permet d’écrire facilement et élégamment du code RestFul E...
Exemple de code sammyjs$.sammy("#main", function() { this.get("#/products", function() {   this.partial("/products.jsp"); ...
DEMO
Prochain SlideShare
Chargement dans…5
×

RestFul Evented Javascript avec sammyjs et jquery

1 425 vues

Publié le

Publié dans : Technologie
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
1 425
Sur SlideShare
0
Issues des intégrations
0
Intégrations
7
Actions
Partages
0
Téléchargements
5
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

RestFul Evented Javascript avec sammyjs et jquery

  1. 1. RestFul Evented Javascript avec sammyjs et jqueryFabien Baligand Copyright©Sfeir (D.GEN.375.V1)
  2. 2. Constat Les applications RIA / SPA ont quelques inconvénients : Pas d’historique de navigation Bouton “Rafraichir” qui revient à la vue d’accueil Vues non bookmarkables
  3. 3. Solution : RestFul Evented Javascript Utiliser la partie hash de l’URL pour stocker l’état actuel de l’application, donc la vue en cours. Le changement de hash de l’URL pilote le changement de vue.
  4. 4. Solution : RestFul Evented Javascript1. Pour chaque vue, définir une URI REST associée Exemple: /products/{productId}2. Chaque fois que l’utilisateur clique sur un bouton, un lien ou un onglet, mettre à jour le hash de l’adresse courante, avec l’URI REST de la vue cible. Exemple: #/products/{productId}3. Ecouter en javascript l’évènement “hashchange”, et traiter chaque URI REST appelée. Exemple: #/products/{productId} => Affichage du produit {productId}
  5. 5. Solution : RestFul Evented Javascript Avantages : Les changements de hash dans l’URL sont historisés => vous pouvez utiliser les boutons Précédent/Suivant du navigateur Si vous appuyez sur “Rafraichir”, le hash de l’URL est interprété, et vous tombez bien sur la même vue. Vous pouvez enregistrer en favori l’URL courante, et l’ouvrir plus tard, vous tombez bien sur la même vue.
  6. 6. Et sammyjs dans tout ça ? Librairie JavaScript Basée sur jQuery Permet d’écrire facilement et élégamment du code RestFul Evented Javascript http://sammyjs.org
  7. 7. Exemple de code sammyjs$.sammy("#main", function() { this.get("#/products", function() { this.partial("/products.jsp"); }); this.get("#/products/:productId", function() { this.partial("/product.jsp?productId=" + this.params["productId"]); });}).run("#/products");
  8. 8. DEMO

×