Retour sur le Mix-IT 2012 avec Play2, Backbone, HTML5, CSS3 et JavaScript

Lors du Mix-IT 2012, presque tout Zenika Lyon était présent pour suivre les différentes conférences. Nous nous sommes dispatchés dans les différentes sessions ce qui nous permet aujourd’hui de proposer un retour collégial de quatre conférences que nous avons retenues sur Play 2, Backbone, HTML5, CSS3 et JavaScript.

Play! 2 (par Matthieu Lux)

Une des premières sessions de la journée était l’occasion de découvrir le framework Play ! et sa nouvelle version 2.0. Aux commandes nous avions Julien Richard-Foy (@julienrf), développeur chez Zenexity, l’entreprise à l’origine de ce framework.
La session était complète avec la présentation des concepts et des motivations du framework, un peu de livecoding, la présentation de fonctionnalités différentiantes et quelques sujets plus techniques. Un bon tour d’horizon mais qui était du coup un peu rapide.
Play ! est un framework Web Java et Scala qui a, j’ai envie d’utiliser le mot « culot », de ne pas seulement être un framework mais aussi un serveur indépendant se passant donc de la brique serveur d’application, des Servlets et de son écosystème.
Son idée directrice est de faire du Web sans le cacher et de le faire bien. Vous accédez rapidement au protocole HTTP, vous manipulez des templates HTML, vous contrôlez les URLs. La mise à jour du code se recharge à la volée et en cas d’erreur une page très aboutie est affichée (sauf en mode prod évidemment).
Play ! peut néanmoins dérouter certains d’entre nous : Play ! fait partie de l’écosystème Scala, avec un système de build Scala des templates HTML en Scala. Bref, pour celui qui manipule du JEE avec Maven toute la journée, il faut un temps d’adaptation…
A la remarque “c’est pour les rigolos ce framework sans serveur d’application, ça ne doit pas tenir la charge” (que je partageais un peu comme a priori), la réponse a été très intéressante. L’architecture est complètement stateless et Play ! utilise la possibilité (méconnue ?) du Java à gérer les I/O de façon asynchrone. Bref, nous n’avons pas vu les chiffres, mais sur le papier, tout est réuni pour que le système soit tout à fait capable d’être extrêmement réactif.
Pas de slides disponibles pour le moment, mais en attendant, le site du framework : http://www.playframework.org/

JavaScript Overview (par Gérald Quintana)

JavaScript, ce langage autrefois incompris et haï, est aujourd’hui devenu fréquentable. Il est même en passe de devenir la star des soirées HTML5. Axel Rauschmayer (@rauschma) nous a permis de redécouvrir ce langage et de repartir sur de bonnes bases avec lui.
La présentation a repris les principaux concepts du langage (héritage par prototypes, programmation fonctionnelle) depuis le début. En apprenant les bonnes pratiques (toujours utiliser le === pour comparer, limiter la portée des variables avec le design pattern « immediately invoked function expression »), et en connaissant les pièges (hoisting, valeur du this), c’est un outil intéressant. Son succès grandissant et son ubiquité (serveur Node JS et bureau Windows 8 ou Qt Quick) en sont la preuve.
Les slides sont disponibles ici : http://dl.2ality.com/dl/2012/04/mixit_slides.pdf

Web App Development with Backbone (par Anca-Delia Tirdea)

Pendant cette présentation, Bodil Stokke (@bodiltv) nous a fait entrer directement dans le vif du sujet Backbone : Pas de transparents, juste un éditeur de code et le nom d’une application qu’elle va développer sous nos yeux en utilisant Backbone : un client twitter pour voir en temps réel les tweets, écrire des tweets, les trier.
Backbone est un excellent outil pour l’architecture des applications front-end. Il apporte des éléments de frameworks MVC traditionnels, tout en permettant une grande liberté lors de l’écriture de la logique front-end de l’application.
Point important que j’ai retenu de cette session Backbone : Même s’il présente une courbe d’apprentissage assez raide et si la syntaxe reste verbeuse, Backbone délimite très bien le code et encourage la modularisation. De plus, sa structure et ses conventions nous permettent d’obtenir un code facilement maintenable. En conclusion, cette présentation était assez impressionnante !
Les sources du live coding sont disponibles ici : https://github.com/bodil/hellobackbone

Animez vos pages HTML5 avec CSS3 (par Florent Leprêtre)

Martin Görner (@martingorner) démarre sa présentation sur de beaux slides qui (surprise ?) ont été entièrement faits avec les technologies qu’il va nous présenter. La présentation s’attardera tout d’abord sur CSS3. L’accent est mis sur le fait qu’il s’agit bien de code déclaratif pour faire des animations 2D, 3D. La présentation fera le tour d’une bonne partie des nouvelles fonctionnalités : transformation 2D, 3D, ombres portées, transparence, reflets, mais aussi animations, transitions, paramétrage des courbes d’accélération des transitions … Bref, le tout est très impressionnant, très fluide et surtout impressionnant de simplicité ! Et histoire de faire plaisir à tout le monde, on a le droit à une petite démonstration d’un slide 3D sur un téléphone android qui affiche l’animation aux alentours des 30 ips.
La deuxième partie de la présentation est tournée vers SVG qui permet, quant à lui, l’ajout de dessin vectoriel dans vos pages HTML 5 avec tout autant de simplicité. Oui, car même en HTML 5 CSS3, on ne peut toujours faire que des boites carrées aux bords arrondis xD. La présentation fait un petit tour des fonctionnalités : courbes de Bézier, transformations, animations … Toujours aussi bluffant. Sachez qu’il est aussi possible de combiner CSS3 et SVG s’il vous vient l’envie de faire des transformations 3D sur vos dessins vectoriels.
Pour conclure, disons que CSS3 et SVG permettent très clairement de donner vie à vos pages web en toute simplicité. En espérant que CSS3 soit ratifié assez vite.
Les « slides » sont disponibles ici : http://animateyourhtml5.appspot.com/pres/

Conclusion

Une sélection très « Weby » pour les présentations que nous avons retenues. Nous attribuerons cela à l’engouement actuel pour toutes les nouvelles possibilités que nous offrent l’HTML 5.
Enfin, il n’est pas possible de finir cet article sans un mot de remerciement aux organisateurs du Mix-IT pour nous avoir proposé des présentations de cette qualité. Nous attendons déjà avec impatience l’année prochaine pour un nouveau Mix-IT. 2013 à Lyon !