Lors du dernier atelier du lundi, j'ai présenté le framework javascript sammy.
Voici les slides: http://francois.heroku.com/
Ce framework est basé sur jQuery et est fortement inspiré de Sinatra.
Il permet de créer des applications web avec une gestion de l'historique, des évènements personnalisé, des plugins, etc.
Voici une mini application :
-
$.sammy(function() {
-
this.get('#/hi', function(ev) {
-
$('#main').text('Hello World!');
-
});
-
this.post('#/hi', function(ev) {
-
$('#main').text(ev.params['myinput']);
-
return false; // l'évènement submit est annulé
-
});
-
}).run();
Décortiquons le code de cette application.
On commence par définir une route:
-
this.get('#/hi', function(ev) {
-
$('#main').text('Hello World!');
-
});
-
-
<a href="#/hi">Hi !</a>
Le click sur le lien va déclencher le callback sur la route get('#/hi') et afficher un message.
Plus intéressant est la gestion des verbes POST (mais aussi PUT et DELETE). La simplicité est de mise. On crée un formulaire HTML et la route correspondante. L'évènement submit est automatiquement capturé par sammy.
-
this.post('#/hi', function(ev) {
-
$('#main').text(ev.params['myinput']);
-
return false; // l'évènement submit est annulé
-
});
-
-
<form action="#/hi" method="post">
-
<input type="text" name="myinput" />
-
<input type="submit" value="Submit" />
-
</form>
Vous n'aurez pas ainsi a chercher l'ensemble des champs de formulaire, Sammy le fait pour vous. Je conseille l'utilisation du plugin NestedParams pour les champs de formulaire avec des tableaux.
Sammy intègre un systèmes de plugins qui permettent de réutiliser du code. Plusieurs plugins sont intégré comme des systèmes de template, de stockage des données (avec localStorage ou sessionStorage d'HTML 5, ou un fallback avec les cookies ou un simple stockage mémoire), JSON ou encore ... le vôtre.
Sammy est un bon framework pour écrire une application web. Essayez-le !
