3ème Soirée ParisJS Meetup

J’étais hier soir chez Zenexity pour participer à la troisième rencontre ParisJS. Organisé par la communauté Javascript, nous étions une cinquantaine de participant. La soirée était organisée avec quelques présentations, des démonstrations et un buffet. Petite compte-rendu…

Petit message à nos amis de la communauté Java

L’ensemble des développeurs présents est fortement axé Web. Cela m’a donné l’occasion de jouer un peu le javaiste de base et de débattre sur notre place dans la communauté des développeurs. Croyez-moi, c’est pas très brillant. Le bonhomme qui fait du Java a l’image un peu arrogant du consultant qui vient avec toute sa pile de solution et qui fait des « applications sérieuses ».

Vous avez envie de faire du Web ? Ne prenez pas Apache et mod_php. Prenez mon Tomcat-Spring-Hibernate-GWT tout complet. Bon en fait vous n’avez que 5 tables ? Oui mais moi je ne fais que de l’ORM, le JDBC c’est sale. Quoi vous avez 3 actions ? Ah mais moi je fais des beans Spring avec du Spring MVC…

Bon je force le trait, mais vous avez compris le message. Lâchez-vous dans la zone commentaire ci-dessous, c’est fait pour.

Présentation de Backbone.js

La première présentation était sur Backbone.js par Tony Sokhon. C’est un framework type MVC léger qui permet de programmer du côté navigateur des actions, un controleur et la gestion de vues plus simplement qu’avec jQuery. Encore jeune, l’idée est d’apporter une architecture orientée requête afin d’éviter de devoir tout gérer via jQuery. Après avoir déclaré les classes de votre modèle, vous pouvez ensuite déclarer des actions et des états à afficher. Il faut avoir déjà un bon niveau en jQuery, mais c’est intéressant.

With Backbone, you represent your data as Models, which can be created, validated, destroyed, and saved to the server. Whenever a UI action causes an attribute of a model to change, the model triggers a « change » event; all the Views that display the model’s data are notified of the event, causing them to re-render. You don’t have to write the glue code that looks into the DOM to find an element with a specific id, and update the HTML manually — when the model changes, the views simply update themselves.

Les cas d’applications : des applications clientes riches, des applications pour mobile et des applications en mode déconnecté. Le framework gère aussi le localStorage, ce qui permet de construire des applications déconnectées d’entreprise.

Raphael.js

La deuxième présentation par Stéphane Akkaoui était sur Raphael.JS, une librairie Javascript pour dessiner en SVG ou WML dans le navigateur. Allez voir quelques exemples, c’est intéressant. Cet exemple de Chart devrait vous convaincre je pense.

Stéphane nous a montré quelques exemples très bien faits pour coder en javascript la création de dessins vectoriels. Le moteur est une abstraction qui utilise SVG pour l’ensemble des navigateurs, sauf IE6 qui utilise le format WML de Microsoft. Il permet sans plugin de dessiner du vectoriel dans le navigateur. Lorsque vous n’avez pas de player Flash comme sur iPhone, cette solution permet de dessiner simplement.

Démo de la Kinect avec une interface Javascript

Cette démo était vraiment bluffante. Imaginez la Kinect, le présentateur qui bouge ses mains à la Minority Report, et votre navigateur Chrome qui navigue selon les mouvements de votre main… Ce n’est pas de la science-fiction, vous pouvez le faire avec un budget de 150 EUR.

La Kinect se branche sur port USB. Développé par une boîte en Israël, il existe 2 API open-source en C qui permettent de récupérer les mouvements de l’utilsiateur devant la caméra de la Kinect. Adafruit avait lancé une récompense de 2000$ pour le premier capable de coder des drivers open-source pour ce périphérique. A peine 6 jours plus tard, le site annonce avoir un gagnant avec le projet OpenKinect. Pour les heureux propriétaires de ce device, il existe un portage Java qui utilise JNI sur le site.

La démo était intéressante avec une présentation de l’interface Web de TEDx piloté avec les mains. Sylvain Zimmer, qui travaille chez Joshfire, recherche d’ailleurs de bons développeurs. Si vous avez HTML5, Internet des objets, Node.JS et Javascript dans votre parcours, contactez-les sur leur site. Il y a entre autre Rafi Haladjian au board de l’équipe dirigeante.

