Tout ce baratin pour vous dire que :
- Je suis angoissé (un peu) des 11h de vol. Loin d’être la première fois que je prends l’avion mais première fois que je quitte le continent et que je vais aussi loin ;
- Super content parce que j’ai toujours rêvé de faire ce genre de choses et que jusque là tout se présente bien ;
- Je vais essayer de publier quotidiennement sur ce blog sur ce voyage, sur les conférences surtout et sur Montréal aussi.

D’avance, je remercie toute l’équipe de l’organisation de la ConFoo parce qu’ils ont déjà fait un super job et qu’ils ont une grosse semaine qui arrive. Mes collègues aussi, qui m’ont fait répéter mes sujets. Et Air Canada de me prévoir un parachute, un bateau de secours et des rations de survie. Veux pas mourir! :p

A très bientôt! J’aurais pas grand chose à priori à raconter sur mon escale à Toronto mais, ce soir, des amis expatriés m’attendent déjà à Montréal pour la Nuit Blanche. Ça va faire mal, je vous raconterai

Le principe est assez simple : un script que vous mettez en favori. Quand vous êtes sur une page dont vous voulez connaître les fonctions de rappels sur évènements qui ont pu y être mis en place et sur quel évènement réponde chacune d’elle, vous cliquez sur ce favori. Et paf, ça fait un état des lieux !

Pratique, non ?

Je vous laisse récupérer ça sur le site officiel, vous verrez, c’est vraiment très pratique et simpliste d’utilisation.

Seul bémol : je crois bien que ça ne gère pas les évènements qui sont rattachés dans une fermeture. Un peu gênant pour les gens comme moi qui développent beaucoup avec jQuery mais bon, je ne fais pas que de ça et ça aide quand même dans ces quelques cas là.

Si vous avez d’autres solutions dans ce genre, je suis preneur !

Bonjour Anne-Gaelle, tout d’abord, merci encore une fois d’avoir bien voulu répondre à ces quelques questions. Est ce que tu peux te présenter brièvement?

Je m’appelle Anne-Gaelle Colom, je suis Française et prof à l’Université de Westminster. Je suis aussi “Course leader” pour le BENg/MEng Mobile and Web Computing. Je suis diplômée de l’ESTE (groupe ESIEE). J’ai eu mon poste d’enseignante à l’Université en 1998 à la fin de mon Master. J’ai 14 ans d’expérience en JavaScript et Web front-end. J’ai également un intérêt prononcé pour le développement d’applications mobiles, et nous étions la première Université en Angleterre à avoir un diplôme concentré totalement sur le développement d’applications mobiles. J’enseigne en Web technology, Mobile Computing Principles, Mobile User Experience et j’aide mon collègue pour son module en développement iPhone et iPad. J’ai toujours eu une passion pour le JavaScript, un goût prononcé pour le web front-end et, depuis plusieurs années, pour le mobile web. C’est ainsi que je me retrouve aujourd’hui membre de l’équipe de jQuery Mobile.

