Mes premiers pas avec Ember.js et ember-rails

  • par julien

Je me sens de plus en plus à l'étroit avec des applications web dont le côté client est uniquement basé sur des vues Rails. J'ai dernièrement décidé de regarder d'un peu les frameworks javascripts client-side sur le marché.

Backbone.js est certainement celui dont on entend le plus parler (je ne compte plus les liens sur backbone.js dans la Javascript Weekly!). Pourtant, après avoir lu les pages de présentation et en avoir discuté un peu avec certains développeurs à #rulu, je n'arrivais pas à me convaincre que ce framework allait me rendre heureux !

Suivant en général d'assez près les tribulations de notre amis Yehuda Katz, j'avais dans un coin de ma tête un certain Ember.js. Je n'apprendrai à personne que ce cher Yehuda est un des principaux contributeurs de beaucoup de projets open source que nous utilisons tous les jours, Rails 3 en particulier. Je pars donc en général avec un apriori très positif sur les projets qu'il porte! J'ai donc décidé d'aller regarder d'un peu plus près Ember.js pour voir si je trouvais ce framework plus attrayant que Backbone.js.

Pour faire la long story short, oui, j'ai tout de suite été séduit par Ember.js. Ne restait plus alors qu'à écrire mes premières lignes de code avec ... Et là, les choses se compliquent un peu. La version 1.0 n'est pas encore sortie, les modifications des APIs sont fréquentes et fortes, et la doc en est au stade embryonnaire ... Il devient donc un peu compliqué de trouver des refs Google cohérentes et d'arriver à retrouver ses petits.

Fin Juin 2012 cependant, Kasper Tidemann publiait un article, le code source, et une demo live d'un exemple relativement simple d'utilisation d'une des dernières APIs d'Ember. Ce code est basé sur un simple fichier index.html et un fichier app.js généré grâce à un autre fichier app.coffee.

Je me suis donc donné pour exercice de refactorer cet exemple dans une application rails 3. L'un des objectifs était aussi d'utiliser la gem ember-rails et sa compilation automatique des templates JS via l'asset pipeline et son arborescence dans app/assets/js.

Le résultat se trouve sur ce répo github. Les différentes étapes que j'ai suivies pour arriver à ce résultat sont assez détaillées si vous regardez le nom des branches mergées sur master.

En théorie, un simple clone du répo et `rails server` devrait être identique à la live démo. Le but n'était certainement pas d'ajouter des fonctionnalités, mais plutôt de transformer le démo de Kasper étape par étape pour bien décortiquer et comprendre un peu mieux le fonctionnement d'Ember.js.

Je vais continuer de suivre Ember.js et tenterai certainement de l'utiliser dans une de mes prochaines applis dès que la version 1.0 sera sortie. (La 1.0.pre datant d'ailleurs du 3 Août).