Débat sur Javascript côté serveur

Nous avons ensuite lancé le débat sur la place de Javascript aujourd’hui dans l’environnement Web. Du côté du navigateur, il a une place bien établie. L’interaction avec les périphériques matériels (micro, caméra) arrive à vitesse grand V.

Il y a de plus en plus de frameworks simples du côté navigateur qui font oublier la programmation Javascript à Papa. Si vous ne connaissez pas jQuery et que votre produit utilise un navigateur Web, vous avez raté votre vie. Franchement. Et venez pas me dire que c’est un boulot de web-designer, ou que le javascript c’est sale. Venez voir ce qu’il se fait, on est en 2011 les gars. Et dans votre poche, sur votre iPhone ou votre Android, il y a du Javascript qui tourne dans votre navigateur mobile… alors arrêtons de penser « java-iste » et bougons-nous les fesses pour apprendre un peu ces technologies.

Ensuite on parle du côté serveur. Et là, même si Node.js est très sympa et super performant… j’y crois pas trop. Prenez Play! Framework, avec une stack légère comme JBoss Netty et vous aurez 10 fois mieux. Non, node.js ne me fait pas rêver. Mais je peux changer d’avis et je veux bien être convaincu.

Javascript du côté serveur, c’est vieux. En fait en 97 lorsque j’ai commencé à travailler, je bossais avec Netscape Livewire. Le code à executer du côté serveur était à placer entre une balise SERVER. Voici par exemple comment il était possible dans une page HTML d’afficher un HelloWorld:

<HTML>
<HEAD>
<TITLE> Hello World </TITLE>
</HEAD>
<BODY>
<H1> Hello World </H1>
<P>Your IP address is <SERVER>write(request.ip)</SERVER>
<SERVER>
write("<P>Last time you were " + client.oldname + ".")
</SERVER>
<P>This time you are <SERVER>write(request.newname)</SERVER>
<SERVER>client.oldname = request.newname // Remember name for next time.
</SERVER>
<FORM METHOD="post" ACTION="hello.html">
<INPUT TYPE="text" NAME="newname" SIZE="20">
<SERVER>
if (client.number == null)  // Initialize number of accesses by this 
client
	client.number = 0
else
	client.number = parseInt(client.number) + 1
	
project.lock() // Initialize or increment total number of accesses.
if(project.number == null)
	project.number = 0
else
	project.number = parseInt(project.number)++
project.unlock()
	
</SERVER>

<P>You have been here <SERVER>write(client.number)</SERVER> times.
<BR/>This page has been accessed <SERVER>write(project.number)</SERVER> times.
	
</BODY>

On a un peu trollé, mais le fond du débat était intéressant. Comment JavaScript, avec son approche fonctionnel, peut contribuer du côté serveur à ce que manipule finalement l’utilisateur ? Du côté client, c’est déjà un langage qui tourne dans une virtual machine, qui permet à un navigateur d’exécuter du code. Cela revient au pattern du client lourd, avec cependant une énorme différence d’architecture. Bref à mon avis, vous me lancez sur le sujet et je vous ponds 3 pages avec une marge rouge, 4 carreaux à gauche. On en reparlera.

WebGL, le standard OpenGL pour le Web

Dernier débat de la soirée, avec une présentation de WebGL. C’est une interface qui utilise le composant Canvas d’HTML5 (quoi vous ne connaissez pas Canvas ?) et qui offre un support d’OpenGL ES 2.0.
Comme une bonne démo vaut tous les discours du monde, allez donc voir Google Body avec un navigateur assez récent. Sympa non ?

Conclusion

Soirée bien sympa, avec des rencontres et de belles discussions. Et pour un gars du Web comme moi, c’était intéressant. Je termine par un peu de publicité.

• Le 11/12/13 février aura lieu la HTML5 Game Jam Paris. Rien qu’un week-end pour programmer en HTML5 des jeux.
• Suivez les prochains événements ParisJS sur http://parisjs.org/. En principe c’est le dernier mercredi du mois. La prochaine soirée aura lieu à la Cantine fin février.

Articles similaires:

3eme anniversaire du Paris JUG Retour sur la soirée JSF 2.0 et Servlet 3.0 Comment configurer l'encoding en UTF-8 dans JBoss Soirée Domain Driven Design avec Greg Young à la Cantine le 3 mars