jQuery Mobile .Net Awards (Joby Sessions, http://www.jobysessions.com/)

Peux-tu nous expliquer un peu plus en quoi consiste ton rôle au sein de l’équipe de jQuery Mobile?

Dans l’équipe, je m’occupe de plusieurs choses. Je maintiens la page des ressources, et j’aide à maintenir la documentation à jour. Je teste et je soumets les bugs découverts sur Github. Je participe également à la résolution des différents bugs rapportés par d’autres.

Comment es tu entrée dans cette équipe? Qu’est ce qui t’as poussé à sauter le pas?

En fait, on est un peu venu me chercher!

En septembre 2010, j’ai cherché une alternative au WML pour mon module en « mobile computing principles ». C’est là que je suis tombée sur jQuery Mobile. Le framework était en version Alpha1! J’y ai cru tout de suite. C’était pour moi ce que tout le monde attendait. J’ai développé quelques exemples et j’ai donné 2 cours sur le sujet.

Le framework évoluait assez vite et je me suis mise à soumettre des bugs découverts lors de mes développements pour certains projets sur lesquels je travaillais à l’Université ainsi que le code pour les résoudre. Todd Parker m’a encouragée à faire les corrections moi-même et à soumettre des ‘pull requests’.

Un an plus tard, je me suis attaquée à la documentation qui n’était visiblement pas écrite d’une seule voix. Elle avait besoin d’uniformité, et certaines explications étaient ambiguës. C’est mon côté pédagogue qui a parlé. J’ai proposé à Todd de passer toute la doc en revue et de faire les changements nécessaires. Il a accepte, et je m’y suis attelée. J’ai commencé à parler un peu des projets sur lesquels je travaillais à l’université. Todd a vu certaines de mes applications et le site que j’avais développé pour le projet iWestminster. Il m’a demandé de l’aider à designer et préparer la page des ressources pour la sortie de jQuery Mobile 1.0. La page était alors une longue liste de simples liens, sans mots d’explication, sans données sur les auteurs, lieu ou date de publications des articles, et, évidemment, sans couleur et sans image. Je l’ai transformée en ce qu’elle est aujourd’hui. J’avais un weekend et quelques soirées pour le faire. On s’est très bien entendu. A chaque nouvelle idée ou prototype soumis, Todd me répondait très vite et de mon coté je le tenais au courant de l’évolution de la page très régulièrement. Je crois que l’équipe a été ravie du résultat. Peut-être était-ce mon test d’entrée.

J’ai vu l’autre jour que tu as assisté à la jQuery UK 2012 qui s’est tenue à Oxford. Un retour ?

La conférence était très bien organisée (merci White October), et les orateurs de classe internationale. Le niveau était vraiment élevé. C’était assez génial je dois dire d’avoir pu réunir tout ce monde sur une même scène. Ce qui m’a un peut surpris, c’est l’étendu du respect et de l’admiration portée a tous les membres des différentes équipes de jQuery. C’est très agréable de faire partie de l’équipe jQuery Mobile et de travailler avec des gens aussi talentueux.

On a même eu le droit à un élan de féminisme. Appel à la mobilisation ou juste soulignage d’un fait anecdotique ?

C’était plutôt une constatation surprenante. A l’ESTE, nous étions 5 filles sur une promo de 96. Ça ne m’a jamais dérangée ou même posé problème. A l’Université je trouve que le ratio filles/garçon est en augmentation par rapport à l’époque où j’étais étudiante et, au niveau des profs, il est encore plus important. De plus, souvent, les filles réussissent vraiment bien. J’ai donc oublié que certainement peu de filles deviennent développeurs et entrent dans le monde du JavaScript.

Revenons sur ton rôle, entre autres, tu décides en duo avec Todd Parker ce qui peut ou non entrer dans les ressources jQuery Mobile. Quels sont les critères ?

Il y a plusieurs catégories dans cette page, et je dirais que chaque catégorie à ses critères propres mais en règle générale il suffit que la demande soit légitime, si demande il y a, ou alors que l’un de nous tombe sur un article, un site, un livre approprié, etc. Là où nous faisons plus attention, c’est pour la catégorie des ‘Apps and Frameworks‘. Quant à la catégorie des ‘featured sites‘, j’ai  dû choisir parmi une longue liste de sites maintenus sur la ‘JQM gallery’. Je me suis fait plaisir alors en choisissant le Moulin Rouge, un des symboles de Paris. J’ai souhaité également mettre le site de la coupe du monde de Rugby, car la France y a été brillante. Il y a ainsi des petits clins d’œil ça et là sur la page… Bien entendu ces sites sont d’une grande qualité et une vitrine formidable pour jQuery Mobile et c’est tout de même la raison principale pour leur venue sur la page.

Question complémentaire, parce qu’il en faut toujours une : Quelles interactions l’équipe mobile a avec l’équipe core ou avec l’équipe UI ? Vu de l’extérieur, on peut facilement avoir l’impression que celles-ci ont des rôles clairement délimités. Impression réaliste ?

jQuery est une grande famille. Les équipes ont effectivement un rôle clairement délimité mais elles maintiennent des contacts réguliers afin de pouvoir avancer ensemble. Todd a le rôle de jQuery Mobile lead et aussi celui de jQuery UI design lead. jQuery Mobile étant aussi basé sur jQuery Core, Todd et le reste de l’équipe ont des réunions régulières en audio ou vidéo conférence afin de discuter de l’évolution à venir des différentes librairies.

Je te sens super heureuse dans ce projet, cette aventure même plutôt devrais-je dire. Ça donne envie de s’y investir toujours plus. Un dernier mot ? Une anecdote ?

Ton analyse est tout à fait exacte. Je suis très heureuse de faire partie de l’aventure jQuery Mobile. C’est devenu une vraie passion à laquelle je consacre une bonne partie de mes soirées, et un peu de mes weekends… Mon rêve effectivement serait d’être sponsorisée pour travailler à 100% sur le projet… En attendant, je n’ai que mon temps personnel, mais c’est déjà pas mal. Pour la petite anecdote, à la maison dès qu’on me voit concentrée sur mon laptop ma famille dit que je joue à jQueryVille (en référence à Farmville, CityVille, etc) !

Je te remercie grandement de cet échange particulièrement intéressant et d’avoir pris du temps pour me répondre. J’ai cru comprendre que t’étais un peu chargée

C’est moi que te remercie. Ce fut un plaisir de répondre à tes questions et de partager mon expérience avec toi et tes lecteurs.

MAJ : j’avais oublié certaines questions, je vous prie de m’excuser. Faut que j’arrête de travailler la nuit

Je commence par vous rappeler que s’est tenu cette semaine la jQuery UK 2012 à Oxford. Je ferai un débrief dessus dans un billet séparé pour ne pas vous noyer d’infos.

Deux choses m’ont vraiment marqué cette semaine. Tout d’abord une publication de Geekos.fr qui a proposé un article permettant de travailler avec deux versions simultanées de jQuery. Je me doute qu’ils ont sûrement réfléchi longuement avant de commettre cette infamie. Mais je tiens à rappeler que ceci est tellement sale que ça ne relève même plus de la mauvaise pratique. C’est carrément à proscrire, en tout cas en production. Amis développeurs, décideurs, intégrateurs et tout autre personne touchant du code jQuery, mettez toujours un veto sur ce genre de pratiques.

L’autre fait marquant est un tweet d’Andy Matthews, développeur émérite, qui signale à la communauté des blogueurs un site de plagiat de contenus concernant directement jQuery. Je vous invite donc à vérifier si vous n’êtes pas dans la liste des articles copiés et à le contacter si vous pensez être en capacité de compléter sa liste. Encore merci à lui pour sa vigilance.

En parlant d’Andy, seconde actualité, il a publié un thème Twitter Bootstrap pour jQuery Mobile. Cette ressource a été ajouté à la page officielle des ressources du site de jQuery Mobile par Todd Parker et Anne-Gaelle Colom. Vous entendrez d’ailleurs parlé d’elle prochainement sur ce blog à priori. (#autopromo #teasing)

jQuery UI vs KendoUI est un site assez intéressant qui compare les deux frameworks graphiques. Présenté comme ça, KendoUI semple particulièrement intéressant. Ceci dit,comme l’a souligné l’ami Gilles, en ajoutant Wijmo à jQuery UI, tout de suite, la balance a tendance à bouger de ce côté ci.

Un utilisateur a évoqué la possibilité d’implémenter jQuery dans GWT (Google Web Toolkit). Un projet assez surprenant mais bon pourquoi pas après tout. Pour rappel, GWT est le framework web Java de Google. Vous codez absolument tout en Java comme si vous codiez une appli Swing (c’est comme ça que je l’ai vécu en tout cas) et le compilateur vous génère une partie serveur et une partie HTML/JS/CSS spécifique par navigateur. Technologie assez impressionnante de par les performances obtenues et la non-complexité du code à manipuler. Si ça vous intéresse, j’avais fait une critique du livre de Sami Jaber sur GWT 2.

On finit sur la question importante de l’accessibilité où le collègue de Js4Design a publié un très court article intéressant à propos du plugin jFontSize qui vous aide à mettre en place les boutons A- / A+ et la mécanique liée. Je vous invite à lire son article.

ConFoo, teasing 1

if (navigator.geolocation) {
	navigator.geolocation.getCurrentPosition(function (position) {
		console.log("position", position)
	});
}

Assez simple quand même là, non ?

Explications

Toujours vérifier si on peut faire ce qu’on va faire avant de le faire. Qualité, efficacité, compatibilité (surtout).

Puis on demande au navigateur de nous envoyer les infos auxquelles il a accès. Cela peut nécessiter une autorisation de la part de l’utilisateur. Tout est envoyé via un objet en paramètre dans une fonction de callback que j’ai créé en anonyme ici.

Vous obtiendrez un objet Position qui contient un timestamp (pratique pour le temps réel) et un objet Coordinates nommé coords.

Ce dernier objet contient les propriétés suivantes :

• accuracy : précision estimée sur la latitude et la longitude (en mètre). Toujours pratique quand vous lancerez un missile pour savoir si vous allez taper au bon endroit :p ;
• altitude : l’altitude ;
• altitudeAccuracy : la précision estimée pour l’altitude(en mètre) ;
• heading : la position en degré par rapport au Nord
• latitude : la latitude ;
• longitude : la longitude (je viens de faire deux traductions de fous là) ;
• speed : la vitesse estimée en mètre par seconde. Vaut null si elle ne peut être estimée.

Pour enrichir un peu les choses

La fonction getCurrentPosition peut recevoir 3 paramètres. Dans l’ordre :

• une fonction de callback en cas de succès ;
• une fonction de callback en cas d’échec ;
• des options complémentaires dans un unique objet JSON :
  • timeout : correspond à la durée en millisecondes avant l’appel aux fonctions de callback ;
  • maximumAge : correspond au nombre de millisecondes maximum  depuis le dernier relevé que vous souhaitez autorisé. Si vous le placez à 60000, c’est que vous demandez que le relevé soit vieux au maximum de 10 minutes. Si le dernier relevé est plus ancien, il en fera alors un nouveau. Mettre 0 pour forcer un relevé ;
  • enableHighAccuracy : permet d’activer ou non une demande de plus grande précision. Peut résulter en une différence de rapidité de résultat et pour les terminaux sur batterie (portables, smartphones), l’user un peu plus qu’une demande moins précise.

Et pour ceux qui ont vraiment envie de lire : la spec du W3C.

Compatibilité

• Firefox 3.6 + ;
• Thunderbird 3.1+ ;
• Fennec 1.0 + ;
• Chrome 5+ ;
• IE 9+ ;
• Opera 10.60+ ;
• Android 1.6 +
• Safari 5.0 + ;
• iOS 3.0 +;
• BlackberryOS 6+.

Plutôt complète la liste non ?

Conclusion

Il y a d’autres trucs avec lesquels vous pouvez jouer mais déjà rien qu’avec ça, j’ai envie de vous dire : Elle est pas belle la vie ?!

Vous pouvez toujours vous délecter de divers sites en français répertoriés sur jQuery.com : http://docs.jquery.com/Tutorials#Tutoriaux_en_Fran.C3.A7ais.

En parlant de choses francophones, on peut remercier un développeur surnommé forresst pour sa traduction de la documentation officielle de jQuery Mobile.

Vous pouvez aussi tester un constructeur d’applications jQuery Mobile proposé par la société Tiggzi.

Je terminerai sur un retour d’expérience utilisateur. Tomas Lin nous explique sur son blog comment ils ont ajouté une version mobile du site Secret Escapes, basé sur Ruby On Rails.

Aloha

Vous connaissez TinyMCE, CKEditor (anciennement FCKEditor) ou HTMLarea ? J’ai arrêté moi, ras le bol, tout mal foutu, pas très bien codé, bordélique, une doc parfois légère ou carrément prise de tête (TinyMCE inside). Et pour conclure, une barre d’outils souvent très lourde et surtout pas du tout esthétique en plus d’être particulièrement envahissante.

Donc déjà Aloha, c’est ça, un code bien écrit, une simplicité d’utilisation et pour ainsi dire, pas du tout intrusif.

Et pour finir sur les présentations, c’est aussi une équipe de dev non négligeable puisqu’on y retrouve des têtes quelque peu connues :

• Jörn Zaefferer, Lead Developer de jQuery UI ;
• Richard D. Worth, chef de projet technique pour jQuery UI ;
• Scott Gonzalez, Lead Developer de jQuery UI et travaille chez appendTo ;
• Mike Hostetler, CEO de appendTo, société spécialisée dans le dev jQuery et à qui on doit l’étude qui avait montré que jQuery était passé devant Flash.

Et sinon ?

Je vous parle de Aloha pour une raison simple, j’ai beaucoup joué avec ces derniers jours. Autant que je partage ce que j’ai appris dessus et vais apprendre dans les jours à venir. Donc, à suivre !

Surtout qu’en faisant :

apt-get install flashplugin-nonfree

J’obtenais tout le temps  :

Le paquet « flashplugin-nonfree » n’a pas de version susceptible d’être installée.

Deux choses à faire donc. Charger : http://ftp.us.debian.org/debian/pool/contrib/f/flashplugin-nonfree/flashplugin-nonfree_2.8.2_amd64.deb

Et exécuter

dpkg -i flashplugin-nonfree_2.8.2_amd64.deb

C’est bête à dire mais ça m’a pris la tête. Flash de merde

Foundation

Le plus gros, le plus connu. C’est pas compliqué, dès que ça parle de Twitter Bootstrap, il faut toujours quelqu’un pour parler de Foundation.

Pourtant il y a un fossé énorme concernant Foundation. Déjà, peu de JS (il n’y a que Orbit, un slideshow réputé). Et moins de bootstrap, même si sur cette part ils sont allés moins loin à mon sens. Moins de travail mâché mais du coup, plus de flexibilité. Beaucoup plus de flexibilité en fait. Parce que soyons honnête, même en changeant un peu les couleurs, un site sous TB se reconnaît en moins de 20 secondes montre en main. Et sans regarder la source.

Skeleton

Bien plus léger, pas de JS du tout mais un accent plus insistant sur le côté « responsive ». Skeleton est vraiment un truc d’intégrateur. Typiquement le mec comme moi qui est incapable de faire le moindre design potable tout seul n’y arrivera pas plus. J’aurais une structure HTML bien foutue, les éléments que je veux où je les veux mais au delà bas ça sera moche à souhait. Ou « Google » si on pense à la légendaire sobriété de leur page de recherche de base. A réserver donc aux gens qui s’y entendent en design et qui ont juste besoin d’un cadre de départ propre et structuré.

99 Lime HTML Kickstart

Un peu surpris par cette découverte, 99 Lime HTML Kickstart me tente bien. Je le trouve aussi complet que Twitter Bootstrap (sans compter l’accordéon et l’auto-complétion), même le slideshow est de la partie.

Voire même plus en fait. Par exemple TB ne fournit pas d’icônes sociales, d’icônes tout court en fait, le menu peut aller plus loin que la simple Dropdown proposée par TB.

Point fort par rapport à TB mais que ces dernier sont en train de corriger. La doc. Je la trouve plutôt très claire et franchement, c’est vraiment agréable !

Et vous, vous en connaissez d’autres ?

Je remercie d’ailleurs les commentateurs de l’article de LinuxFr à ce sujet pour tous leurs liens.