LE

MAGAZINE

DU

DVELOPPEMENT

Bonne anne 2013 !

www.programmez.com

Mensuel n 159 - janv ier 2 013

Choisir sa plateforme de dveloppement mobile

Quel OS pour quelles apps ? Les outils, les avis de dveloppeurs. Nos conseils.
I stockphoto/piart

une carrire en plein boom ?

Node.J :JavaScript,ct serveur S Personnaliser Prestashop
M 04319 - 159 - F: 5,95 E

Dveloppeur mobile

C++
Dcouvrir la programmation C++ AMP

Webmaster

Objet connect
Le proje Koneki t

Big Data
Comprendre Hadoop

3:HIKONB=^UZ^Z]:?a@b@p@t@a;

Printed in EU - I mprim en U E - B EL G I Q U E 6,45 S U I S S E 12 FS - L U X EMB O U R G 6,45 D O M S urf 6,90 Canada 8,95 $ CAN - TO M 940 X PF - MAR O C 50 D H

A buzzword

Les obj connects,internet des obj : ets ets nouvel Eldorado technologique ?

eWeb 2012 (4-6 dcembre) tait plac sous le signe de linternet des objets, ou plus concrtement de ce que lon appelle les objets connects, grosso-modo, le M2M (Machine to Machine). Le march M2M va de lautomobile aux appareils mnagers. En 2012, plus de 140 millions de modules M2M se sont vendus (chiffre IDATE), mais le march va crotre rapidement : + 30 % en 2015. LEurope est une grande consommatrice de M2M, surtout dans le secteur automobile. Lobjet connect est un appareil qui peut se connecter un rseau, interagir et changer avec dautres appareils, sans quil y ait besoin de passer, de transiter par un ordinateur. Ces objets sont donc des entits technologiques indpendantes. Un des exemples les plus remarqus durant LeWeb est ltonnant thermostat Nest, objet que lon avait dj vu il y a plus dun an en dmonstration. Lobjet se veut intelligent dans le sens o il apprend de vos habitudes et de son environnement pour ajuster au mieux la chaleur, optimiser la consommation lectrique. Il rcupre les informations mto. Le Nest peut rsumer le concept de lobjet connect : lusage et le design. Tous les objets sont concerns. Nous pouvons prendre lexemple du pse-personne de Withings, socit franaise. La balance wifi facilite le suivi de chaque personne de la famille pour le poids, avec estimation de la proportion de muscle et de gras, etc. On peut crer un programme sportif pour amliorer votre forme et le profil de masse corporelle. Le tout est reli des applications sur son smartphone ou son ordinateur. Le constructeur propose aussi un tensiomtre capable dtablir le suivi de la tension, de fournir tous les chiffres cls, etc. Withings cherche trouver des usages motivants

pour lutilisateur. Lobjet connect ne doit pas tre un gadget technologique supplmentaire mais sintgrer au quotidien et devenir naturel. Beaucoup dobjets connects de loisir taient visibles LeWeb.

> Mon (trs) prcieux

Finalement, est-ce une vritable rvolution ou une simple volution ? Pour le moment, cest la 2e voie qui est prise. Le cas des ampoules LIFX en est un bel exemple. Il sagit dampoules connectables un rseau wifi que lon peut ensuite piloter depuis un smartphone, une tablette. Le but : personnaliser, repenser le fonctionnement des douilles lectriques (fini linterrupteur !). Lide est intressante et plus simple que la domotique classique. On dispose dun SDK de dveloppement pour crer des usages. Le principal problme est son prix : 69 $ pice ! Il faudra plusieurs annes avant que lobjet connect se dfinisse mieux et sintgre lusage au quotidien et surtout inventer de nouveaux usages. Nous pouvons aussi regarder vers dautres

objets ou plutt de nouveaux modes dintgration entre objets. Le projet de Microsoft, SmartGlass, est intressant regarder. Lobjectif vise partager tous les contenus entre les diffrents terminaux disponibles : tablette, smartphone, Xbox / Kinect sur le tlviseur. Mais il sagit aussi dinteragir avec un contenu, un jeu, avoir des complments. L, tout reste faire et le dveloppeur peut sclater avec le SDK SmartGlass. Nous avions dj voqu les lunettes Google (Project Glass). En quelque sorte, il s'agit de proposer une ralit augmente, avec des lunettes Android et des connexions, pour fournir informations, conseils, reconnatre des amis, navigation, etc. L encore, il est ncessaire que la technologie murisse. Les dveloppeurs auront un rle jouer car sans eux, pas dapplications, pas dinteraction. Mais le dveloppeur ne sera pas seul, lobjet connect ncessite un design particulier (aussi physique que virtuel), des usages dfinis et du contenu. Ce triptyque nous semble incontournable.

Une domotique repense

Pour conclure, parlons dun autre projet vu LeWeb : SmartThings. Le but est de crer une plateforme sur laquelle on connecte lensemble des appareils, terminaux de la maison. Pour cela, on utilise des capteurs connects. Bref, une autre forme de domotique qui se veut plus simple. Pour lditeur, 3 choses sont essentielles : connecter les objets de tous les jours Internet / un rseau, avoir une application mobile pour contrler, grer et surveiller ces objets, et enfin, avoir des outils simples pour dvelopper les usages, les interactions. L encore, le dveloppeur est au cur des proccupations. Le kit SmartThings sarticule autour dun hub et dun ensemble de capteurs. Les vidos LeWeb 2012 : http://www.youtube.com/user/leweb

# Franois Tonic PROgrammez !

<3>

JANVIER

2013

Donnez votre avis sur ce numro : www.programmez.com/magazine_

numro 159 - janvier 2013

sommaire

Sources des articles sur www.programmez.com

10

BUZZWORD
Les objets connects, internet des objets : nouvel Eldorado technologique ? ............................................3

ACTUS
En bref ............................................................................6 Retour sur les Epitech Innovative Project 2012 ....9 C++ML : programmation visuelle en C++ ..............11 8

MATRIEL
Scuriser et protger votre matriel informatique
..........................................18

OUTILS RESSOURCES
Communauts et agenda du mois ..........................12 Meetup SkySQL Paris : Cloud, MySQL, MariaDB ................................................19 Neo4j : lautre univers du stockage
............................20

DVELOPPEUR DU MOIS
Samuel Blanchard : Les multiples vies dun geek-dveloppeur ..............16

VEILLE TECHNO
Analysez vos donnes en Map Reduce avec Hadoop !......................................26

DOSSIER : ANDROID, IOS, WINDOWS PHONE 8

Choisir sa plateforme de dveloppement mobile

Quels critres pour quelle plateforme ? ........31 Android, iOS, Windows Phone 8 : les dveloppeurs parlent aux dveloppeurs..................................33 5 leons mobiles mditer
istockphoto.com/piart

............................40

La dictature des Public Stores est-elle lgitime ? ..............................................45 Focus sur Windows Phone 8
..........................46

prochain numro

A lire dans le prochain numro

N160Fvrier 2013 para le 31 ja , tre nvier 2013

Dvel opper pour

Facebook Cloud : ce qui change pour les dveloppeurs

La platef orme,les APIet SDK,opengraph,le modle conomique

Cloud,open

5.1 cest mieux que 5.0, ainsi parle le W 3C

Jai dabord cru une bonne blague : lancement des premiers brouillons de HTML 5.1. Le 17 dcembre, le W3C annonce aujourdhui la publication de la dfinition complte de HTML 5 et des spcifications du Canvas2D . Pas de doute, il sagissait bien dune annonce officielle. Mais laffaire est un peu plus complique que cela. Bien que la dfinition complte de HTML 5 soit fixe, il reste maintenant proposer des batteries de tests et dinteroprabilit et surtout sortir la recommandation finale W3C officielle du HTML 5. Cette phase interviendra seulement en 2014 (et officiellement, pas avant le dernier trimestre). Soit dans environ 18 mois. Les dveloppeurs peuvent maintenant examiner les spcifications HTML 5 et estimer les modifications apporter. Surtout, les diteurs pourront implmenter les fonctions manquantes de HTML 5, corriger les mcanismes existants. On peut sattendre de nombreuses mises jour des navigateurs et des moteurs de rendu HTML. Les environnements de dveloppement devront aussi tre corrigs. Il reste encore un important travail de corrections de bugs (169 trouvs au 17 dcembre). La question de la scurit et certains mcanismes ne manqueront pas de remonter la surface. Pour ne pas perdre de temps, le W3C engage ds maintenant les premiers travaux autour de HTML 5.1. Une interoprabilit totale sera assure avec la 5.0 (ouf !), ainsi que la correction des problmes de la version actuelle. Il est prvu que cette volution inclue moins de technologies. Dans le mme temps, le consortium lance le travail sur Canvas 2D, niveau 2. Il sagit encore dune toute premire investigation autour de la 5.1. Il faudra attendre 2014 pour voir apparatre les premires spcifications concrtes. Les recommandations officielles ne sont pas attendues avant fin 2016 ! Et dans les plans du W3C, il est dj prvu de lancer les rflexions autour de la 5.2 ds 2015 Est-ce l un moyen pour le W3C de couper les ambitions du WHATWG qui avait cr un fork de HTML 5 lt dernier ? Si rien nest dit officiellement, cest effectivement un moyen dacclrer, un peu, le calendrier futur. HTML 5, associ CSS et JavaScript, est aujourdhui un modle de dveloppement central pour plusieurs plateformes desktop et mobiles. Microsoft mise beaucoup dessus, Adobe aussi, tout comme Apple et Google. Pour ce dernier numro de lanne, nous allons plonger dans lunivers impitoyable des smartphones et des tablettes. Des dveloppeurs tmoignent de leur exprience de dveloppement et vous donnent des conseils pratiques. Aujourdhui, comme vous le verrez, il y a deux leaders : iOS et Android. Windows Phone 8 ambitionne dtre la troisime plateforme mobile mais ce nest quavec une large diffusion que WP8 pourra prtendre rivaliser avec la concurrence. En tout cas, il faudra le faire vite, car BlackBerry 10 arrivera dans quelques semaines et espre bien relancer la machine. Au-del du systme et du nombre dapplications cest clairement la masse dutilisateurs qui joue. Vous dcouvrirez les joies du dveloppement C++ avec les nouvelles librairies AMP ainsi quune introduction Hadoop et aux objets connects # Franois Tonic - Rdacteur en chef ftonic@programmez.com
F. Tonic

CARRIRE
Dveloppeur mobile : une carrire pleine davenir ? ..........50

JE DBUTE AVEC...

18 Migrez vos applications vers ASP.NET 4.5 (2e partie) ........................................51 Je dbute avec le kit de dmarrage ASP.net MVC ..........................................53 Dcouverte de C++AMP avec Visual Studio 2012 ................................................58

PRATIQUE
Koneki, le dveloppement M2M simplifi ....................67

WEBMASTER

JavaScript : la rvolution est-elle en marche ?

(2e partie) Crer un service Cloud en moins de 500 lignes
......70

Implmentation dapplications Web avec Node et Express ....................................................73 JavaScript/dveloppeur : lAmour avec un grand A ................................................76 JavaScript est souvent incompris ................................78 Ecrire un module dextension Prestashop
..............79

46

Toute lquipe de PROGRAMMEZ ! vous souhaite une excellente anne 2013.

Editeur : Go-02 sarl, 21 rue de Fcamp 75012 Paris diff@programmez.com. - Rdaction : redaction@programmez.com - Directeur de la Rdaction : Jean Kaminsky. Rdacteur en Chef : Franois Tonic - ftonic@programmez.com. Ont collabor ce numro : F. Mazu. Experts : J.C. Baudier, A. Picq, R. Poirson, S. Martins, N. Albeza, M. Cholley, R. Gay, L. Humez, P.Y. Le Borgne, J. Lecerf, T. Tanon, P Muller, F.X. Bois, R. Saissy, H.Verreydt, J.B. .H. Boisseau, R. Buclin, G. Clment, A. Sottiau, N. Tonneau, M. Herbaux, N. Suter, D. Tran, L. Jordi, B. Boucard, B. Cab, M. Lux, T. Templier, M. Loussinian, M. Diaz-Orlich, V. Saluzzo, M. Duvignaud, G. Brout, F. Muiseroux. Illustration couverture : istockphoto.com/piart Publicit : Rgie publicitaire, K-Now sarl. Pour la publicit uniquement : Tl. : 01 41 77 16 03 diff@programmez.com. Dpt lgal : parution Commission paritaire : 0717K78366 ISSN : 1627-0908. Imprimeur : S.A. Corelio Nevada Printing, 30 alle de la recherche, 1070 Bruxelles Belgique. Directeur de la publication : J-C Vaudecrane Abonnement : Programmez, 17, Chemin des Boulangers, 78926 Yvelines Cedex 9 - Tl. : 01 55 56 70 55 - abonnements.programmez @groupe-gli.com - Fax : 01 55 56 70 91 - du lundi au jeudi de 9h30 12h30 et de 13h30 17h00, le vendredi de 9h00 12h00 et de 14h00 16h30. Tarifs abonnement (magazine seul) : 1 an - 11 numros France mtropolitaine : 49 - Etudiant : 39 - CEE et Suisse : 55,82 Algrie, Maroc, Tunisie : 59,89 Canada : 68,36 - Tom : 83,65 - Dom : 66,82 - Autres pays : nous consulter. PDF : 30 (Monde Entier) souscription exclusivement sur www.programmez.com

dito

satisfaction.php

i actu
Embarcadero le 12 dcembre dernier. C++ Builder XE3 (dvelopp lorigine par Borland) est une plateforme complte de dveloppement C++ multiplateforme pour les applications natives sur desktop : Windows, OS X, et bientt pour iOS et Android. Lenvironnement intgre galement un compilateur 64 bits complet et une mise jour VCL pour les clients C++Builder existants, permettant une mise jour 64 bits rapide pour des millions dapplications Windows existantes. Embarcadero met en avant plusieurs fonctions et facilits : - compilateur 64 bits - utilisation du compilateur Clang 3.1 pour

Builder XE gC++par lditeur dvoil

3 a t

supporter les plus rcentes fonctions et bibliothques C++ (particulirement C++ 11) - support de Windows 8 et des derniers systmes OS X ainsi que des crans Retina (environnement Apple) grce une gestion plus fine du HiDPI. - les dveloppeurs peuvent utiliser les extensions de standard C++ dEmbarcadero pour acclrer et rationaliser les dveloppements C++. Les techniques agiles telles que le prototypage rapide, la programmation PME (Properties, Methods, Events) et le dveloppement visuel permettent de dvelopper jusqu 5 fois plus rapidement par rapport aux dveloppements traditionnels.

Le dveloppement mobile (Android / iOS) est attendu pour 2013. Lobjectif est de supporter les fonctions matrielles et un large nombre dAPI. Une premire bta devrait tre disponible quand vous lirez ces lignes. Les modules iOS arriveront (estimation diteur) premire moiti de 2013 et vers la mi-2013 pour Android. Windows RT et Linux Server sont prvus mais une date inconnue.

Cest la question qui se pose depuis de nombreux mois. La version 5 est sortie il y a plus dun an et depuis, plus rien. Aucune annonce dune version 6, aucune mise jour impor tante de la v5, trs peu de mention de la technologie quand Microsoft voque Windows 8, Windows Phone 8. Une version 5.1 est sortie en mai 2012 pour corriger quelques bugs. Courant dcembre, le site officiel silverlight.net a t purement et simplement ferm pour rediriger vers une sous-section de MSDN. Officiellement, le suppor t de Silverlight 5 stend jusquen 2021. Le modle de dveloppement web et web riche nest plus du tout centr sur Silverlight.

g Silverlight avenir ?

a-t-il encore un

Amazon A/B est un outil gratuit pour tester et optimiser les applications Android. Loutil utilise des API Amazon (Insights SDK / API). Il fonctionne en ligne et est accessible aux dveloppeurs inscrits au programme Mobile App Distribution. Il servira uniquement aux applications destines la boutique dapplications Amazon et non Google Play. Site : https://developer. amazon.com/ sdk/ab-testing.html

g Amazon lance! un outil de gTwitter dcide dtre plus tests pour Android transparent et ractif envers
les dveloppeurs. Pour les aider anticiper les changements et les nouvelles versions, Twitter propose maintenant Calendar of API changes . Toutes les volutions jusqu mars 2013 sont indiques avec les API impactes, les ressources et la disponibilit estime. Site : https://dev.twitter.com/calendar

gAMD livre une nouvelle version de APP SDK

, la v2.8, avec une suite doutils adapts, CodeXL. Cet ensemble de dveloppement doit aider le dveloppeur optimiser et utiliser des technologies parallles et de CPU / GPU avec un seul code. Le SDK supporte OpenCL, C++, DirectCompute. Pour raliser cette indpendance pour tre le plus portable possible, AMD a introduit un nouveau template de librairie : Bolt. Celui-ci doit apporter un modle de dveloppement connu (trs similaire au STL) et surtout une indpendance et une abstraction matrielle et technique. APP SDK fournit toutes les librairies ncessaires pour coder en OpenCL avec de tout nouveaux exemples de code. AMD avait t trs critiqu sur son manque de ractivit vis--vis dOpenCL, concurrent direct de CUDA. CodeXL 1.0 (disponible depuis dbut dcembre) inclut un debugger GPU, un profileur CPU et GPU, un analyseur statique. Site : http://developer.amd.com

version,

Maps SDK g Googledisponible pour iOS est

, nouvelle

(iPhone / iPad). Le retour de Maps sur la plateforme Apple sest fait en force via une application ddie et surtout avec la disponibilit dun SDK spcifique. Il permet de personnaliser, interagir, dafficher des cartes dans une application iOS. On dispose de toutes les fonctions essentielles (3D, rotation, zoom, etc.). Pour accder au SDK, il faut envoyer une demande site : https://developers.google.com/maps/ documentation/ios/
PROgrammez !

<6>

JANVIER

2013

i actu
gLes dernires nouvelles dveloppeurs de Facebook
Le rseau social Facebook fait voluer rgulirement ses API, parfois, trs brutalement. Lditeur a annonc la version 3 du SDK pour Android. Cette version est une version importante pour les dveloppeurs : nouveaux objets dinterface, open graph, gestion des sessions simplifie, API amliores. On dispose aussi du Native Login (authentification sans sortir de lapplication. Le SDK pour iOS avait t mis jour en octobre dernier, version 3.1 : intgration iOS 6, Native Login, partage des posts pour en savoir plus : https://developers.facebook.com

Vous souhaitez dvelopper en langage Cobol sur Windows 8 ? Cest possible avec la nouvelle version de Visual Cobol 2.1 de Micro Focus. Cette solution sintgre Visual Studio 2012 mais aussi .Net et au Cloud. Les dveloppeurs sont donc aujourdhui en mesure de prenniser leurs applications dentreprise existantes sur la dernire version de la plateforme Microsoft. Vous pouvez ainsi dvelopper, maintenir ou tout simplement migrer vos codes Cobol. Site : http://www.microfocus.com

Focus gMicro 8. adapte Cobol Windows

Google modifie sa plateforme cloud.

Google Cloud Platform arrive avec de nouveaux tarifs, de nouvelles fonctions. Cette plateforme inclut App Engine,

Google Sync va permettre laccs Gmail, Calendar et Contacts via CarDav et IMAP . Les utilisateurs actuels ne seront pas affects par cette introduction. Google Calendar Sync, Google Sync for Nokia S60 et SyncML sarrtera en dcembre 2013 et janvier 2014. Pour en savoir plus : http://googleblog.blogspot.ca/2012/12/winter-cleaning.html

Microsoft dvoile le futur dASP.Net. Beaucoup de nouveauts

sont attendues pour 2013 : OData, Windows Store, traage, page daide, Windows Azure Active Directory, Facebook, templates mobiles, etc. Les quipes en charge dASP .Net ratissent trs large pour amliorer la plateforme. Cette version ne sera pas disponible avant fin 2013, avec une pr-version disponible vers septembre octobre. Pour tout savoir : http://aspnetwebstack. codeplex.com/wikipage?title=Roadmap

gSkySQL & Monty Program

annoncent la disponibilit de plusieurs connecteurs open source pour MySQL. Ils visent faciliter la communication entre les applications C et Java et les bases MySQL et MariaDB. Il sagit des composants : MariaDB Client Library for Java Applications et MariaDB Client Library for C pour la base de donnes MySQL. Ces connecteurs seront proposs la communaut sous licence LGPL. Site : http://www.skysql.com/ mariadb/connectors

P o s t g r e S Q L a sor ti dbut dcembre, plusieurs mises jour : Les nouvelles versions 9.2.2, 9.1.7, 9.0.11, 8.4.15 et 8.3.22. Ces versions corrigent plusieurs bugs, des problmes dindex. Pour les utilisateurs de la PostgreSQL 9.2, il est recommand de reconstruire les index crs avec la commande CREATE INDEX CONCURRENTLY l'issue de la mise jour. Cette opration est simple et n'a pas d'impact sur la production. Par ailleurs, l'arrt du support de la branche 8.3 est annonc pour fvrier 2013. Si ce n'est pas dj fait, il est temps de penser migrer vers une ver-

Cloud Storage, BigQuerr y, Compute Engine. Cloud Storage subit une baisse des prix de 20 % et lditeur lance une version de tests de Durable Reduced Availability, une option de stockage prix rduit, sans les fonctions fines de rplications. Dautre par t, Google annonce des amliorations de ces datacenters europens. Et sur tout, Compute Engine (un super IaaS) propose 36 nouvelles instances et une tarification revue la baisse. Pour en savoir plus : https://cloud.google.com

update gVisual Studio 2012un mois.1 est disponible depuis

Cette mise jour cible le dveloppement Windows 8, Sharepoint, les quipes agiles et la qualit logicielle. De nouveaux modles, des concepteurs et des outils de test et de dbogage pour supporter la plateforme Windows 8, y compris le support pour les applications Windows Store Windows 8 avec un simulateur. Analyse de code pour Windows Phone 8 applications. Cette mise jour permet galement de cibler Windows XP avec des applications en C++ natif , indique Microsoft.

sion plus rcente , prcise Guillaume Lelarge, directeur technique de Dalibo. Dtail des bug fix sur http://www.postgresql.org/about/ news/1430/

Google a lhabitude de faire le mnage dans ses services et API plusieurs fois par an. Le mnage dhiver, dvoil midcembre, propose : larrt de plusieurs fonctions de Google Calendar ds le 4 janvier 2013
<8>
JANVIER 2013

PROgrammez !

i actu projets

Retour sur les Epitech I nnovative Proj 201 ect 2

Les 16 et 17 novembre derniers, les tudiants de lEpitech prsentaient leurs projets dtude : les Epitech Innovative Project. Parmi les dizaines de projets prsents, deux nous ont particulirement impressionns par leur conception, les ides techniques et bien entendu leur ralisation concrte. Il est toujours difficile de faire un choix, car de nombreux autres Franois Tonic projets auraient mrit davoir leur place ici.

RealCar :piloter une voiture

otre gnration a vcu lavnement du jeu vido, ces derniers possdant des moteurs physiques et des graphismes toujours plus bluffants, de plus en plus coteux et complexes raliser. Nous atteignons les limites du ralisme dans les jeux vido classiques. Deux constats : Internet est partout, la multiplication des objets connects. RealCar sinscrit dans cette tendance. Lide est de piloter distance, par vido interpose, des vhicules miniatures bien rels, dans des dcors ludiques immersifs.

simulation vido-ludique traditionnelle (crneau dans lequel tous les diteurs sengouffrent). Notre quipe, compose de 9 personnes aux comptences complmentaires, a donc choisi dexploiter directement un objet physique voluant dans un environnement rel. Voyons cela plutt comme un nouvel objet ludique pilotable via Internet. Nous possdons lquivalent dun moteur graphique et physique qui vaut des milliers dheures de programmation et d'algorithmie avance : ainsi est n RealCar.

stix, un serveur matre sous Debian et un client Windows/Linux en SDL/Qt. La communication entre le serveur matre et les voitures repose sur le WIFI, technologie la plus adapte pour le moment, offrant une stabilit et des dbits satisfaisants.

> Dveloppement
Tous les dveloppements ont t raliss en Agile, rpartis par quipe de 2 3 personnes. La jonction des briques se faisait rgulirement bien que les quipes taient dissmines travers le monde pour leur 4e anne de formation.

> Serveur de jeu > Objectifs

Au dpart, les objectifs concrets dexploitation ntaient pas bien dfinis. Tout comme la socit Parrot lorsquelle dveloppait ses premires versions de lAR Drone, notre rflexion nous a oriente vers un premier produit accessible et apprci de tous : les courses de voitures. Le choix de larchitecture et des technologies a t mrement rflchi. Fort dune exprience antrieure sur du matriel embarqu b a s e d I G E P, n o u s avons opt pour une infrastructure 3 tiers reposant sur du matriel de la socit GumUn serveur matre (du jeu) contrle lensemble du systme, il a t ralis en C++/Boost et coordonne lassignation des commandes entre joueurs et voitures et les flux vido en retour. Le serveur supporte plus dun millier dobjets connects simultanment. Les objets connects communiquent avec ce serveur, ainsi que les clients de jeu. Les commandes mises par les clients de jeu aux objets connects utilisent simultanment du TCP et de lUDP pour assurer une ractivit instantane.

> Cadre du projet

Dans le contexte du dveloppement des EIP , nous avions le dsir daller au-del de la

> Objet connect : Vhicule visio-pilot

Nous avons explor plusieurs possibilits de chssis physique tels quun Crawler et un tank avant de nous fixer sur un modle plus simple et plus fun que nous avons tous pilot dans notre jeunesse : un Buggy. Nos prototypes sont quips dune Gumstix Overo

PROgrammez !

<9>

JANVIER

2013

i actu projets
vons lui assigner une voiture disponible et enfin lancer la partie une fois que tous les joueurs sont prts entrer dans larne. Nous avons dfini une API dadministration souple et complte pour nos besoins internes. La tablette utilise donc cette API pour prsenter une interface adapte. Notre application permet par exemple denvoyer une commande de dconnexion au serveur qui transmettra linformation la voiture et au client. Le joueur est inform de sa dconnexion et la voiture redevient disponible dans le parc, tout ceci en temps rel. La tablette permet galement davoir le retour des diffrents capteurs de la voiture, comme ltat du vhicule, la batterie ainsi que dautres informations tlmtriques.

> Produit final et situations relles

COM intgrant un ARM Cortex-A8, ainsi quune carte additionnelle Pinto-TH et une extension maison pour lalimentation et les servomoteurs. Llectronique des servomoteurs est directement pilote par les PWM sortie analogique gnrant un signal logique comprhensible par les servomoteurs connects au processeur ARM embarqu.b. Quand la voiture boote, elle se connecte au wifi RealCar, dmarre un daemon qui lenregistre sur le master. Ce daemon pilote la camera et envoie le flux vido au serveur en RTP Des mini-camras . vidos 480p fixes sur la voiture et munies dobjectif grand angle nous assurent une captation vido de qualit. Ainsi nous sommes capables de diffuser ce flux aux clients de jeu plus de 60 fps. Dautres solutions sont toujours ltude et nous sommes encore en attente de validation. Le lag tant le principal obstacle la fluidit requise par ce type de jeu, nous sommes cependant parvenus le rduire suffisamment pour que celui-ci n'affecte pas le pilotage des voitures. Actuellement, la vido est transmise en RTP avec GStreamer et est encode ct client (voiture) grce au codec vido H264. La vido est envoye au client final en UNICAST. Les commandes de jeu sont gres sur clavier ou via un pad de Xbox. Il est galement prvu de dvelopper les retours haptiques pour le retour de force. Notre client est multiplateforme, il tourne sous Windows et sous Linux. Aprs plus dun an de recherche et dveloppement, nous avons enfin eu loccasion dexploiter RealCar en conditions relles. Au Forum {EIP Epitech}, nous avons mis en place un circuit en huit dune vingtaine de mtres de long, avec des obstacles, une mise en condition (lumires, tunnel, pont) et deux opposants sur la piste. Les modles rduits de voitures taient brids 20% de leurs capacits soit 8 - 10 Km/h. Des bta-gamer se sont alors affronts sur le terrain, en vue embarque dans nos prototypes de voitures RC.

> Conclusion
Lintrt croissant et la curiosit manifeste pour ce produit a t pour nous une norme source de motivation, laccueil rserv par le public tant la meilleure des rcompenses. Nous avons recueilli de nombreuses remarques et suggestions et nous allons maintenant augmenter la ralit avec les nombreux lments dun jeu traditionnel. Les axes dutilisation du produit et les drivs sont trs divers. Nous continuons actuellement nos recherches, lamlioration constante des technologies que nous utilisons nous aide dans ce sens. Lavnement de la 4G ouvre aussi la voie dautres opportunits. Une rvolution est en marche. # Jean-Christophe Baudier, Archibald Picq, Romain Poirson et Steven Martins, tudiants en 5e anne Epitech.

> Proxy vido

Un proxy vido permet la diffusion publique dun ou plusieurs vhicules en course, le stream se fait sur une voiture prise au hasard.

> Interface tablette tactile

Pour oprer en condition relles, nous avons d dvelopper une application Android 4.0 qui est une vritable interface d'administration du jeu. Un oprateur sur le terrain dispose dune tablette qui lui donne accs toutes les fonctions du jeu. Elle nest pas indispensable mais elle permet de grer les courses facilement, directement dans le feu de laction. Cest elle qui gre les interactions entre le parc de voitures et le pool de joueurs. Grce cette application, nous pouvons visualiser en temps rel les joueurs qui se connectent nos serveurs, puis nous pou-

> Client de jeu

Le client de jeu permet aux joueurs de commander la voiture et de recevoir la vido de la course en temps rel. Cette partie logicielle a t ralise en C++/SDL et repose sur GStreamer pour la rception du flux vido. Cette dernire partie a t la plus sensible et nous avons explor plusieurs voies avant de trouver la solution la plus adapte.

PROgrammez !

< 10 >

JANVIER

2013

Epitech I nnovative Proj 201 ect 2

C++M L:programmation visuelle en C++

C++ Modeling Language est tout dabord un langage de conception logicielle et de programmation visuelle ; enfant spirituel du diagramme de classes de lUML, il implmente lintgralit des concepts propres au C++. Mais le terme C++ML dsigne aussi un diteur graphique, permettant de modliser aisment ses conceptions.

e projet a vu le jour Epitech, au cours de la scolarit de 7 grands amateurs de C++, qui eurent lide de crer un langage de modlisation propre au C++. Dans le cadre des Epitech Innovative Project, ils se sont appliqus concevoir un langage graphique, voluant paralllement aux standards C++ ; le dernier en date tant le C++11. Dsormais, la version draft de C++ML est entirement rdige, et lditeur est disponible en version bta.

Fig.1

Fig.2

Contexte
De nombreux dveloppeurs utilisent lUML pour les aider lors de la conception de leurs projets, ou pour documenter du code dj crit. Bien que trs puissant, lUML est prvu pour de la programmation oriente objet, mais pas pour reprsenter les autres paradigmes prsents en C++, notamment toute la surcouche ajoute par les templates. En effet, reprsenter une classe recevant un paramtre template est simple dans un diagramme de classes UML, mais il est impossible de dfinir des liaisons avec ce mme paramtre template. De nombreux autres cas de figures posent de vrais problmes en UML. Il devient alors difficile de prsenter des conceptions C++ complexes dans un diagramme de classes UML, sans y ajouter des annotations. Et malheureusement, dans ce cas-l, le dveloppeur passe ct de toute gnration de code. Le snippet de code numro 1 donne un exemple de code C++ somme toute assez simple, mais nanmoins trs ardu reprsenter en UML. La [Fig.1] reprsente ce code en C++ML.

Fig.3

tent la fonction globale TerraformedPlanet Terraform(Planet); . On peut aussi spcifier la visibilit dune liaison dhritage, via ladjonction en bas de la hampe de la liaison dhritage dun rectangle en pointill contenant directement la visibilit en question {public, protected ou private} ou respectivement {+, # ou -}. Les fonctions et donnes sont maintenant spcifies sous leur syntaxe C++, dans une question de cohrence avec ce dernier. C++11 fait partie intgrante de C++ML, avec le support, entre autres, des templates variadiques ou des numrations fortement types, gres quant elles, sous la forme dun enum agrg dune classe. Le support de certaines fonctionnalits faisant partie des versions C++ venir (les concepts par exemple) est dj implment.

dessins avec des traits pointills entrecoups de points (trait, point, trait point, ...). Un ensemble de modifications mineures a aussi t appliqu lUML, afin davoir une cohrence entre C++ML et la syntaxe du C++. Les reprsentations de mta-informations sont les suivantes : 1 mta-classificateur 5 mta-liaisons - la mta-liaison (a comme) paramtre template - la mta-liaison (est une) spcialisation de template (de la classe) - la mta-liaison (a comme) paramtre spcialisant - la mta-liaison composition de type - la mta-liaison friendship Le snippet 2 et la [Fig.2] reprsentent une classe Templated template sur 2 paramtres T et U. Les autres changements concernent notamment lajout dun type au sommet de chaque classificateur ; afin de pouvoir faire la diffrence entre class, struct et union par exemple. La reprsentation de fonctions globales est maintenant possible via lcriture dun classificateur avec comme type celui de la fonction. La [Fig.3] et le snippet 3 reprsen-

> Lditeur
Un diteur crit en C++, est dj disponible en bta. Le but est quil soit accessible librement tous, et cest pour cela quil sera distribu sous une licence trs permissive : new BSD. La portabilit est un point important, pour quun maximum de dveloppeurs ait accs au logiciel, il doit pouvoir tourner sous le plus grand panel darchitectures possible. Linterface graphique est abstraite pour permettre lutilisateur dutiliser autre chose que limplmentation Qt fournie par dfaut, qui pourrait ne pas lui convenir. Cet diteur permettra la gnration de code C++ partir dun diagramme, et inversement, pourra passer dun code C++ un diagramme. Il sera interfaable avec la plupart des IDE et logiciels existants, afin de ne pas perturber les habitudes de travail des dveloppeurs. Site officiel du projet : http://cplusplusml.org. Remerciement M. Franois Carrubba. # Nicolas Albeza, Matthieu Cholley, Romain Gay, Laurent Humez, Pierre-Yves Le Borgne, Jrmy Lecerf et Tony Tanon tudiants en 5e anne Epitech

Le langage
C++ML est bas sur le diagramme de classe UML, la plupart des lments prsents en UML sont rutilisables en C++ML. Cependant, les mta-informations apportes par les templates sont reprsentes par lajout dun nouveau type de classificateurs et dun nouveau type de liaisons : les mta-classificateurs et les mta-liaisons. Ces derniers sont

PROgrammez !

< 11 >

JANVIER

2013

i ressources
communauts

Lancement russi dAgile.Net France

Une nouvelle communaut agile / ALM vient dtre lance. Le 3 dcembre dernier, Agile .Net France a officiellement tenu sa premire runion. Cette association but non lucratif dont lobjet est la promotion des mthodologies agiles dans les environnements Microsoft en France, a t cre dbut Septembre par Arnaud Hego et Luc Legardeur, respectivement Prsident et Directeur Gnral de Cellenza (Luc tant galement le fondateur du French Scrum User Group) et a reu le soutien dun parrain de prestige en la personne de Jeff Sutherland, le pre fondateur de la mtho-

de Scrum, lui aussi prsent lors de la soire. Cette initiative est ne du constat que de nombreuses initiatives associatives et/ou communautaires existaient en France autour de lagilit et autour des technologies Microsoft, mais quaucune ne russissait le mariage des deux jusque-l ! Pourtant il y avait une attente relle , nous explique Arnaud Hego. Pour en savoir plus : www.agiledotnetfrance.org

GDG Nantes : cest quoi une communaut dveloppeur Google ?

Les Google Developers Groups (GDG) sont des groupes dutilisateurs intresss par les technologies de dveloppement Google; Tout, depuis les plateformes Android et App Engine, jusquau API des produits Google comme YouTube et le Google Calendar, et galement jusquaux initiatives comme OpenSocial. Un GDG peut prendre de nombreuses formes... Depuis quelques personnes se rassemblant pour regarder les

dernires vidos de Google, de larges confrences avec des dmonstrations et des prsentations, ou encore des vnements de codage tels les hackathons. Le GDG de Nantes est n de lenvie de prsenter, dexpliquer et de fdrer les dveloppeurs autour des outils et technologies Google dans la rgion nantaise. Lactivit principale du GDG Nantes consiste organiser des vnements (confrences, forums, tables rondes, ateliers...) autour des technologies Google. Il est prvu dorganiser des vnements en soire ( partir de 18h) proposant un sujet de confrence dune dure de 90 minutes. Ces soires sont cltures par un buffet qui permet aux participants de se rencontrer et de discuter librement. Le GBG souhaite aussi organiser des bar-camp. Pour en savoir plus : http :gdgnantes.com

Fvrier 2013
Fosdem (Bruxeles) l
En quelques annes, le FOSDEM est devenu lvnement open source et du logiciel libre incontournable en Europe. Toujours organis Bruxelles, la confrence rassemble plus de 5000 personnes, 400 sessions. A lheure o nous bouclons le magazine, le programme ntait pas encore disponible. Site : https://fosdem.org

Bl ackBerry Jam 2013 (Amsterdam)

RIM organise une nouvelle tourne mondiale pour les dveloppeurs : BlackBerry Jam. En Europe, elle aura lieu du 5 au 6 fvrier 2013 Amsterdam, quelques jours seulement aprs la prsentation officielle de Blackberry 10. La confrence a pour objectif dexpliquer, prsenter lensemble de la nouvelle plateforme, les premiers terminaux. De nombreuses sessions techniques seront joues. Vous pourrez rencontrer les ingnieurs RIM et changer avec dautres dveloppeurs BlackBerry. Site : http://www.blackberryjamconference.com/europe

M icrosoft TechDays 2013 (Paris)

Du 12 au 14 fvrier, au Palais des Congrs de Paris, la grandmesse des technologies Microsoft se droulera sous le signe de Windows 8, Windows Phone 8, Windows Server 2012, Windows Azure, etc. Comme chaque anne, les 3 sessions plnires seront thmatiques : dveloppeur, IT Pro et innovation technologique. Plus de 300 sessions, sur plusieurs dizaines de thmes, seront disponibles ainsi que de trs nombreux partenaires dans la partie exposition. Vous pouvez ds maintenant vous inscrire (gratuitement) et organiser votre agenda ! Site officiel : http://www.microsoft.com/france/mstechdays/ PROgrammez !

Agenda
f JANVIER Le 24 janvier 2013, CNIT Paris La Dfense, Salon Lesjeudis.com. Plus dune trentaine de recruteurs seront prsents. www.lesjeudis.com f FVRIER Le 12 fvrier 2013, CNIT Paris La Dfense, NIDays 2013, ddi cette anne, la conception, au test et au contrle : http://france.ni.com/nidays f ETRANGER Du 23 au 25 janvier 2013, Rome, 40e colloque sur les principes des langages de programmation. Forum de discussion sur tous les aspects des langages et des systmes de programmation. http://popl.mpi-sws.org/2013/
2013

< 12 >

JANVIER

i dveloppeur du mois

De W argame XAM L: les multiples vies dun geekdveloppeur

Samuel Blanchard est responsable du dveloppement et de linnovation chez Naviso, une socit spcialise dans les solutions de gestions innovantes et le dveloppement, mais cest avant tout un dveloppeur passionn du Web et de lembarqu. Modrateur de forums et rdacteur de blogs, Samuel sintresse principalement aux communauts Microsoft et plus prcisment Windows Phone et Windows 8. Il est MVP Windows Phone.
Comment es-tu tomb dans l'informatique et plus spcialement dans le dveloppement ? Je suis tomb en amour de linformatique plusieurs fois dans ma vie. La premire, lorsque je tapotais sur mon minitel en me prenant pour le hros du film Wargame. Atari et Amiga sont ensuite devenus mes jouets de prdilection. La seconde fois, quand jai dcouvert que lon pouvait dvelopper des jeux pour Gameboy en assembleur et en C. La troisime, lorsque jai appris le XAML. Je reste encore merveill par le potentiel de ce langage. Par exemple, sa capacit changer compltement lapparence de ses contrles sans changer leur fonctionnalit premire est un rve pour celui qui dveloppe des interfaces utilisateurs. Bref, limportant est de prserver lenvie et cela ne peut se faire quen restant curieux. Pour toi, qu'est-ce qui fait que l'on aime toujours et encore le dveloppement, la technique ?

Le renouvellement. Lorsque lon passe plusieurs annes sur la mme technologie, on devient souvent un expert mais lon suse rpondre aux mmes questions, aux mmes problmatiques. Il est donc important de changer de technologie rgulirement pour ne pas rentrer dans une certaine routine. Cest la beaut de ce mtier. Lchange est aussi un facteur important pour partager sa passion et ne pas rester prisonnier de son expertise. Participer des communauts techniques est un bon moyen de conserver la flamme. A la fois pour aider les dveloppeurs junior mais aussi pour apprendre de nouvelles techniques, de nouvelles faons de voir. Tu as gard un regard trs geek : gadget, veille techno. Cest important pour ton job et ta passion ? Oui cest important. Plus jeune je voulais dvelopper des jeux vido sur consoles. Ds quont mergs des kits de dveloppement pour Gameboy je me suis mis au travail. Jai cr un jeu, Crazy Zone, pour participer un concours que jai remport. Ce jeu sest retrouv par la suite intgr pendant quelque temps dans les FreeBox qui disposaient alors dun mulateur Gameboy.

Mon bureau
Je travaille dans un bureau ouvert o je suis en relation constante avec mon quipe. Jai eu plusieurs fois la possibilit de travailler dans un bureau ferm mais je pense que la proximit avec ses quipes est une chose importante aussi bien socialement que techniquement. La musique mest indispensable pour pouvoir me concentrer sur un projet de dveloppement. Je ncoute pratiquement que des musiques de films. Mes couteurs sont branchs en permanence sur mon ordinateur, ce qui me permet de pouvoir misoler ds que je le souhaite sans forcment changer de bureau. Mon bureau en lui-mme est constitu dun ensemble dcrans et de machines dont la place varie selon la priorit du moment. Ces derniers mois, mon Windows Phone et ma tablette Win8 sont au centre de mes intrts.

Aujourdhui cette passion pour la petite console de Nintendo ne ma pas quitt puisque je dveloppe un mulateur Gameboy Color sur Windows Phone (Purple Cherry). Tout cela ma appris des techniques doptimisation que jintgre dans mes ralisations professionnelles et que je communique mes quipes et par le biais de mon blog.

PROgrammez !

< 16 >

JANVIER

2013

i dveloppeur du mois
La veille techno fait partie intgrante de mon travail et me permet de dtecter les technologies qui pourrait intresser Naviso. Elles se retrouveront ensuite dans les applications de nos clients ou seront abordes lors de confrences telles que les Techdays ou des BarCamps. Etre dveloppeur n'est pas toujours facile : pression, volution constante, frustration des projets et des "chefs", c'est quoi pour toi tre dveloppeur aujourd'hui ? Le job at-il chang depuis tes dbuts ? Oui il a chang. Plutt en bien dailleurs. La pnurie de dveloppeurs en France fait que lon ne nous considre plus comme des barbus chapps dun garage. Cest un poste de plus en plus important dans lentreprise et bien que nous ne soyons pas au niveau des amricains puisquil est toujours ncessaire de manager pour grimper dans la hirarchie les mentalits voluent rapidement. Fiers dtre dveloppeurs est un leitmotiv qui me tient cur. La pression et ladaptation aux nouvelles technologies sont inhrentes au poste, mais heureusement elles sont grables tant que lon reste organis. Et en dehors du boulot, qu'est-ce que tu aimes faire ? Comment trouves-tu l'quilibre entre travail, vie prive, passion, famille ? Jaime le cinma, courir, mais comme tout bon passionn qui se respecte je continue de dvelopper des applications sur mon temps libre. Pour que cela puisse fonctionner au quotidien, il est important que la passion ne dborde pas sur les moments familiaux. Jai la chance de pouvoir lexercer au sein de mon entreprise, Naviso, mais aussi, de la partager avec certains amis. Jessaie, nanmoins, de ne pas menfermer dans cette passion et de conserver un lien avec des amis dont les centres dintrts sont aux antipodes des miens. Jai la chance davoir une compagne, une famille et des proches qui mouvrent leurs propres centres dintrt. De la richesse de nos changes naissent aussi, parfois, de nouvelles ides dapplications. Lquilibre, mme sil est parfois difficile trouver, demande, de part et dautre, de la comprhension, mais aussi de la disponibilit et des moments de partage. Montrer le fruit de mes rflexions et de mon travail mes proches leur permet de mieux comprendre mon implication, parfois dvorante, dans mes projets. A ce jour, je crois pouvoir dire que jai trouv lquilibre que je recherchais. Peux-tu nous prsenter ton quotidien en quelques mots ? Mon travail consiste tout dabord grer une quipe de dveloppement et les projets qui lui sont affilis. Nous travaillons sur plusieurs portails extranets utiliss par des centaines de personnes au quotidien. Nous restons concentrs sur le dveloppement de nouveaux modules mais galement sur lamlioration et lvolution de modules dj mis en place. Cela demande de couvrir dautres comptences que le mtier de dveloppeur. Ainsi, il nest pas rare que nous appelions les clients pour obtenir des informations complmentaires sur des problmes quils pourraient rencontrer, ou que nous devions installer nos applications et leurs composants sur nos serveurs. Je reste galement en alerte sur les technologies en devenir et je mets en place des projets utilisant les plus prometteuses afin den dterminer le potentiel rel. Je prends aussi du temps dans la semaine pour grer mon blog (http://blog.naviso.fr), forums, communauts, et autres pages Facebook. Je suis prsent particulirement sur des forums consacrs Windows Phone. Comment vois-tu ton job voluer ? Mon job a volu dernirement pour prendre en compte une dimension dinnovation qui me tient particulirement cur. A terme, le management des quipes seffacera peut-tre, au profit de lorientation innovation et dveloppement. Cette volution est, je pense, lie au changement de mentalit concernant les dveloppeurs et ce quils peuvent apporter lentreprise. Mon job va aussi voluer par le biais des opportunits que mon entreprise, ellemme, cre pour lquipe de dveloppeurs. Les clients de Naviso, essentiellement des entreprises que nous quipons en logiciels de gestion, nous sollicitent chaque jour davantage pour raliser des dveloppements spcifiques, des applications sur mesure pour PC, tablette ou tlphone. De fait, le ple dveloppement que je supervise prend de limportance et devient un levier de croissance pour Naviso. Des conseils aux tudiants et devs qui nous lisent ? Depuis quelques annes, les communauts de dveloppeurs, chacune experte dans son domaine ou sa technologie, sont devenues incontournables. Grce elles, notre travail est devenu plus collaboratif, lautoformation facile et perptuelle. La nouvelle gnration de dveloppeurs a ce reflexe communautaire et doit tre consciente de la force que cela lui confre. Apprendre des autres, mais aussi diffuser son savoir, son expertise sont des atouts dont peu de communauts peuvent se prvaloir. Pour progresser rapidement il faut avoir des objectifs dfinis. Mme si ceux-ci semblent ambitieux, ne vous dcouragez pas. Certains de mes projets ont mis plusieurs annes se concrtiser. Il faut simplement ne pas avoir peur de les mettre de ct pour les reprendre plus tard avec une vision diffrente et plus mature. #

Toi aussi, parle de ton mtier de dveloppeur ! Contact : ftonic@programmez.com

Linformation permanente
la synthse des informations indispensables.

Lactu de Programmez.com : le fil dinfo quotidien La newsletter hebdo :

Abonnez-vous, cest gratuit ! www.programmez.com < 17 >

PROgrammez !

JANVIER

i matriel

Scuriser et protger votre matriel inf ormatique

Les vols dordinateurs (notamment portables), de smartphones explosent depuis quelques annes. Il existe plusieurs solutions, souvent complmentaires, pour scuriser et protger votre matriel. Nous vous proposons quelques ides rapides mettre en place.

es protections sont de diffrentes natures : physiques (cbles de scurit, cl chiffre, tatouages, accs biomtrique, etc.) ou non (assurances, effacement distance). Aucune solution nest efficace 100 % et parfois, cela peut se retourner contre vous. En aot dernier, un journaliste informatique amricain a connu une cruelle msaventure : un hacker avait russi pntrer ses comptes Gmail, iCloud, Amazon, suites des failles dans les procdures dauthentification, notamment par tlphone

Avantages :
standard diversit des cbles dissuasion visuelle

Portables . Mais attention : vrifiez bien la franchise, les plafonds imposs (par exemple : limite de 400 pour un smartphone).

Inconvnients :
prix parfois lev des kits de scurit pas prsent sur tous les matriels (surtout sur les ultrabook, les tablettes) nempche pas le vol : il le ralentit seulement. Assez tonnant, le constructeur Devolo quipe certaines gammes CPL dune encoche Kensington !

> Utiliser les services de golocalisation

Parfois, on peut tre un peu tourdi et garer son portable ou un smartphone. Certains diteurs / constructeurs proposent, en standard, un service de golocalisation des terminaux. Windows Phone 8 propose la fonction mon tlphone pour localiser, verrouiller, effacer son smartphone. Apple propose depuis plus de 18 mois la fonction localisation via le service iCloud. Il permet de localiser, verrouiller et effacer un iPhone, iPad, un Mac. Cependant, attention. Assurez-vous que votre mot de passe de localisation soit assez compliqu et fort pour viter tout piratage de votre service. Dautre part, quand cela est autoris par le systme, interdisez toute modification de configuration de localisation sur le terminal, sans taper un mot de passe. Car aprs, rien de plus de simple que deffacer distance le contenu de votre machine ou tlphone ! # Franois Tonic

> Tatouage et assurance

Le tatouage consiste apposer (ou par technique de gravure) sur un matriel une plaque didentification, trs difficilement retirable pour un voleur. Via un logiciel install sur la machine, la socit gestionnaire du tatouage rcolte alors lensemble des numros de sries permettant un suivi du matriel en cas de vol ou de perte, avec localisation et transmission des informations la police. Parfois, une assurance vol est incluse dans le contrat de tatouage. Ct assurance, il existe de nombreuses offres contre le vol et la perte. Par exemple, LCL propose Assurance Tous

> Le verrou antivol de type Kensington

Une des scurits les plus basiques est le verrou antivol Kensington que lon retrouve sur de nombreux ordinateurs et priphriques (notamment sur les NAS). Cet antivol se prsente sous la forme dune petite encoche rectangulaire permettant de fixer un verrou, un cble compatible. En cas de vol, ou de tentative, si le voleur arrache de force lantivol, le botier sera endommag et donc parfaitement visible. Bien entendu, cela nempchera jamais le vol mais cela peut dissuader et surtout ralentir le voleur. Les cbles Kensington sont assez rsistants. Ne pas oublier denrouler le cble au bureau, chaise, etc. (si le cble nest pas fix quelque chose, quoi sert-il ?).

Pour aler pl l us
Pour scuriser un peu plus votre machine, vous pouvez opter pour une authentification biomtrique. Il existe quelques claviers intgrant une lecture dempreinte digitale comme chez Lenovo ou Cherry, mais cela reste encore rare et pas toujours trs bon march. Des lecteurs indpendants peuvent tre utiliss (ex. : Eikon). Quelques constructeurs intgrent par dfaut un tel lecteur sur les portables (Acer, Lenovo, HP) mais essentiellement sur les gammes professionnelles. Vous pouvez aussi utiliser des cls USB, ou des disques crypts pour augmenter la scurit de vos donnes. Automatiquement, toutes les donnes stockes sur la cl seront chiffres (256 bits le plus souvent). Mais attention : assurez-vous de la fiabilit de la cl (la corruption de donnes peut rapidement rendre inaccessible vos fichiers). Vous pouvez aussi utiliser des disques ou des SSD crypts par dfaut. Bmol : le prix souvent lev de ces solutions.

PROgrammez !

< 18 >

JANVIER

2013

i outils

M eetup SkySQL Paris :Cloud,M ySQL,M ariaDB

La communaut des utilisateurs professionnels de MySQL s'est retrouve Paris, le 13 dcembre dernier, dans une ambiance tropicale pour envisager le futur de MySQL, linvitation de SkySQL. L'objectif tait d'aborder les volutions de MySQL, MariaDB, et le Cloud.

e message de SkySQL, qui repose sur son exprience terrain chez les clients, permet une adoption plus rapide de MariaDB. Serge Frezefond, ingnieur consultant SkySQL a prsent ainsi au meet-up les avantages d'un passage rapide MariaDB : Si vous avez des soucis de performances avec MySQL 5.5, essayez MariaDB 5.5 vous serez surpris ! Rappelons que MariaDB 5.5 est totalement compatible avec MySQL 5.5, notamment car il est crit par la core team originelle, avec des nouveauts et des optimisations de performances laissant loin derrire le MySQL d'Oracle.

> Fondation MariaDB, l'avenir open-source de MySQL

Aprs les dboires de rachats multiples du serveur de bases de donnes le plus utilis au monde, MySQL a fini entre les mains d'Oracle. Ce dernier multiplie les sparations fortes entre le core Open-Source du serveur et de nouvelles extensions propritaires. Le changement de licence par rapport Sun a emprisonn les entreprises clientes en obligeant la dsinstallation de MySQL si le contrat de support n'est plus contract. Autant de raisons et de craintes, qui comme pour OpenOffice ont pouss les dveloppeurs et leaders de ces projets faire un fork. A l'instar de LibreOffice, digne successeur d'OpenOffice aujourd'hui structur dans The Document Foundation , ou encore de la plus connue des fondations, celle de Mozilla (qui dite le navigateur Firefox, le client mail Thunderbird et le prochain Firefox OS), MariaDB le fork de MySQL s'organise aussi en fondation, par la volont de son crateur Monty Widenius, afin de lui garantir un dveloppement perenne. Cette annonce est un signe for t destination des utilisateurs de MySQL sur l'avenir de leurs bases de donnes. Pour une grande majorit des entreprises, ce SGBD est devenu stratgique pour leurs dveloppements et il est inconcevable de tomber dans le giron

d'une entreprise qui ne permette pas de garantir le bon fonctionnement et les volutions futures. Notamment, car la base de donnes a t choisie pour son modle Open Source. Les trois acteurs l'initiative de la fondation sont : Monty Program Ab qui regroupe une trs grande partie des dveloppeurs MySQL dmissionnaires suite au rachat par Oracle, SkySQL qui regroupe les consultants et experts l'poque de MySQL Ab, et Percona dont les quipes sont l'origine du moteur de stockage InnoDB rachet par Oracle et qui ont fait leur propre fork de MySQL. Ces trois acteurs vont faire les bases de la fondation en attendant la constitution d'un premier bureau. La fondation se voit soutenue financirement (actuellement 1 million d'euros) par plusieurs sponsors, principalement des entreprises clientes de MySQL, souhaitant un modle de dveloppement libre pour leurs bases de donnes.

Si toutes les conditions sont runies pour faire de MariaDB le nouveau MySQL, il faut nanmoins composer avec une diffrence de planning lie aux utilisateurs de MySQL. En effet si les dernires versions des systmes d'exploitation ont remplac OpenOffice par LibreOffice, les utilisateurs de MySQL ont un rythme de changement de version plus lent qui se compte en annes. Il est pratiquement acquis que les prochaines versions des OS intgreront MariaDB 5.5 en remplacement de MySQL, mais il faudra sans doute plusieurs annes pour voir les entreprises mettre jour leurs serveurs de bases de donnes. Actuellement, la grande majorit utilise encore la version 5.1, la v5.5 tant rserve aux nouveaux projets ou aux entreprises dsireuses de bnficier des dernires avances. Rappelons que MariaDB 5.5 est totalement compatible avec MySQL 5.5, tout en apportant des nouveauts et des optimisations de performances laissant loin derrire MySQL. Pour ceux qui souhaitent prvoir leur migration ou utiliser MariaDB pour de nouveaux projets, sachez que les fichiers de configuration et les binaires / utilitaires portent les mmes noms que sur MySQL par Oracle. Cela n'aura donc aucun impact sur vos outils de dploiements / scripts.

M ariaDB facil ite l travaildes sysadms e

SkySQL a prsent de son ct SkySQL Enterprise Data Suite regroupant diffrents outils d'aide aux utilisateurs et aux administrateurs comme la supervision avance, l'anticipation de problmes, la synchronisation automatique des bases et la resynchronisation en cas d'incident. On notera aussi l'arrive de SkySQL Cloud Data Suite qui permet un dploiement automatis d'une architecture MariaDB sur Amazon EC2.

Ressources :
http://mariadb.org/ MariaDB https://kb.askmonty.org/en/ KnowledgeBase MariaDB http://www.skysql.com/ SkySQL http://config.skysql.com/ Cloud Data Suite http://www.skysql.com/enterprise Enterprise Data Suite # Pierre-Henry Muller Fondateur et dirigeant de DigDeo (www.digdeo.fr) entreprise d'infogrance / hbergement et d'expertise sur les logiciels Open-Source. Dans le cadre de l'optimisation des serveurs web pour la haute performance, DigDeo a remplac avec succs Oracle MySQL par MariaDB dans le cadre de l'accompagnement propos ses clients.

PROgrammez !

< 19 >

JANVIER

2013

i outils

Neo4j:lautre univers du stockage

Lunivers du stockage de donnes sur le web a beaucoup volu depuis une dizaine dannes. Des fichiers textes prhistoriques, le stockage a rapidement volu vers les bases de donnes relationnelles de type MySQL ou PostgreSQL. Les annes 2000 ont cependant boulevers cette hgmonie en propulsant le concept NoSQL sur le devant de la scne.

apparition de produits tels que CoucheDb, Redis, MongoDB, Memcache fut une vritable rvolution dans lunivers du dveloppement web : le relationnel ntait plus seul et pouvait intelligemment tre second par dautres technologies plus optimales pour certains usages (Facebook est un exemple typique dun gant du web dont linfrastructure repose autant sur le SQL que sur le NoSQL). Un choix pertinent dune infrastructure de stockage fait dsormais partie intgrante des prrogatives dun architecte logiciel.

notamment dans le cadre des rseaux sociaux : chaque membre dispose damis qui sont eux-mmes en relation avec dautres damis. Plus globalement, le rseau internet est un gigantesque graphe o chaque appareil est reli dautres par des connexions (cbles, fibres).

> Dveloppement
Les sites web offrant toujours plus de fonctionnalits innovantes, il nest pas rare quun dveloppeur, en cherchant structurer ses donnes, se retrouve devoir manipuler un graphe. Un dveloppeur non initi aura tendance envisager une implmentation reposant sur les bases de donnes et le SQL . Lutilisation dune table nud dorigine nud de destination allie des procdures stockes peut donner lillusion dune solution adapte. Aussi intelligentes soient-elles, ces implmentations ne parviendront jamais assurer une scalabilit suffisante, partir du moment o le graphe comportera plusieurs milliers de nuds. Les algorithmes mis en uvre pour manipuler les graphes sont spcifiques et ncessitent des connaissances expertes dans des domaines trs pointus des mathmatiques. Compte-tenu de ce besoin, Neo a cr une solution spcifique pour venir en aide aux dveloppeurs.

> Graphe
Un graphe est un objet informatique appartenant la famille des structures de donnes. Ces dernires constituent les objets lmentaires manipuls par les algorithmes ; en choisissant une structure de donnes adapte, le dveloppeur aura dautant de plus chances dapporter une rponse optimale au problme rsoudre. Etre en mesure de reconnatre une structure de donnes est par consquent essentiel pour un dveloppeur. Certaines structures sont plus simples apprhender que dautres. Dans le cadre dune structure de Fig.1 type liste , tout lment ne peut tre reli qu un seul autre lment [Fig.1]. La structure d arbre est plus complexe ; chaque lment peut Fig.2 avoir plusieurs descendants. On parle alors de fils relis par des arrtes un pre . Cette structure est notamment utilise dans le domaine de la compression de donnes et de la compilation [Fig.2]. Toute complexe quelle soit, la structure darbre reste cependant triviale Fig.3 face au plus redoutable des objets informatiques : le graphe. Dans le cadre dun graphe, chaque lment est reli un ou plusieurs autres lments. On parle alors de nuds relis par des arcs [Fig.3]. Dapparence simple, ces graphes se rvlent tre des objets terriblement coriaces auxquels sont lis certains problmes mathmatiques parmi les plus complexes.

> Neo4j
Le serveur Neo4j permet de stocker vos donnes sous la forme dun graphe. En plus de sa rapidit, de sa richesse fonctionnelle et de sa stabilit, Neo4j a lavantage dtre particulirement scalable : grer des milliards de nuds et darcs ne lui fait absolument pas peur. Autre aspect important, Neo4j gre de faon native la haute disponibilit et la redondance. Ces fonctionnalits se rvlent particulirement sduisantes pour les socits dont le cur dactivit repose sur un graphe. A ce titre, Viadeo, rseau professionnel franais, a slectionn Neo4j pour stocker les relations entre ses membres. Open-source et gratuit, le serveur Neo4j est disponible sur neo4j.org. Ecrit en Java, il est disponible sur les principaux OS tels que Windows, Linux et OS X. Cette dernire plateforme sera notre plateforme de rfrence dans le reste de larticle. Soutenu par une socit commerciale (vendant du support et du conseil), le projet Neo4j profite la fois de dveloppeurs ddis et dune communaut trs active sur les forums et listes de diffusion. Autre lment non ngligeable pour un dveloppeur, la documentation de Neo4j disponible en ligne (http://docs.neo4j.org/pdf/neo4j-manual1.7.pdf) se rvle particulirement jour et complte.

> Usage
Sans que nous en ayons toujours conscience, les graphes font partie intgrante de notre vie quotidienne. Un plan de mtro peut tre assimil un graphe, chaque station tant relie une ou plusieurs autres. Notre vie digitale profite galement de ce concept,

PROgrammez !

< 20 >

JANVIER

2013

i outils
> Installation
Neo4j est distribu sous forme darchive. Une fois larborescence extraite (ex. tar zxvf neo4j-community-1.7.2-unix.tar.gz), le serveur est dmarr en se plaant dans le rpertoire bin et en excutant la commande neo4j start. Lautre rpertoire important est data ; il contient les donnes du graphe (data/graph.db et data/keystore) ainsi que les journaux (data/log) [Fig.4]. Le serveur coute sur le port 7474. Il est possible de sassurer que le serveur est bien dmarr en accdant lurl http://localhost:7474. Ce site permet de superviser ltat du graphe et offre diffrents outils prsents dans la suite de larticle [Fig.5]. /1/relationships/all/{-list|&|types}, property : http://localhost:7474/db/data/node/1/properties /{key}, self : http://localhost:7474/db/data/node/1, properties : http://localhost:7474/db/data/node/1/properties, outgoing_typed_relationships : http://localhost:7474/db/data /node/1/relationships/out/{-list|&|types}, incoming_relationships : http://localhost:7474/db/data/node /1/relationships/in, extensions : {}, create_relationship : http://localhost:7474/db/data/node/1 /relationships, paged_traverse : http://localhost:7474/db/data/node/1/paged/ traverse/{returnType}{?pageSize,leaseTime}, all_relationships : http://localhost:7474/db/data/node/1/ relationships/all, incoming_typed_relationships : http://localhost:7474/db/data /node/1/relationships/in/{-list|&|types} } Lattribut self (http://localhost:7474/db/data/node/1) est particulirement intressant : il sagit de la rfrence au nud. La valeur 1 situe la fin de lurl correspond lidentifiant numrique unique du nud au sein du graphe. Dautres attributs indiquent les url disponibles pour accder aux diffrentes caractristiques (proprits, arcs, chemins) du nud. A titre dexemple, lurl http://localhost:7474/db/data/ node/1/properties donne accs toutes les proprits ; http://localhost:7474/db/data/ node/1/properties/nom ne retourne, quant elle, que la valeur de la proprit nom. > curl http://localhost:7474/db/data/node/1/properties/nom paul > curl -X POST -d {nom:paul} -H Content-Type:application /json http://localhost:7474/db/data/node La structure JSON retourne correspond une reprsentation du nud cr. { outgoing_relationships : http://localhost:7474/db/data/node/ 1/relationships/out, data : {nom : paul}, traverse : http://localhost:7474/db/data/node/1/traverse/ {returnType}, all_typed_relationships : http://localhost:7474/db/data/node
Fig.5 Fig.6 Fig.4

> Communication
Communiquer avec le serveur Neo4j peut tre ralis par diffrents biais. La manire la plus naturelle consiste exploiter les librairies Java livres avec le serveur (dans le rpertoire lib). Les dveloppeurs ne souhaitant pas utiliser Java peuvent accder un large panel de fonctionnalits de lAPI par lintermdiaire de web services. Il devient alors possible de transmettre ses requtes au serveur avec son langage de prdilection (en concevant une simple passerelle HTTP). Les web services fonctionnent en mode REST et utilisent le format JSON pour les changes. Tous les appels web services sont bass sur lurl suivant : http://localhost:7474/db/data. Par ailleurs, un accs cette url racine retourne diffrentes informations sur le serveur (version, extensions disponibles, etc.) [Fig.6].

> Nuds
Comme souvent dans une architecture REST, les web services Neo4j exploitent les diffrentes mthodes proposes par le protocole HTTP : GET pour la lecture de donnes, POST pour laltration (cration/mise jour) et DELETE pour la suppression. La cration dun nud disposant de la proprit nom=paul est ralise de la manire suivante :

PROgrammez !

< 21 >

JANVIER

2013

i outils
>Arcs
La cration dun arc entre deux nuds est ralise en ajoutant un nouvel arc la liste des arcs de lun dentre eux. Les arcs du nud 1 sont reprsents par lurl suivante http://localhost:7474/db /data/node/1/relashionships. Deux paramtres doivent tre transmis : le nud cible prcis avec le paramtre to, et le type de larc. La requte ci-dessous relie le nud 1 au nud 2 par la relation X connat Y . > curl -X POST -d {to:http://localhost:7474/db/data/node/ 2, type: connait} -H Content-Type:application/json http: //localhost:7474/db/data/node/1/relationships { start : http://localhost:7474/db/data/node/1, data : {}, self : http://localhost:7474/db/data/relationship/0, property : http://localhost:7474/db/data/relationship/0/ properties/{key}, properties : http://localhost:7474/db/data/relationship/ 0/properties, type : connait, extensions : {}, end : http://localhost:7474/db/data/node/2 } Cette souplesse vis--vis du typage des arcs offre la possibilit de crer un rseau social (type X est ami avec Y ) aussi simplement quun rseau professionnel de type Linkedin (type X collabore avec Y ). Il est galement possible de faire coexister diffrents types darcs au sein dun mme graphe. Il devient alors possible de crer des graphes modlisant des connaissances plus vastes. Il sagit prcisment dun sujet majeur sur lequel travaillent des socits telles que Google et Facebook. Quil sagisse de lOpen Graph ou du Knowledge Graph, ces graphes cherchent contenir une reprsentation universelle du savoir. Il convient de noter que la rubrique Data browser du site permet de visualiser la structure du graphe (un paramtrage est ncessaire pour slectionner les informations afficher au niveau des nuds) [Fig.7]. Le graphe prsent dans la [Fig.7] est celui utilis pour illustrer les prochains exemples.
Fig.7

> Chemins et distance

Ajout de nuds et cration darcs correspondent aux oprations de base qui permettent de construire un graphe. Lintrt de Neo4j se situe cependant ailleurs. La vritable complexit lie aux graphes rside dans les oprations mettant en uvre les chemins entre les nuds (il ne faut jamais oublier que les boucles , source majeure de complexit, sont des phnomnes courants dans les graphes). La distance entre deux nuds est une information particulirement intressante dans le cadre dun rseau social. Cette valeur est obtenue en cherchant le plus court chemin entre ces deux nuds. Les chemins entre nuds sont obtenus avec le web service http://localhost:7474/db/data/node/<ID_NOEUD>/paths Les paramtres transmettre sont les suivants : to : correspond au nud de destination algorithm : nom de lalgorithme de parcours max_depth : longueur maximale du chemin relationships[type] : type darcs relationships[direction] : lorsque la valeur all est prcise, le sens des arcs nimporte pas > curl -d {to:http://localhost:7474/db/data/node/4, algorithm :shortestPath, max_depth:4, relationships:{type: connait, direction:all}} -H Content-Type:application/json http:// localhost:7474/db/data/node/1/paths [ { start : http://localhost:7474/db/data/node/1, nodes : [http://localhost:7474/db/data/node/1, http://localhost:7474/db/data/node/2, http://localhost:7474/db/data/node/4], length : 2, relationships : [ http://localhost:7474/db/data/relationship/ 0, http://localhost:7474/db/data/relationship/2 ], end : http://localhost:7474/db/data/node/4 }, { start : http://localhost:7474/db/data/node/1, nodes : [http://localhost:7474/db/data/node/1, http://localhost:7474/db/data/node/5, http://localhost:7474/db/data/node/4], length : 2, relationships : [ http://localhost:7474/db/data/relationship/ 5, http://localhost:7474/db/data/relationship/4 ], end : http://localhost:7474/db/data/node/4 } ] La rponse ce type dappel contient un tableau dont chaque cellule reprsente un chemin reliant Paul Jacques. Les nuds constituant chacun des chemins sont regroups au sein de la cellule nodes Paul (1) > Pierre (2) > Jacques (4) Paul (1) > Luc (5) > Jacques (4) La distance entre Paul et Jacques (gale 2) est obtenue en accdant la cellule length associe au premier lment du tableau rponse. Nous sommes srs de cette valeur car nous avons choisi lalgorithme shortestPath qui extrait les chemins de mme longueur les plus courts.

PROgrammez !

< 22 >

JANVIER

2013

12,13,14 fvrier

D I G I TA L I S B U S I N E S S

MICROSOFT VOUS SORT LE GRAND JEU AU PALAIS DES CONGRS DE PARIS

Dveloppeurs

Professionnels de linformatique

Dcideurs informatiques

Secteur public

Dcideurs mtiers

INSCRIVEZ-VOUS GRATUITEMENT SUR WWW.MSTECHDAYS.FR

En partenariat avec

Microsoft France - RCS Nanterre B327 733 184

i outils
Pour rcuprer tous les chemins entre Paul (1) et Jean (3), nous modifions lalgorithme et choisissons allPaths. > curl -d {to:http://localhost:7474/db/data/node/3, algorithm :allPaths, max_depth:3, relationships:{type: connait, direction:all}} -H Content-Type:application/json http:// localhost:7474/db/data/node/1/paths [ { start : http://localhost:7474/db/data/node/1, nodes : [http://localhost:7474/db/data/node/1, http://localhost:7474/db/data/node/2, http://localhost:7474/db/data/node/3], length : 2, relationships : [ http://localhost:7474/db/data/relationship/0, http://localhost:7474/db/data/relationship/1 ], end : http://localhost:7474/db/data/node/3 }, { start : http://localhost:7474/db/data/node/1, nodes : [http://localhost:7474/db/data/node/1, http://localhost:7474/db/data/node/5, http://localhost:7474/db/data/node/2, http://localhost:7474/db/data/node/3], length : 3, relationships : [ http://localhost:7474/db/data/relationship/5, http://localhost:7474/db/data/relationship/3, http://localhost: 7474/db/data/relationship/1 ], end : http://localhost:7474/db/data/node/3 } ] Deux chemins de longueur infrieure ou gale 3 ont t trouvs : Distance 2 : Paul (1) > Pierre (2) > Jean (3) Distance 3 : Paul (1) > Luc (5) > Pierre (2) > Jean (3) Il sagit dune autre fonctionnalit utile dans le cadre dun rseau social : par lintermdiaire de quels individus suis-je en relation avec une personne du rseau ? RETURN : les donnes retourner Illustrons la puissance de ce langage laide dun exemple qui a pour objectif de lister les noms des amis communs de Paul (1) et Jacques (4). START x=node(1), y=node(4) MATCH (x)(communs)(y) RETURN communs.nom Nous chargeons les deux nuds dont nous avons besoin (nud Paul et nud Jacques), dcrivons la forme du chemin qui nous intresse ( signifie un arc) et utilisons la variable (communs) pour prciser les donnes que nous souhaitons obtenir dans le rsultat. Une requte Cypher est transmise au serveur via le web service http://localhost:7474/db/data/ext/CypherPlugin/graphdb/execute_query en passant la requte dans le paramtre query. > curl -d {query: START x=node(1), y=node(4) MATCH (x) (communs)(y) RETURN communs.nom} -H Content-Type:application/ json http://localhost:7474/db/data/ext/CypherPlugin/graphdb/ execute_query { data : [ [ pierre ], [ luc ] ], columns : [ communs.nom ] } Linterface web met disposition une console permettant dinterprter les requtes Cypher [Fig.8].

Fig.8

> Cypher
Exprimer dans le langage courant une requte sur un graphe est gnralement assez simple : lister les amis damis dun individu , lister tous les amis communs entre deux individus , etc. Bien que Neo4j facilite les choses avec les API relatives au parcours des chemins, les dveloppements ncessaires deviennent assez rapidement longs et fastidieux (boucles imbriques avec gestion de mmoire ). Pour faciliter la vie du dveloppeur, la socit Neo a labor le langage Cypher qui quivaut, pour les graphes, au SQL des bases de donnes. Une requte Cypher est compose de 4 parties: START : quels sont les nuds mis en uvre dans ma requte (ex. nud de dpart) MATCH : la structure des chemins tudier WHERE : les filtres sur les nuds PROgrammez !

> Conclusion
Tout comme les SGBD ont permis aux dveloppeurs de saffranchir des problmatiques de stockage et restitution de donnes, Neo4j est en passe de prendre la mme place dans le domaine de la gestion de graphes. En sappuyant sur cette technologie aussi performante que scalable, le dveloppeur est en mesure de concentrer son nergie sur les innovations fonctionnelles et de service. # Franois-Xavier Bois

Cofondateur de KerniX, Franois-Xavier Bois est en charge de linnovation au sein de cette agence digitale parisienne. Il est lauteur de plusieurs ouvrages consacrs aux technologies web (PHP, MySQL, WordPress).

< 24 >

JANVIER

2013

i veille techno

Analysezvos donnes en M ap Reduce avec Hadoop !

Analyser de gros volumes de donnes, indexer le web, ...On entend de plus en plus parler dHadoop pour ces sujets... De quoi sagit-il exactement ? Et dans quels cas Hadoop est-il vraiment une solution intressante ? Petite revue d'architecture...

n 2004, Jeffrey Dean et Sanjay Ghemwat de Google Labs publient MapReduce: Simplified Data Processing on Large Clusters,[1] Doug Cutting, auteur de Lucene[2] et de Nutch[3], deux moteurs de recherche de la fondation Apache, dcide dimplmenter MapReduce en tant que sous-projet de Nutch. Lide tait de faire de Nutch un moteur dindexation distribue, capable de grer des volumes comparables ceux de Google. Limplmentation de MapReduce de Doug Cutting utilise alors NDFS (Nutch Distributed File System) pour le stockage distribu. Ce sous-projet de Nutch est bas sur une publication de 2003 de Sanjay Ghemawat, Howard Gobioff et Shun-Tak Leung de Google Labs : The Google File System[4]. Pendant deux ans, Doug Cutting et Michael J. Cafarella vont travailler temps partiel sur ce qui va devenir Hadoop. En 2006, Doug Cutting rejoint Yahoo! pour travailler plein temps sur MapReduce et NDFS avec une quipe ddie. Par la suite, le projet devient projet officiel Apache, NDFS est renomm en HDFS (Hadoop File System) et le premier grand cluster Hadoop est mis en place chez Yahoo!

Fig.5

tance de savoir traiter et faire parler ces donnes. Ce monde rgi par lanalyse de tra voire de pta octets est celui du Big Data.

> Big Data ?

Economiquement, lobjectif du Big Data est de tirer un avantage conomique de lanalyse dun grand volume de donnes . Techniquement, lorsque lon parle de Big Data, on atteint les limites de traitement des systmes actuels. Les 4 grandes classes darchitecture permettent dillustrer ces limites. Lexprience montre quau del de ces seuils, les systmes traditionnels ne sont plus en mesure de fonctionner dans de bonnes conditions. Il faut alors recourir dautres solutions. Des acteurs existent et proposent leurs solutions pour dpasser ces limites. Hadoop apporte-t-il une relle valeur dans ce cas ? On peut se poser la question. Hadoop se positionne sur trois des quatre limites des grandes classes darchitecture : Stockage distribu via HDFS XTP / eXtreme Transactions Processing via HBase Programmation parallle via des frame-

works comme MapReduce Hadoop se diffrencie par quelques points essentiels : Stocker un grand volume de donnes est peu coteux Les donnes sont traites brutes avec une qualit variable Il est facile dajouter de la capacit de calcul et de stockage Le systme est ouvert

> Pourquoi Hadoop ?

Parce que le fils de Doug Cutting avait un lphant quil appelait Hadoop. Plus srieusement, la question pose ici est celle de la raison dtre dHadoop. Une technologie en soi ne sert rien. Aussi est-il important de la replacer dans son contexte afin de bien comprendre la fois sa raison dtre et ce que lon peut raisonnablement en attendre. Lun des lments marquant de ces dernires annes est lexplosion des volumes de donnes. Web, mobile, rseaux sociaux, de plus en plus de donnes sont changes et les entreprises, emmenes par lexemple des russites de compagnies comme Google et Facebook prennent conscience de limpor-

> Du stockage haute disponibilit accessible et performant ?

Lapproche traditionnelle est de stocker ses donnes sur des systmes chers, car quips avec les meilleures technologies et scuriss au maximum pour viter toute perte dun disque. HDFS, contrario, part du postulat que le matriel nest pas fiable. Quoi quil arrive. A partir de ce cela, larchitecture dHDFS est conue pour pallier le manque de fiabilit du matriel et plusieurs choses en dcoulent : Favoriser un grand nombre de machines peu coteuses, plutt que quelques machines trs chres. Cela permet en gnral de faire des conomies

PROgrammez !

< 26 >

JANVIER

2013

i veille techno
Chaque fichier dpos sur HDFS est dcoup en blocs de taille fixe et ces blocs sont rpliqus plusieurs fois sur lensemble des machines D'autre part, HDFS n'utilise pas le RAID mais dispose de son propre mcanisme de rplication au travers dun large ensemble de machines (des nuds) pour assurer la haute disponibilit et la rsilience des donnes faible cot. Mais comment assurer la performance dans ces conditions ? Lastuce repose ici la fois sur le mode daccs aux donnes : un fichier est crit une seule fois puis est accessible en lecture uniquement au sein de chaque noeud lors daccs distant. ca de blocs entre les machines et galement dindiquer lutilisateur (qui peut tre un humain comme un programme), sur quelle machine il doit se connecter directement pour accder un bloc donn. Le fait dutiliser ce chef dorchestre permet dassurer de bonnes performances, car les mta informations sont stockes en mmoire et la mmoire ne cote pas cher. Pour les donnes qui prennent de la place, les blocs, lutilisateur est redirig directement vers le nud les stockant. Cela signifie que HDFS distribue aussi la charge des connexions utilisateurs sur tous les nuds du cluster. Ainsi, naviguer dans une arborescence HDFS revient naviguer de nud en nud. bonnes performances abondance de ressources matrisant le langage.

> A quoi sert MapReduce ?

MapReduce a t conu pour remplir trois objectifs : fournir une API simple pour que les dveloppeurs fassent du code distribu parallliser en petits traitements unitaires de gros volumes de donnes dplacer le code vers la donne plutt que le contraire (colocalisation). Ce dernier point est fondamental. Cest ce qui diffrencie le plus MapReduce des frameworks traditionnels de calcul distribu. Le postulat de base de MapReduce est quil est moins coteux de dplacer un code compil sur les nuds dun cluster HDFS plutt que les donnes vers le code compil. Par consquent, chaque nud dun cluster HDFS va faire tourner des JVM MapReduce qui traitent des blocs stocks sur ce nud. Concrtement, cela veut dire quun job MapReduce est un fichier JAR standard contenant un Main et implmentant deux sous-classes : Mapper et Reducer. Le tout est envoy comme job au cluster Hadoop via le JobTracker.

> La performance au sein de chaque nud

Chaque nud ne dispose pas dun seul disque dur stockant tous ses blocs car cela conduirait une saturation de la bande passante du disque dur (sur une machine entre de gamme donc en SATA 150 en plus). Au lieu de cela, le stockage est rparti sur plusieurs disques durs, chacun disposant de son propre contrleur et de sa bande passante ddie. On parle dune configuration JBOD. Cela procure trois avantages : un disque plus lent sur un JBOD ne ralentira pas les autres pleine utilisation, chaque disque peut individuellement tre utilis son maximum si un disque tombe en panne, il ne gnera pas le fonctionnement des autres

> Quel type de donnes dans Hadoop ?

Les donnes stockes dans HDFS ne sont pas soumises un formatage particulier. En fait, HDFS na aucune connaissance de ce quil stocke, il se contente de le stocker et de le rpliquer. Lintrt de cette approche est que cela permet HDFS de rester simple sur cet aspect, les ventuelles contraintes de format provenant des frameworks utiliss pour le traitement de donnes.

> MapReduce, le premier framework dHadoop

MapReduce est un modle de programmation parallle issu de Google Labs pour lanalyse de donnes en batch. Dans Hadoop, il est implment sous forme d'un framework dexcution en Java. Pourquoi un framework Java ? La premire raison est que Hadoop est en Java. MapReduce est donc cod dans le mme langage que HDFS. Une raison plus profonde est que Java apporte plusieurs avantages non ngligeables : gestion de la mmoire par la JVM portabilit, Codez une fois, faites tourner partout
Fig.1

> Anatomie dun job MapReduce

Un traitement MapReduce se dcoupe en trois phases distinctes : Le map Le shuffle & merge Le reduce

> La performance lors des accs distants

Dans HDFS, une machine particulire appele le NameNode est en charge de conserver les mta informations (noms des fichiers, des rpertoires, taille, liste des blocs dun fichier, ), dorchestrer les repli-

> La phase de map

A la soumission du job au cluster, un rpertoire contenant les donnes dentre est indiqu. De lensemble des blocs de lensemble des fichiers de ce rpertoire est calcul une liste de splits. Un split est en gnral le synonyme dun bloc mais sa taille
Fig.2

Exemple dun mapper pour compter le nombre de mots.

Exemple dun reducer pour compter le nombre de mots.

PROgrammez !

< 27 >

JANVIER

2013

i veille techno
peut tre configure par lutilisateur. Le nombre de splits correspond au nombre de JVM qui seront lances pour traiter la phase de map. Ensuite, la mthode map est appele pour chaque record dun split. Un record est par dfaut une ligne dans le split (au sens Unix du terme, \n tant le dlimiteur). L encore, la dfinition dun record peut tre configure au lancement du job afin par exemple de grer un ensemble de dictionnaires JSON ou un dcoupage plus complexe pour une donne binaire (image, vido, ). Les appels successifs map() permettent de construire un fichier temporaire de clefs/valeurs appel le rsultat intermdiaire [Fig.1]. des clefs a traiter, la mthode reduce() de linterface Reducer est appele pour chaque clef. A la fin de chaque appel, un record du rsultat final est crit. Chaque reducer va ensuite crire ces records dans un fichier sur HDFS. Nous avons donc autant de fichiers de sortie que de reducers. Une fois le job termin, lutilisateur peut rcuprer dans le rpertoire de sortie, lensemble des fichiers crits par les reducers [Fig.2]. Dautres frameworks existent sur Hadoop pour mieux coller des besoins spcifiques : HBase permet de mettre en place une base de donnes diffrente de ce qu'on connat avec nos SGBD, car tourne vers la performance et ne respectant pas toutes les proprits ACID[6] Giraph pour le graph processing Hama pour le calcul scientifique (Bulk Synchronous Parallel) Mahout pour le Machine Learning Cloudera Impala et Apache Drill, bass sur Dremel[5] de Google Labs permettent de faire des requtes SQL distribues sur de gros volumes de donnes Bien que la plupart existent dj sur Hadoop aujourdhui, ces frameworks gnrent des requtes MapReduce, ce qui en limite lefficience. Seul HBase a pris une voie un peu particulire mais cela pourrait faire lobjet dun autre article. La future version de Hadoop, actuellement en test, permet de saffranchir de cette limitation en faisant de MapReduce un framework dexcution parmi dautres. Il devient alors possible dautres frameworks spcialiss de devenir rellement efficients et cela ouvre des portes pour le futur en positionnant Hadoop comme un socle de stockage et dexcution distribue, sans adhrence particulire un mode dutilisation. # Rmy Saissy Consultant OCTO Technology http://www.octo.com http://blog.octo.com
Fig.4

> Comment lancer un job ?

Pour lancer un job, il faut une fonction main() dans la classe du job qui en configure les paramtres essentiels, tels que le type de donnes en entre et en sortie, les classes de Map et de Reduce [Fig.3]. Ensuite, le job peut tre lanc en le soumettant un cluster Hadoop via la commande suivante : [Fig.4].

> La phase de shuffle & sort

Une fois que toutes les map sont termines, la phase de shuffle & merge dmarre. Cette dernire va trier au moyen dun quicksort et regrouper les valeurs du rsultat intermdiaire par clef. Puis, chaque clef est envoye avec sa liste de valeur une JVM de reduce. Lalgorithme utilis ici est appel le HashPartitioner. Le principe est simple : le nombre de reducers est fix au lancement du job chaque clef est hashe modulo le nombre de reducers Cela permet de sassurer quune mme clef ne se retrouve pas sur deux reducers.

> Quels outils autour d'Hadoop ?

Hadoop possde un cosystme assez riche, fait d'diteurs qui poussent leurs produits mais aussi et surtout de frameworks et de produits OpenSource venant tendre ses possibilits [Fig.5]. La future version stable d'Hadoop, YARN, va ouvrir de nouvelles possibilits en permettant cet cosystme d'aller au-del de MapReduce.

> Au-del de MapReduce

MapReduce est un framework performant pour effectuer du traitement en batch sur des donnes pouvant tre dcoupes en blocs indpendants. Par consquent, MapReduce ne convient pas tous les usages.
Fig.3

> La phase de reduce

Enfin, vient la dernire phase, le reduce. Une fois que les reducers ont reu lensemble

Exemple du main() pour compter le nombre de mots.

PROgrammez !

< 28 >

JANVIER

2013

OFFREZ-VOUS
UN ABONNEMENT !
jusqu

pour cette nouvelle anne 2013

-50

Code, gestion de projets, dveloppement web, mobilit, Programmez ! est la fois votre outil pratique, des articles de code par les meilleurs experts et votre veille technologique.

1 2 3 4

Abonnement 1 an au magazine
49
(au lieu de 65,45 , prix au numro)

Abonnement Intgral : 1 an au magazine + Archives Internet et PDF 59

istockphoto / ithinksky

Abonnement 2 ans au magazine

78
(au lieu de 130,90 , prix au numro)

Abonnement intgral 2 ans au magazine + Archives Internet et PDF 88

Toutes les offres en ligne : www.programmez.com

Abonnez-vous partir de 3,80 seulement par mois

Oui, je mabonne
n M. n Mme n Mlle
Prnom : I___I___I___I___I___I___I___I___I___I___I___I___I___I

retourner avec votre rglement Groupe GLI, 17 route des Boulangers 78926 Yvelines cedex 9

n Abonnement 1 an au magazine : 49 (au lieu de 65,45 , prix au numro ) n Abonnement Intgral : 1 an au magazine + archives Internet et PDF : 59 n Abonnement 2 ans au magazine : 78 (au lieu de 130,90 , prix au numro ) n Abonnement intgral 2 ans au magazine + archives Internet et PDF : 88

(au lieu de 65,45 , prix au numro )

Entreprise : I___I___I___I___I___I___I___I___I Fonction : I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I Nom :I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I

Adresse : I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I Code postal : I___I___I___I___I___I Ville : I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I Tl : I___I___I___I___I___I___I___I___I___I___I___I___I

(Attention, e-mail indispensable pour les archives sur internet)

@ I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I___I

E-mail : I___I___I___I___I___I___I___I___I___I___I___I___I___I___I

n Je joins mon rglement par chque lordre de Programmez ! n Je souhaite rgler rception de facture

Offre limite, valable jusquau 31 janvier 2013

PROG 159

i dveloppement mobile

Android,iOS,W indow s Phone 8 :

Choisir sa pl ateforme de dvel oppement mobil e

Quelques semaines aprs la disponibilit de Windows Phone 8, et pour le dernier numro de lanne 2012, nous allons parler dun sujet chaud pour le dveloppeur : quel systme mobile choisir pour dvelopper ses applications ?

68,3 % pour Android 18,5 % pour iOS 4,7 % pour BlackBerry OS 2,6 % pour Windows Phone
modle conomique et les applications payantes mais Google arrive peu peu mieux montiser sa plateforme. Toujours en 2013, il faudra suivre BlackBerry 10 qui sera dvoil fin janvier. RIM joue avec BB 10 sa dernire carte, et mme purement et simplement sa survie. Nous ne le mettons pas sur notre liste de choix cause de sa non-disponibilit. Si BB 10 propose de belles choses, il risque tout de mme de se faire rapidement laminer par Windows Phone 8. Dans ce dossier spcial, nous allons vous faire partager des avis de dveloppeurs, nous interroger sur comment choisir sa plateforme, les outils, sans oublier les bons conseils. A vous de jouer. # Franois Tonic

Il faut dire que Android est prsent sur plusieurs dizaines de modles, contrairement Apple qui est le seul produire des terminaux iOS, la prouesse de la Pomme nen est que plus remarquable. Microsoft ne peut que faire mieux avec Windows Phone 8, mais le chemin sera trs long pour esprer titiller Apple, voire, Google. Pour le 3e trimestre 2012, deux constructeurs dominent le march des smartphones : Samsung (56 millions dunits vendues) et Apple (27 millions dunits vendues). Depuis un an, Nokia scroule et tombe seulement 10 millions (la nouvelle gamme Lumia devrait, si tout va bien, amliorer cela). La plateforme iOS demeure la premire pour le

3 larrons en 2013
Android et iOS seront donc sans conteste les premiers choix. Difficile de faire limpasse. Le troisime systme est certainement Windows Phone 8, mme si son march se limite environ 3 %, actuellement. Cest le systme qui devrait logiquement le plus progresser en 2013. Reste tendre lcosystme et attirer les dveloppeurs. Sans march de masse, Windows Phone 8 nintressera pas le dveloppeur et les diteurs.

PROgrammez !

< 30 >

JANVIER

2013

istockphoto.com/piart

un ct, deux monstres dominent les dbats sur le march du smartphone : Android (Google) et iOS (Apple). De lautre ct, trs loin derrire, vous avez Windows Phone, BlackBerry, etc. Rcemment, IDC a livr quelques chiffres montrant larchi-domination sur les systmes (estimations 2012) :

i dveloppement mobile

Quels critres pour quelle platef orme ?

Lre des travailleurs rivs leur bureau 40 heures par semaine appartient dsormais au pass. Aujourdhui lutilisation de tablettes et smartphones dans lentreprise se prsente comme une opportunit pour les employs, mais reprsente galement un dfi consquent relever pour les socits et comporte quelques risques quil faut savoir grer. Indpendamment de la taille des structures, la gestion des problmatiques infor matiques et des questions de scurit ne cesse de crotre mesure que les entreprises rendent leurs donnes mtier accessibles sur les terminaux mobiles.

vant de se lancer dans le dveloppement dapplications mobiles, il importe de prendre en compte un certain nombre de considrations. En effet, chaque environnement informatique est diffrent avec ses besoins propres. De quel budget dispose-t-on ? De quelles fonctionnalits nouvelles a-t-on besoin ? Sur quelle plateforme souhaite-t-on rendre disponible son application ? Souhaite-t-on permettre la pratique du Bring Your Own Device dans son entreprise, tendance rcente de plus en plus rpandue des employs qui utilisent leur appareil mobile personnel pour utiliser des ser vices et ressources de lentreprise comme la messagerie professionnelle, ou accder des serveurs de fichiers, des bases de donnes internes ? Les fonctionnalits natives sont-elles critiques, indispensables ? De combien de temps dispose-t-on pour dployer lapplication ? Quelle est limportance de la vitesse, de la performance ? Lapplication requiert-elle la fonctionnalit spcifique dun appareil ? Quels langages de programmation sont matriss par les ressources internes ? ... Le choix de la plateforme de dveloppement en elle-mme soulve bon nombre dinterrogations. Nanmoins, en les comparant les unes aux autres, trois approches distinctes de dveloppement dune application se profilent : 1) lapproche de dveloppement en code natif, 2) opter pour une solution Flex / Air, 3) recourir la technologie HTML5. Chacune de ces trois options prsente videmment des avantages et des inconvnients. Lenjeu est de savoir identifier lapproche qui sera le plus profitable son entreprise.

CODE NATIF ?
Le dveloppement dune application mobile en code natif prsente des avantages significatifs. Cette mthode permet daccder en profondeur aux paramtres de lappareil et doptimiser de manire plus efficace la performance. Elle rend disponible certaines fonctionnalits qui ne sont pas accessibles aux plateformes Flex et HTML5. Ainsi pour les applications requrant des fonctionnalits trs spcifiques, uniques, il ny a pas dalternative au dveloppement en code natif. Fiabilit, rapidit et puissance sont donc les matres mots. Mais il faut minorer cette performance par la dpendance : tout dveloppement en code natif correspond un dveloppement spcifique pour un type dappareil mobile en particulier et tout dploiement sur un autre type de mobile ncessite un nouveau dveloppement. Il faut donc prvoir autant de (re)dveloppements de lapplication que de terminaux Parmi les avantages dun dveloppement en code natif, citons : les outils, le support et les meilleures pratiques fournis par les fabricants qui permettent dacclrer les dveloppements, les performances, laccs la plupart des fonctions des plateformes, des interfaces utilisateurs plus familires (en termes de look & feel)

FLEX / AIR
Lorsque Adobe a remis lApache Software Foundation le code source de sa solution Flex1, tous ses dtracteurs ont hurl la

mort de Flash. Mais Flash est loin dtre mort ! Il est vrai que Adobe ralentit progressivement ses efforts et son support de Flash pour la mobilit, mais la plateforme Adobe Air rencontre toujours un succs croissant. Apache Flex est parfaitement efficace aussi bien pour des applications de poste de travail que pour des appareils mobiles (Android, iOS, ), voire des applications TV. Son grand avantage reste la rapidit de mise en uvre pour un aspect visuel sduisant. Signalons encore que la plateforme continue malgr tout de senrichir, notamment avec une srie dextensions pour plus de fonctionnalits natives des terminaux mobiles pris individuellement. Avec la donation de Flex la fondation Apache, cest juste une nouvelle re qui commence. Le SDK Apache Flex sera plus lentement amlior par Adobe, mais galement par une communaut beaucoup plus large. Les nouvelles mises jour logicielles dApache Flex SDK, dAdobe AIR Runtime et dAdobe Flash Builder confrent une puissance ce jour ingale pour le dveloppement multiplateforme. Ainsi, la dernire mise jour dAdobe AIR Runtime (3.5) comporte dj le support iOS 6 SDK, et la nouvelle version dAdobe Flash Builder (4.7) comporte des fonctions de simulation, test, debogage pour iOS on-device.

1. PC World, Adobe Donates Flex to Apache : http://www.pcworld.com/article/244060/adobe_donates_flex_to_apache.html

PROgrammez !

< 31 >

JANVIER

2013

i dveloppement mobile
HTML5 ?
De nouveaux horizons pour le monde de lapplication mobile ! Lvolution combine du HTML, des feuilles de style CSS et de JavaScript est quand mme phnomnale ! Les applications HTML5 sont accessibles depuis les navigateurs embarqus sur les tablettes et smartphones, mais peuvent galement sutiliser comme des applications natives via des frameworks hybrides. Un norme pas en avant. Mais attention : HTML5 reste nanmoins dpendant et limit par les capacits propres de chaque navigateur et des WebKits (moteurs daffichages conus pour les navigateurs web mobiles). Le HTML5 fournit aux dveloppeurs des outils pour le stockage web hors connexion, des API pour la golocalisation, des applications de dessin et bien dautres encore Simultanment aux volutions du HTML5 et aux derniers dveloppements web, de nouveaux outils et frameworks plus complets et cohrents font leur apparition pour renforcer lintgration HTML5 dans les navigateurs ddis mobiles. On dnombre dj plus dune douzaine de frameworks disponibles sur le march. Citons titre dexemple : JQuery Mobile Sencha Touch Backbone.js Aujourdhui, lide dun dveloppement mixte entre technologies web et technologies

natives tend se populariser. Gnralement rparties selon leurs fonctions, les applications se crent dsormais avec des nouveaux composants HTML plus rapides construire. Elles sont rutilisables dune plateforme une autre et se mettent jour de manire transparente pour lutilisateur, sans processus dautorisation, tout en prservant une exprience utilisateur de qualit. Prenons lexemple de Phonegap. Certes, ce framework permet dembarquer une page web HTML5/JS/CSS dans un shell natif, mais sa vritable force rside dans son potentiel hybride.

> Mais quest-ce quun framework hybride ?

Il sagit de composants permettant laffichage : tout dmarre par un afficheur web. Cet afficheur doit pouvoir charger et interprter du HTML (local ou distant), excuter du JavaScript et des CSS. Puis permettre au JavaScript dappeler des fonctions du code natif, et rciproquement. Toutes les plateformes le permettent aujourdhui, mais malheureusement, sans unit et de faon trop htroclite. Ainsi, les applications hybrides HTML5 se prsentent comme un compromis intressant parce quelles assurent une compatibilit entre les diffrentes plateformes de dveloppement (ddies au HTML5) et parce quelles peuvent utiliser les fonctionnalits matrielles et logicielles propres des

tlphones et des tablettes mobiles. Le choix dune solution HTML5 dveloppe sur une plateforme PhoneGap, Titanium ou Sencha, par exemple, vous donne accs aux API des constructeurs et vous ouvre les portes des App. stores.?

CONCLUSION
La plateforme de dveloppement mobile parfaite nexiste pas, mais il est possible dopter pour celle qui rpond le mieux vos objectifs business. Il y a beaucoup de questions se poser, et autant de rponses associes. Enfin, au moment de se lancer, il faut voir les choses en grand, mais dmarrer modestement ! # Hans Verreydt, Consultant, EoZen, Groupe SQLI Traduction de larticle de Hans Verreydt : Choosing your mobile development platform.

PROgrammez !

< 32 >

JANVIER

2013

i dveloppement mobile

Android,iOS,W indow s Phone 8 :

les dveloppeurs parlent aux dveloppeurs
Nous avons demand notre quipe de dveloppeurs de partager leur retour dexprience sur les trois plateformes majeures du dveloppement mobile : iOS, Android et Windows Phone. Ils reviendront dans un premier temps sur les bases du langage de chaque OS et donneront ensuite leur analyse sur les outils de dveloppement et de cration dinterface graphiques proposs.
Nos experts dveloppeurs
iOS : Vincent Saluzzo Android : Marc Duvignaud Windows Phone : Guillaume Brout & Fitzgerald Muiseroux

iOS:Apple mise sur sa plateforme,

LANGAGE
La difficult principale du dveloppement iOS rside dans ladaptation un langage peu dmocratis avant larrive de lOS dApple : Objective-C (langage historique de NeXT puis de OS X, driv du C, NDLR). Non pas que le langage soit compliqu en lui-mme, mais il dispose dune syntaxe et dun fonctionnement spcifique qui peut vite devenir droutant si on ne possde pas de bonnes bases.

son cosystme,sa ma matrielle -logicielle trise

automatiquement des getter/setter). Cest la version simplifi de la diffrence entre un iVar et une proprit. En ralit, Objective-C est un langage qui respecte totalement le KeyValue Coding (KVC). Cela veut dire quun objet quelconque peut tre trait comme un dictionnaire. Par exemple : monArticle.title = @"Un Article Super !";

> Les bases du langage

Prenons lexemple de cration dune classe en Objective-C : @interface Article : NSObject { // iVar } // Proprit @end et mthodes

qui permet de modifier le contenu de la proprit title pourrait tre crit dune autre manire : [monArticle setValue:@"Un Article Super!" forKey:@"title"];

Une implmentation scrit de la sorte : @implementation Article @end Jusque-l rien de bien compliqu si ce nest quici, interface dsigne le prototype dune classe et non une interface comme en Java, qui elle est reprsente en Objective-C par le mot cl: @procotol, exemple : @protocol ArticleProtocol { -(void) parseText:(NSString*)content -(NSDictionary*) mapContent; @end Dans la dclaration dune interface, il y a deux types de variables: les iVar et les Proprits. Pour faire simple, les iVar dclares dans une classe ne sont accessibles qu lintrieur de celle-ci. Une proprit ( @property ) rend accessible la variable depuis lextrieur (gnre

Autrement dit, le langage permet un dveloppement trs dynamique car si la proprit title nexiste pas, nous pouvons la rajouter directement depuis lexcution du programme (et non pas la compilation) et accder cette proprit de la sorte. Une des subtilits les plus importantes de lObjective-C, cest le systme de message. En Objective-C, le dveloppeur nappelle que trs rarement des fonctions dans son code, il envoie des messages . Pour celui qui ne le sait pas, cela ne change pas grand-chose de lappel de fonction, pourtant une diffrence est majeure ici : Lobjet qui envoie le message ne peut sassurer que celui-ci arrivera destination. Pour cause, les objets ne discutent que trs peu directement, ils passent par un intermdiaire : CallWebServices()

Se traduit en Objective-C par [Fig.1]. Dans la plupart des cas, cela ne change rien pour le dveloppeur, si ce nest quil doit prter attention sur les mthodes implmentes dans lObjet B, le code compilera si lobjet B nimplmente pas la mthode appele par lobjet A. Cependant cela gnrera une exception lexcution.

PROgrammez !

< 33 >

JANVIER

2013

i dveloppement mobile
Fig.1

Lavantage rside plus dans les possibilits que cela apporte. Il est plus facile de dvelopper un pont entre lobjective-C et un autre langage, ou faciliter la srialisation de donnes (exemple : CoreData) avec un systme de message (runtime) quun appel de fonction (compilation time). Lenvoi de message diffre de la syntaxe classique dappel de fonction : En Objective-C : [Article En C++ : Article->callWebServices(); Bien entendu, une syntaxe dun langage sapprend avec le temps, il suffit de manipuler un peu un programme crit en Objective-C pour trs vite sadapter celle-ci. callWebServices];

CFNetwork.framework - Permet lutilisation des interfaces rseau de manire prcise (Socket BSD, etc.) ImageIO.framework - Permet lanalyse, la cration et la lecture dimage Cependant, il existe aussi des librairies qui permettent de faciliter limplmentation dun grand nombre des besoins logiciels pour une application standard : CoreGraphics.framework - permet lutilisation de contextes graphiques (pour le dessin notamment) MessageUI.framework - permet la cration de fentres, ddi a lenvoi de messages (SMS, iMessage, Mail) MapKit.framework - permet limplmentation de cartes gographiques au sein dune application MediaPlayer.framework - permet la lecture de mdias dans une application La plupart de ces librairies (except les CoreLibraries), sappuient sur dautres librairies pour faciliter le travail du dveloppeur. De plus, il est trs facile de trouver des bibliothques Open Source pour raliser un composant visuel (ou autre) dans une application. Un site internet se propose de rfrencer ces bibliothques : www.cocoacontrols.com

On aime
Bibliothque standard trs efficace Forte communaut Open Source

On aime moins

IDE
Il nest pas possible de raliser une application iOS sans utiliser XCode (des outils tiers permettent tout de mme de gnrer in fine du code Objective-C, NDLR). Ce nest ni plus ni moins que lenvironnement de dveloppement intgr fourni par Apple. Apple mise toujours sur lergonomie de ses applications, cela sapplique aussi lenvironnement de dveloppement propos : XCode. Les menus sont bien penss et intuitifs. Il est juste regrettable quApple ne propose pas la personnalisation de cet outil, la manire dEclipse ou de Visual Studio qui permettent de dplacer lensemble des fentres. Nanmoins, Apple nous facilite normment la cration dinterfaces utilisateurs directement depuis XCode. Loutil Interface Builder permet de crer des interfaces graphiques aisment, de les personnaliser et dintgrer le comportement de celles-ci au code source via des drag&drop [Fig.2].
Fig.2

> LObjective C hrite compltement du C

Lavantage du langage Objective-C par rapport au C# ou au Java, cest quil nest quun superset du langage ANSI C. Autrement dit, toutes les librairies cres et compiles avec le langage ANSI C sont exploitables depuis un programme Objective-C. De ce fait, le compilateur Objective-C (LLVM ou GCC-OBJC) peut compiler du code C ne contenant aucune ligne de code en Objective-C. Un programme ddi iOS doit nanmoins contenir un minimum de code source crit en Objective-C, car un programme iOS sappuie sur un framework ncessaire au dveloppement dapplication iOS: Cocoa Touch (ou UIKit). Celui-ci permet limplmentation dinterfaces graphiques et la gestion des Entres/Sorties standards dune application iOS. Grace cet hritage, il est possible dutiliser des librairies standards crites en C: libxml , libz, etc.

On aime
Langage ultra-dynamique Ecriture de programme en C Rutilisation de librairies standards du C

On aime moins
Syntaxe particulire

> API : des frameworks ddis

On trouve beaucoup de bibliothques dans les outils de dveloppement fournis par Apple, notamment les frameworks disponibles dans le SDK. Certaines de ces librairies permettent deffectuer des traitements trs compliqus ncessaires des applications complexes : OpenGLES.framework - Ddi lutilisation dOpenGL ES dans une application iOS OpenAL.framework - Ddi lutilisation dOpen AL dans une application iOS

PROgrammez !

< 34 >

JANVIER

2013

i dveloppement mobile
On aime
Ergonomie

On aime moins
Peu (ou pas) de personnalisation possible

le simulateur iOS permet compltement de tester des programmes utilisant intensment la librairie OpenGL ES [Fig.3].

> Intgration du versionning: Git

Apple fournit un outil de versionning intgr dans XCode pour assurer un versionning local. Celui-ci sappuie sur Git. Lavantage cest que Git est la mode en ce moment, notamment grce sa dmocratisation via diffrents projets: GitHub, Gitorious, etc. Cependant, la gestion de Git par Apple laisse dsirer lorsque celle-ci sintgre avec des repository distants tels que GitHub. Dans ce genre de situation, il est prfrable dutiliser la ligne de commande pour grer le versionning distant. Le versionning dans XCode permet davoir un aperu de notre projet ralis il y a quelques minutes, quelques heures, voire quelques jours et de se rendre compte des modifications effectues, ce qui permet trs facilement dobserver les possibles erreurs ajoutes, ou les morceaux de code importants supprims par erreur... A noter que loutil est assez peu adapt pour le travail en quipe, il arrive frquemment de rencontrer des problmes lutilisation.

On aime
simulateur rapide et efficace Compatible avec les applications utilisant Open GL ES

On aime moins

INTERFACE UTILISATEUR > Les interfaces utilisateurs

La cration dinterfaces utilisateurs sous XCode est largement simplifie par loutil Interface Builder. Celui-ci permet de ncrire aucune ligne de code sur la mise en place des lments graphiques dune fentre. Il gnre automatiquement des fichiers XIB qui sont des fichiers de description dinterface graphique au format XML. Ceux-ci sont transforms en fichier NIB qui sont au format binaire pour viter dtre modifis ultrieurement, et rduire lempreinte mmoire quun format XML peut gnrer. Interface Builder est totalement drag&drop. Chaque lment est insr dans une vue par un gliss-dpos, ainsi que la configuration des interactions entre le code source et linterface graphique. iOS tant destin tre totalement MVC, la plupart du temps, une vue gnre par lInterface Builder dXCode est associe un fichier controller faisant le lien entre le code source mtier, et linterface graphique. Cependant, dans le cadre dinterface graphique plus complexe, il est tout fait possible de modifier ou crer une interface graphique avec du code source. Deux possibilits : Cration complte dune vue en code source Cration partielle de la vue sur Interface Builder et personnalisation de celle-ci depuis le controller Loutil interface builder est un outil puissant et complet qui possde quand mme quelques limites, principalement sur les possibilits de personnaliser certains contrles natifs. Depuis iOS 5, Apple a innov en apportant une fonctionnalit trs utile : le Storyboard. Derrire ce grand mot se cache en fait un outil simple permettant de dterminer le schma denchanement de chaque fentre et les diffrentes actions entre elles, sans crire une seule ligne de code [Fig.4].

On aime
Simplifie lutilisation de Git Versionning local de tout le projet

On aime moins
Peu recommand dans le cadre dutilisation dun repository distant Peu pratique en quipe

> Le debugging
XCode fournit deux niveaux diffrents doutils pour le debug des applications : Un dbuggeur pas pas classique Instruments : Suite doutil danalyse dun programme. Outre le fait que le dbuggeur soit compltement intgr lenvironnement de dveloppement, lutilisation dinstruments permet de dtecter des failles de mmoires ou des blocages de threads des points insouponnables. Apple fournit aussi un outil dautomatisation des vnements utilisateurs, permettant de rpter x fois un tap sur lcran un endroit prcis et bien dautres interactions. Ce genre doutil permet de crer des bench test aisment A noter que le dbuggeur a parfois du mal correctement analyser les objets et certaines exceptions sont difficiles dbuguer car XCode ne nous montre pas toujours o lexception est leve.

On aime
Simplicit dutilisation Storyboard

On aime moins
Peu de possibilits de modifier les styles des contrles

On aime
Instruments trs pratique

On aime moins
Dbuggeur assez instable Difficile de relever do est leve une exception

Fig.4

> iOS Simulator

Lun des points cls de XCode est son simulateur iOS. Celui-ci est plus quabouti en termes de rendu et de manipulation. Bien quil soit impossible de simuler des gestures complexes telles que le flip, le swipe ou autres, celui-ci capte compltement le pinch, le tap et le double-tap. De plus, il est possible de tester plusieurs versions diOS sur diffrents simulateurs matriels la vole (iPad, iPad Retina, iPhone Retina, iPhone et iPhone 5). Contrairement au simulateur Android,
Fig.3

PROgrammez !

< 35 >

JANVIER

2013

i dveloppement mobile
La rdaction : nous avons connu les premires versions dInterface Builder (1999 2000) pour OS X 10 / 10.1, la version actuelle na plus rien voir avec lhritage OpenStep. Loutil suit scrupuleusement les guidelines dinterface Apple.

On aime
Syntaxe facile dutilisation

On aime moins

> LAPI
Le dveloppement Android se base sur une utilisation partielle de lAPI de la plateforme Java Standard Edition, le cur de Java (la partie permettant de crer les interfaces graphiques des applications de bureau ayant, par exemple, t enleve). On retrouve, entre autres, les packages java.util, java.io, java.text ou encore java.net qui sont connus et utiliss par tous les dveloppeurs Java. En plus de ce cur , Google a ajout lAPI dAndroid afin de permettre la cration dapplications et dinteragir avec les fonctionnalits du Smartphone ou de la tablette. Cest grce cette librairie que nous allons pouvoir crer les bases dune application Android en crant les Activits qui reprsentent les fentres, les composants (boutons, listes, labels, ) ou encore mettre en place les transitions entre ces diffrents crans (via ce quon appelle les Intents ). Outre la cration de linterface utilisateur, lAPI Android permet aussi dinteragir avec la partie hardware de lappareil mobile. Elle permet par exemple daccder au GPS, la camra ou encore aux capteurs (gyroscope, acclromtre, capteur de lumire, ). Enfin, lAPI permet aussi daccder au systme de base de donnes implment dans Android, SQLite qui est une version allge des bases de donnes SQL. Maintenant que nous avons vu les bases des API utilises afin de crer une application Android, nous allons nous intresser aux outils utiliss pour le dveloppement. La rdaction : attention la fragmentation des systmes Android. Les anciennes versions sont trs largement utilises. Veillez aussi considrer la dprciation des fonctions et API.

ANDROI : D
LANGAGE

Google domine
La toute premire chose connatre lorsque lon souhaite faire du dveloppement dapplication Android est le langage Java, choisi par Google pour crer des applications sur le systme.

> Les Bases du langage

Contrairement lObjective-C, le langage Java est beaucoup plus classique et sera bien plus intuitif pour les dveloppeurs ayant fait de la programmation oriente objet en C#, en VB ou en C++. Par exemple, en Java, une classe est cre tout simplement comme ceci : public class Article { private String titre; public String getTitre() { return titre; } public void setTitre(String titre) { this.titre = titre; } } On peut remarquer dans le code ci-dessus lun des principes de Java, appel encapsulation , qui est lutilisation daccesseurs (Getter / Setter) pour manipuler les attributs dune classe. Ainsi, pour rcuprer ou modifier le titre dun article il sera ncessaire dutiliser les Getters/Setters et non pas directement les attributs : public void EcrireArticle(String titreArticle) {

IDE
Bien quil soit possible dutiliser un simple diteur de texte pour crer une application Android (pour les plus extrmes), Google recommande lutilisation de lIDE connu de tous les dveloppeurs Java, Eclipse. En effet, un plugin a t dvelopp (nomm ADT Android Developer Tools) afin de permettre la cration dapplication Android directement depuis Eclipse. Ce plugin permet, entre autres, dintgrer un diteur XML adapt pour les ressources Android, un crateur dinterface utilisateur ou encore un systme dexcution / debug dapplications sur lmulateur ou sur un appareil physique. Nous allons maintenant voir un peu plus en dtail les diffrentes fonctionnalits intgres cet IDE.

> Gnralits Eclipse

Le plugin ADT permet de parfaitement intgrer Android lIDE Eclipse et fournit les fonctionnalits habituellement demandes par un dveloppeur, comme par exemple lauto-compltion ou le quick-fix. Le plugin permet aussi de grer les mulateurs Android et de choisir sur quel appareil excuter lapplication que lon est en train de crer (mulateur ou appareil physique).

Article monArticle = new Article(); monArticle.setTitre(titreArticle); System.out.println(monArticle.getTitre());

} On voit dans cet exemple que lon a cr une fonction nomme DoStuff qui va permettre de crer un article, de lui dfinir un titre pass en paramtre de la fonction, puis dafficher celui-ci sur la console. Afin dappeler cette mthode, il suffit tout simplement de faire : EcrireArticle(Article Android); Cette syntaxe, qui doit tre familire beaucoup de dveloppeurs, permet dutiliser trs facilement le langage Java et dtre rapidement productif.

> Le debugging
Le debug est une partie trs importante de tout dveloppement et est intgr directement dans lIDE Eclipse. Lorsque lon dveloppe une application Android, le debugging est divis en deux parties : Le debug classique : Cest la vue de debugging classique utilise par tous les projets Eclipse (pas seulement les projets Android). Elle

PROgrammez !

< 36 >

JANVIER

2013

i dveloppement mobile
permet de faire les classiques du debugging que lon retrouve sur la majorit des IDE comme par exemple le debug pas pas ou la consultation des threads en cours dexcution (voir un exemple ci-dessous source : http://developer.android.com/tools/index.html) [Fig.5]. velles images systme adaptes larchitecture de lordinateur de dveloppement (Intel a notamment sorti il y a peu une image pour la nouvelle version dAndroid, Jelly Beans). Lmulateur possde cependant un trs gros avantage, il est possible de personnaliser normment le systme mul (version Android, taille de lcran, rsolution, hardware,) et donc de pouvoir tester sur les diffrents appareils Android prsents sur le march (qui sont trs nombreux). Voici un exemple de la cration dun systme mul :
Fig.7

Fig.5

DDMS (Dalvik Debug Monitor Server) : Cet outil de debug spcifique Android permet de faire du debugging un peu plus centr sur le mobile avec par exemple le monitoring de lallocation mmoire, des threads ou encore de lutilisation du rseau. Il permet aussi dutiliser LogCat qui est une vue affichant tout le Log gnr directement par lapplication en cours dexcution ou par le systme Android. Enfin, DDMS permet aussi dinteragir avec lmulateur Android en simulant un appel, un type de connexion rseau (3G, Edge, ) ou encore la rception dun SMS. Voici un exemple de DDMS ci-dessous (source : http://developer.android.com/tools/debugging/ddms.html) [Fig.6].

On aime
Personnalisation de lappareil mul

On aime moins
Lenteurs de lmulateur

INTERFACE UTILISATEUR
Le plugin ADT a ajout Eclipse une partie permettant de crer des interfaces utilisateurs via un systme de drag&drop comme on peut lavoir sur les autres IDE. Bien quil y ait eu des progrs, lUI builder reste encore un peu trop basique et assez limite lorsque lon veut crer une interface un peu complexe et il est plus rapide dditer directement le XML de linterface plutt que dutiliser loutil de Drag&Drop.

WI NDOW S PHONE 8 : M icrosof mise trs gros t

LANGAGE
Windows Phone 8 (WP8) est la dernire version de la plateforme de dveloppement de Microsoft destine aux Smartphones. Elle succde Windows Phone 7.x. WP8 supporte les langages de dveloppement de Microsoft C# et VB.NET, coupl du XAML pour les interfaces graphiques, mais une des grosses nouveauts de WP8 est la possibilit de dvelopper des composants en C++. WP8 supporte dsormais 3 rsolutions dcrans : WVGA (800 x 480), WXVGA (1280 x 768), et 720p (1280 x 720). Chose importante noter, tout ce qui fonctionnait sous WP7.x continue tourner sous WP8: pas besoin de recompiler les applications. Le mot dordre de toute application WP est performance, pour cela WP8 introduit le Compile in the cloud . Lorsque vous soumettez votre application, celle-ci est recompile en utilisant NGEN (Native Image Generator), cela est galement le cas dsormais pour toutes les applications WP 7.x du store. Lutilisation de NGEN est possible puisque dsormais les applications sexcutent dans la Core CLR (comme sous Windows 8).

Fig.6

On aime

On aime moins

Debugging classique trs complet Outils parfois complexes, difficiles prendre en main Intgration avec les appareils Android

> Un mulateur encore faiblard

Lmulateur Android est lun des points faibles du dveloppement Android. En effet, il est trs lent aussi bien au dmarrage qu lutilisation et un dveloppeur perd normment de productivit avec cet outil par rapport lutilisation dun appareil physique. Ce point faible tend nanmoins se rduire avec larrive de nou-

PROgrammez !

< 37 >

JANVIER

2013

i dveloppement mobile
Le design pattern dominant dans le dveloppement WP est MVVM (Model View View-Model). Ce design pattern contient diffrents degrs dintgration, cependant il tend supprimer le code behind afin de le dplacer dans un objet appel View Model contenant toutes les donnes ncessaires au fonctionnement de notre page. Son avantage est de totalement diviser interface et la logique de lapplication permettant au dveloppeur et lintgrateur de travailler simultanment. Il est possible de dvelopper dans deux langages de programmation diffrents, C# et Visual Basic, les deux langages tant bass sur le Common language Runtime ils partagent les mme librairies et sont totalement compatibles. Le C# tant le langage le plus rpandu nous lutiliserons pour la suite de larticle.
Fig.8

> Les bases du langage

Tout comme le JAVA, le langage C# hrite de la syntaxe C++, il ne dpaysera donc pas la majorit des dveloppeurs. Voici ladaptation de la classe Article vue prcdemment : public class Article { public String Titre {get; set;} } Le principe dencapsulation en C# peut tre gnr automatiquement via la dclaration de proprit automatique grce la syntaxe {get; set;}.Cela gnrera les accesseurs (Getter / Setter) associs afin de manipuler les attributs dune classe. Ainsi, pour rcuprer ou modifier le titre dun article il est possible dutiliser la proprit automatique et dutiliser les accesseurs de manire transparente. public void EcrireArticle(String titreArticle) { Article monArticle = new Article(); monArticle.Titre = titreArticle; Debug.WriteLine(monArticle.Titre); App platform compatibiliy for Windows Phone). Les applications WP 8 ne fonctionnent pas sur une ancienne version. Les applications produites par XNA Game Studio sont supportes mais impossible de crer de nouvelles applications WP 8 avec.
Fig.9

} Lavantage de C# par rapport au Langage de type Java est quil est beaucoup moins verbeux, cela amne un grande facilit de comprhension et un gain en productivit.

IDE
Le dveloppement dapplications WP8 repose sur les outils de Microsoft, savoir Visual Studio 2012. Le SDK WP8 est fourni avec une version gratuite (Express) de Visual Studio ou sintgre nimporte quelle version de celui-ci [Fig.9].

On aime
Syntaxe facile dutilisation Non Verbeux

On aime moins

> Le debugging
Le debug seffectue facilement grce au dbuggeur de Visual Studio. A ce niveau-l WP8 bnficie des annes dexprience de Microsoft et du .Net Framework et de la maturit de la gamme Visual Studio. Les fonctions de debugging vous permettent, par exemple, de vous arrter lemplacement dune procdure, dinspecter la mmoire et dinscrire des valeurs, dobserver le trafic des messages et dexaminer de plus prs le fonctionnement de votre code. Microsoft met galement disposition un mode de debug spcifique aux applications WP : Windows Phone Performance Analysis, permettant danalyser prcisment le comportement de vos applications [Fig.10]. De plus, vous pouvez galement utiliser le MarketPlace Test Kit, regroupant un ensemble de tests valider avant de soumettre votre application sur le Store [Fig.11].

LAPI
Les dveloppeurs WP disposent dsormais de nouvelles API natives facilitant un peu plus le dveloppement dapplication et permettant dinteragir plus facilement avec le device (NFC, Achat In-App, Lock Screen). Voici un schma prsentant lAPI : [Fig.8]. WP8 supporte nativement le dveloppement C++ et est capable de supporter une partie importante du SDK Windows 8, ce qui permet aux dveloppeurs de partager une quantit non ngligeable de code entre applications WP8 et Windows 8. Rdaction : le SDK WP8 exige un Windows 64 bits. Dautre part, de nombreuses modifications existent entre le SDK 7.1 et le 8 (voir :

PROgrammez !

< 38 >

JANVIER

2013

i dveloppement mobile
> Lmulateur
Lmulateur possde des fonctionnalits avances qui permettent au dveloppeur de tester lapplication de la mme manire que sur un tlphone, lacclromtre et la golocalisation sont totalement simulables dans la section outils de lmulateur. Il permet galement de tester son application selon diffrentes configurations matrielles, telles que la quantit de mmoire disponible [Fig.12]
Fig.10

On aime
La possibilit de customiser tous les contrles Les dictionnaires de ressource Les samples datas

On aime moins
Pas possible de lutiliser sur une machine virtuelle

INTERFACE UTILISATEUR
La gestion de linterface utilisateur se fait soit avec les XAML design tools intgrs Visual Studio, soit avec Blend (inclus dans Visual Studio 2012). Beaucoup plus de fonctionnalits sont dsormais accessibles directement dans Visual Studio (Device Panel, Template editing, dition de contrles...) Avec ces outils il est possible daccder tous les styles des nombreux contrles existants, soit en drag&drop, soit en ditant directement le xaml en vue splitte. Ils permettent aussi de crer des animations spcifiques (storyboards, visual states, transitions, easing). Blend offre en outre la possibilit de crer des dictionnaires de ressources (regroupant les lments graphiques, styles, templates, behaviors) qui permettent de modifier trs facilement et rapidement le rendu graphique dun projet. Lun des plus gros avantages rside dans la forte interaction entre Blend et Visual Studio via les samples datas qui permettent dafficher en mode design des lments dynamiques gnres par du code behind. Blend se rvle tre un excellent outil de cration dUI, il requiert cependant une bonne pratique de loutil pour tre matris totalement [Fig.13].
Fig.11

Fig.12

On aime
La possibilit de customiser tous les contrles Les dictionnaires de ressource Les samples datas

On aime moins

CONCLUSION
Comme nous avons pu le voir, chaque plateforme possde un langage spcifique avec ses avantages et ses inconvnients, le choix du dveloppeur sera donc fortement li ses comptences et son background. En ce qui concerne les outils de dveloppement, Apple et Microsoft possdent une longueur davance sur Android, en particulier parce que les outils de cration dinterface sont beaucoup plus aboutis que sur Android. Le choix dune plateforme par rapport une autre doit donc se faire en intgrant dautres facteurs que les aspects techniques : Quelle est la complexit de lapplication ? Quelle population cible ? Quel budget pour le dveloppement ? Quelle est la stratgie marketing associe ? Prcisons enfin que pour Microsoft, Windows Phone 8 est lopportunit de rattraper son retard sur la concurrence. Lattente est donc trs forte concernant laccueil que lui rserveront dveloppeurs et utilisateurs.

Fig.13

PROgrammez !

< 39 >

JANVIER

2013

i dveloppement mobile

5 leons mobiles mditer

Le dveloppement smartphone est sans conteste le grand hype du microcosme des dveloppeurs depuis 2 ans. Et il faut dire quil y a de bonnes raisons cela : nouvelles technologies excitantes, croissance exponentielle des quipements et des applications, mais aussi quelques belles opportunits conomiques. Reste choisir la bonne technologie pour se lancer dans ce nouvel eldorado...

ans le petit monde smartphone, 2 royaumes dominent trs largement les autres : il sagit bien videmment dAndroid et iPhone. De nombreuses tudes de march - bien souvent contradictoires - sont disponibles sur le sujet et rendent plus ou moins bien compte du phnomne. Linstrument de mesure qui semble le plus fiable pour comparer les technologies en termes de parts du march provient des statistiques dutilisation du web mobile. En effet, cette utilisation reflte, bien plus par exemple que les ventes dappareils, lutilisation avance dun terminal smartphone et notamment la consommation dapplications. Ds lors la domination absolue de la firme la pomme et du petit robot vert ne fait gure de doute sur le march franais : [Fig.1] En prenant un peu de recul, on peut dailleurs constater quau niveau mondial la ralit est un peu plus subtile, en particulier du fait du poids croissant des pays mergents moins denses en appareils haut de gamme [Fig.2].

Fig.1

Statistiques dutilisation smartphone sur le march franais

Fig.2

Leon 1 : si vous voulez toucher une part de march

significative, vous devez cibler iOS et/ou Android.

ANDROID VS IPHONE : CRITRES DE CHOIX POUR LE DVELOPPEUR

Reste choisir entre ces deux univers. Et l deux philosophies radicalement diffrentes se font face. Dune part celle quApple a toujours applique : un systme ferm, ddi et optimis pour une gamme dappareils cible. De lautre, celle dAndroid fortement influence par le logiciel libre : un systme ouvert, adaptable et applicable un ensemble de devices potentiellement sans limite. Ces choix fondamentaux ont des consquences tous les niveaux pour les dveloppeurs.

Statistiques dutilisation smartphone sur le march mondial

Fig.3

> Le langage
Le Java dAndroid est certainement plus accessible la majorit des dveloppeurs franais daujourdhui que ne lest lobjective-C dApple. Souvent plus verbeux, dot dune syntaxe pouvant paratre droutante et faisant appel des connaissances parfois oublies, et pourtant fondamentales ! comme les pointeurs ou la gestion de la mmoire, lobjective-C en fera abandonner plus dun. Mais loin dtre un caprice de feu Steve Jobs, objective-C est un choix cohrent dans lcosystme Apple o il est omniprsent et o ses qualits de langage proche de lOS sexpriment au mieux. A loppos, Java, trs prsent la fois dans les tudes informatiques et les systmes dinformation franais depuis une quinzaine dannes, saura sduire le plus grand nombre. Et l encore, cest un choix qui a du sembler naturel aux concepteurs dAndroid : Java tant le langage par excellence pour dployer simplement des applications sur des architectures varies.

Architectures compares dapplications sur iOS et Android

> Les kits de dveloppement

On retrouve ces diffrences de conception dans les SDK proposs par chacune des deux plateformes. Alors que les classes et frameworks CocoaTouch dApple orientent la conception dans un cadre MVC relativement strict, larchitecture dune application Android,

PROgrammez !

< 40 >

JANVIER

2013

(source : global stat counter)

(source : global stat counter)

i dveloppement mobile
base sur le concept dactivit, laisse une libert la fois attrayante et dangereuse sur des projets consquents. En prenant un peu de recul sur ces deux architectures, il est nanmoins possible de tracer un parallle intressant comme on peut le voir [Fig.3]. Apple limite en effet de manire considrable linstallation des applications, ce qui a par ailleurs quelques avantages, en particulier celui de la scurit. Les mthodes lgalement, cest dire hors jailbreak, disponibles sont : lApp Store et sa procdure de validation trs complique le dploiement ad-hoc sur des appareils dclars auprs dApple le dploiement entreprise

> Les environnements de dveloppement

Pour fabriquer ces belles lignes de code, iOS ne vous donne gure le choix : il vous faut XCode... mais ne nous plaignons pas ! XCode est en effet gratuit et ne manque de rien pour vous permettre de coder de manire efficace. Mais la grosse contrainte, cest que vous devez imprativement travailler sur Mac. Et pour cause : impossible de compiler le code sur une autre architecture. Du ct dAndroid, comme dhabitude, vous tes libre. Eclipse reste souvent le premier choix, mais Netbeans ou IntelliJ IDEA sont des alternatives tout fait productives. L encore, tout loutillage ncessaire est prsent, avec nanmoins un bmol : lmulateur de device Android dont les performances sont parfois proprement agaantes.

Leon 2 : vous voulez rapidement bidouiller dans

lunivers smartphone en ayant la possibilit de toucher toutes les briques du systme ? Choisissez Android. Vous voulez un rsultat ultra-qualitatif pour un effort raisonnable sur le long terme ? Choisissez iOS.

QUELLE PLACE POUR WINDOWS PHONE 8 ?

Si lhistoire est un ternel recommencement, Microsoft et ses tentatives de (re)prendre sa place dans lunivers du mobile en est une belle illustration. Souvenez-vous... En 2007, Microsoft domine le march amricain avec 42% des smartphones vendus tournant sur Windows Mobile quand Apple fait son entre fracassante dans lunivers de la tlphonie. Chutant 27% de parts de march ds lanne suivante, la firme de Redmond tente de ragir avec Windows mobile 6.5 en 2009 puis en 2010 avec Windows Phone 7 et le dsormais dfunt Kin. Malgr le partenariat nou avec Nokia, la grande campagne de promotion de la gamme Lumia et la sortie de Windows Phone 7.5 en 2011, Microsoft ne parvient pas percer. 2012 arrive, et l encore nouvelle stratgie : ce sera Windows Phone 8... qui casse la compatibilit avec Windows 7 comme ce dernier avait cass la compatibilit avec la gnration Windows Mobile. Avec 2 refontes majeures en moins de 3 ans, lhistorique na pas de quoi mettre le dveloppeur en confiance. Mais Steve Ballmer nous promet que cette fois-ci, cest la bonne et le chambardement dans les diffrentes versions de Windows (8, RT, Phone 8, Server 2012) est tel que lon peut au moins lui accorder le bnfice du doute.

> Performances et productivit

Les performances : voil en effet un point sur lequel le dveloppeur Android peut rencontrer des problmes. Lubiquit de la machine virtuelle Dalvik ajoute un niveau dabstraction qui loigne le code applicatif du systme dexploitation : il en rsulte des performances souvent infrieures celles que le dveloppeur iOS pourra atteindre avec son Objective-C, souvent plus laborieux dans un premier temps, mais finalement assez efficace sur la dure totale dun projet. Le garbage-collector de Dalvik permet certes de sconomiser la problmatique de gestion de mmoire, mais il nest pas rare de devoir revenir une gestion manuelle de celle-ci. Dans le mme temps, Xcode commence offrir un outil intressant avec ARC (Automatic Reference Counting) qui permet thoriquement au dveloppeur de se dbarrasser de la gestion mmoire sur iOS . Il est enfin encore un point qui rend les choses compliques au dveloppeur Android : la diversit des terminaux (plusieurs milliers !). Tous nont pas le mme comportement par rapport lutilisation de telle ou telle API et la qualit du matriel est loin dtre toujours au rendez-vous... ce qui rend encore plus critique la question des performances ! Cest notamment pour cela quAndroid propose dutiliser le Native Development Kit (NDK) pour dvelopper en C/C++, au plus prs du code machine. Lutilisation du NDK exigera alors une compilation pour chaque architecture processeur cible.

Fig.4

> Dploiement des applications

Encore un point o nos deux philosophies saffrontent. Le dploiement dune application sous Android bnficie dune simplicit et dune souplesse remarquables : il suffit de rcuprer lapplication sous forme de fichier apk pour linstaller sur un device. Ds lors, les applis peuvent senvoyer par mail, par USB ou tre tlcharges via un serveur ou un store priv. Bien entendu, la voie royale pour la distribution reste Google Play dont les procdures de publication sont relativement simples. Dployer sur iOS est plus compliqu, mme si la situation sest, dans une certaine mesure, amliore dernirement grce des outils comme Diawi.

Le Share Windows Core

JANVIER 2013

PROgrammez !

< 41 >

i dveloppement mobile
> Larchitecture logicielle Windows Phone 8
La grosse nouveaut conceptuelle de Windows Phone 8, cest le partage du noyau et de quelques fonctions de base avec Windows 8 : le Shared Windows Core. Parmi celles-ci, on retiendra essentiellement le fait que Windows 8 et WP8 partagent dsormais un nombre important de bibliothques de base ncessaires aux applications. WP8 embarque en particulier la mme base de runtime .NET que son grand frre et envoie dfinitivement les spcificits du compact framework aux oubliettes [Fig.4]. Cest dailleurs un point sur lequel les ingnieurs de Microsoft insistent particulirement : la base du runtime .NET, le coreCLR est maintenant au coeur du fonctionnement des applications Windows Phone. Les optimisations apportes au coreCLR au niveau de la gnration de code machine, de lexploitation des processeurs multicoeurs, et du garbage collector font, daprs ses vanglistes, de WP8 une vraie technologie de rupture en matire de performances des applications. Des propos qui restent confirmer sur le terrain, mais les premires expriences semblent montrer que les choses avancent dans le bon sens sur cette question. Il vous suffit ensuite de double-cliquer sur le bouton pour crer lvnement clic sur le bouton. Un template du code-behind pour cet vnement saffiche ds lors : namespace HelloWorld { public partial class MainPage : PhoneApplicationPage { // Constructor public MainPage() { InitializeComponent(); } private void Hello_Click(object sender, RoutedEventArgs e) { } } } Vous navez plus qu remplir le Hello_click avec le code adquat. Par exemple : MessageBox.Show(Hello MessageBoxButton.OK); World !, Application de dmo,

> Vue densemble du SDK

Le SDK est disponible depuis fin octobre et propose gratuitement un ensemble comprenant : une version stand-alone de Visual Studio 2012 Expression Blend pour Windows Phone toutes les bibliothques ncessaires au dveloppement dapplications WP 8 et 7.x avec du code .NET ou du code C++ natif XNA Game Studio pour la ralisation de jeux Windows Phone plusieurs mulateurs smartphone un client pour Team Foundation Server un ensemble doutils de tests et de profilage des applications Si le SDK est gratuit, il nen reste pas moins que les conditions remplir pour faire fonctionner la bte ne sont pas forcment accessibles tous les dveloppeurs : une machine fonctionnant imprativement sous Windows 8 64bits et disposant au minimum de 4Go Ram. Ces prrequis assez restrictifs rappellent singulirement le modle iOS qui a, semble-t-il, servi dinspiration sur plusieurs points. Notons enfin que le SDK peut sincorporer en tant que plugin Visual Studio 2012.

Bref, rien de neuf pour les aspects basiques si vous tes un habitu du dveloppement Windows Phone 7 voire mme du dveloppement .Net en gnral. Lapprentissage sera plus faire du ct des volutions des API, ce qui tombe bien puisque la documentation est plutt bien fournie, notamment en exemples.

> Tablettes et histoires de compatibilit

Les annonces relatives la compatibilit des applications Windows Phone 8 avec le reste de lcosystme Windows paraissent parfois contradictoires. Commenons par la compatibilit WP7, pas forcment inutile dans la mesure o les tlphones WP7 (et 7.5) ne pourront jamais tre upgrads en WP8 (par contre lupgrade en 7.8 sera possible) : une application WP7.x peut tre upgrade en WP8 simplement, aux diffrences dAPI prs VS2012 permet le dveloppement dapplications pour WP8 et/ou WP7.x Pour faire fonctionner une app sur les deux types de plateformes, il faudra l encore grer les diffrences dAPI La grosse diffrence avec les univers Android et iOS, cest labsence de compatibilit des applications Windows Phone avec les nouvelles tablettes Windows. En effet, contrairement ses concurrents, WP8 nest pas un environnement destin ces dernires. Pour rappel, la solution Microsoft pour tablettes se nomme Windows RT si elles fonctionnent sur architecture ARM (NVidia, Qualcomm) ou tout simplement Windows 8 sur x86 (Intel, AMD). Comme nous lavons vu plus haut, les systmes sont proches et mme sils ne sont pas directement interchangeables du point de vue des applications, il est possible de mutualiser une bonne partie de code source entre ces diffrents systmes. Cette mutualisation sopre grce aux portable class libraries (cf. Programmez novembre 2012) qui ne sont pas nouvelles mais qui

> Dvelopper pour Windows Phone 8

Le dveloppement dapplications WP8 reprend les mmes principes que le dveloppement WP7 : soit XAML + C# ou VB, mais, et cest encore une inspiration venue diOS et dAndroid, il est dsormais possible de dvelopper en C++ natif. Ce nouveau mode de dveloppement, outre un certain gain de performance, offre la possibilit dutiliser de nombreuses bibliothques C++ classiques telles que les moteurs Havok ou Unity et ouvre par exemple la porte de vraies expriences de jeu avances sur WP8. Regardons donc comment se prsentent les choses pour le dveloppeur travers un petit Hello World. Vous pouvez commencer par utiliser le designer dinterface pour placer un bouton dans notre application. VS2012 vous gnre alors le code XAML correspondant : <Button x:Name=Hello Content=Hello VerticalAlignment=Top HorizontalAlignment=Right/> PROgrammez !

< 42 >

JANVIER

2013

prennent tout leur sens avec le rapprochement des diffrentes versions de Windows. On ne vous recommandera ds lors jamais assez de suivre avec attention les quelques recommandations de Microsoft sur larchitecture de vos applications (en particulier le fameux MVVM) si vous voulez en tirer parti. Quelques proofs of concept de conversation dapplication dun univers lautre savrent assez bluffants... mme si l encore, nous manquons de recul pour voir ce que cela pourrait donner sur de vrais projets.

> Larchitecture Phonegap / Cordova

Cordova (le projet open-source derrire Phonegap) fonctionne sur un principe simple : tout le code est ralis en HTML5/CSS3/JS. Ce code est ensuite compil au sein dune webview (composant prsent dans tous les sdk utilisant le moteur de rendu du navigateur web du smartphone) qui contient donc lensemble de lapplication telle que le dveloppeur la code. Reste que les webviews ont les limites du web et quelles ne permettent donc pas daccder aux fonctionnalits natives du tlphone (camra, acclromtre, boussole...). Cest l que Cordova prend tout son sens : ce beau projet propose en effet un ensemble de bridges rendant ces fonctionnalits natives disponibles au sein dune simple API Javascript [Fig.5]. Du fait de cette architecture, le dveloppement se passe donc en deux temps : tout dabord la ralisation proprement dite de lapplication au format web, puis sa compilation au sein des diffrents SDK cibls (il faudra donc toujours Xcode et un Mac pour avoir une app iOS). Pour cette seconde tape, Adobe propose dailleurs un service, Phonegap Build, afin deffectuer pour vous et dans le cloud la compilation destination des diffrentes plateformes vises.

Leon 3 : se lancer dans Windows Phone 8 reprsente

un investissement dont la rentabilit est encore incertaine malgr des promesses qui paraissent allchantes. Soyez prudents.

LE DVELOPPEMENT CROSS-PLATFORM : LA SOLUTION MIRACLE?

Android, iOS, Windows Phone : trois technologies et autant de dveloppements fondamentalement diffrents pour qui voudrait rendre son application compatible sur les trois plateformes. Ds lors, la tentation du dveloppement multiplateforme est grande... dautant quelle propose souvent au dveloppeur de faire lconomie de lapprentissage dun nouveau langage. La solution miracle existerait-elle donc ?

> Dvelopper avec Cordova

Repassons une fois encore par la case Hello world pour illustrer le dveloppement sous Cordova. Pour cela, commenons par poser la base de notre contenu : du HTML5. <html> <head> <meta http-equiv=Content-Type content=text/html; charset= UTF-8 /> <meta name=format-detection content=telephone=no /> <meta name=viewport content=user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height= device-height, target-densitydpi=device-dpi /> <title>Programmez !</title> </head> <body> <div class=app> <h1>Hello world demo</h1> <input type=button id=hello value=hello> </div> <script type=text/javascript src=cordova-2.1.0.js></script> <script type=text/javascript src=js/index.js></script>

> Trois faons daborder le cross-platform

Plusieurs diteurs proposent leur solution de dveloppement smartphone cross-platform, mais toutes utilisent lune des 3 stratgies suivantes : gnrer du code natif pour les diffrentes plateformes partir dun autre langage (ex : Titanium Appcelerator) faire fonctionner le code sur un runtime embarqu dans lapplication (ex : Rhomobile) utiliser les capacits des composants webviews proposs par les diffrents SDK (ex : Phonegap) La solution de la gnration de code - qui parat sduisante sur quelques cas dutilisation simples - na jamais vraiment fonctionn dans lhistoire du dveloppement : ds que les projets deviennent consquents, cela se termine invariablement en soupe de code lourde et invraisemblable en termes de maintenance. Invitablement, pour contourner les limites de ces solutions qui doivent toujours courir derrire les volutions des diffrentes plateformes, la plupart des dveloppeurs en viennent faire eux-mmes du code natif plus ou moins sauvage comme autant de sparadraps sur une jambe de bois. La mthode du runtime a pour elle le mrite dune plus grande cohrence technique : le code est optimis pour un runtime et les efforts du dveloppeur peuvent se concentrer sur celui-ci. Cette approche qui est un peu celle de la JVM a nanmoins un dfaut majeur pour lunivers du mobile : celui de rajouter une surcouche entre lapplication et le systme et donc de perdre notablement en performances des niveaux souvent rdhibitoires pour un smartphone (manque de ractivit de linterface, trop grande consommation de mmoire et dnergie). Reste la dernire possibilit, utiliser des webviews afin de coder en HTML/CSS/JS pour toutes les plateformes, qui loin dtre dpourvue de dfauts, est une voie raisonnablement envisageable, au moins pour certains projets. Examinons donc le cas phonegap.

Fig.5

Principe de fonctionnement de Cordova

JANVIER 2013

PROgrammez !

< 43 >

i dveloppement mobile
<script type=text/javascript>app.initialize();</script> </body> </html> Outre la structure HTML5 classique, on remarque linsertion de 3 lments de javascript : le chargement des bibliothques Cordova, lappel de notre code javascript de gestion et linitialisation de lapplication via la mthode app.initialize() de Cordova. Attaquons-nous donc au code js en commenant par la variable app permettant linitialisation de lapplication : var app = { //initialisation de lapplication initialize: function() { this.bindEvents(); }, //initialisation des vnements bindEvents: function() { document.addEventListener(deviceready, this.onDeviceReady, false); var helloButton = document.getElementById(hello); helloButton.addEventListener(click, sayHello, false); }, //gestion de lvnement application initialise onDeviceReady: function() { app.receivedEvent(deviceready); }, // Sur lvnement receivedEvent, on cre un log (utile pour le debug) receivedEvent: function(id) { console.log(Received Event: + id); } }; Il suffit ensuite dcrire le code de la fonction sayHello() pour afficher un message au clic sur le bouton. Par exemple : function sayHello(){ alert(Hello world !); } Dernire tape : la compilation sous forme dapplication. Celle-ci dpend de la plateforme que vous visez. Il vous suffit de suivre les instructions de la documentation Phonegap pour Android ou pour iOS.

> Liens :
http://docs.phonegap.com/en/2.2.0/guide_getting-started_android_index.md.html et pour iOS : http://docs.phonegap.com/en/2.2.0/guide_getting-started_ios_index.md.html

> Une solution viable... pour certains projets !

Cordova a quand mme un certain nombre de dfauts lis sa conception. Premirement, le fait de passer par une webview ajoute un niveau dabstraction entre votre lapplication et le systme. Ainsi, mme si les smartphones modernes optimisent plutt bien linterprtation des langages web, vous perdrez en performances. Entendons nous bien : cela nest pas forcment bloquant, mais si votre application doit comporter, par exemple, des animations ou des effets de transitions ultra-fluides, Cordova vous posera des problmes. Cordova ne peut pas non plus tirer parti de certains composants (graphiques, accs au hardware) natifs optimiss pour telle ou telle plateforme. Pour ce faire, il est ncessaire de passer par le systme de plugins Cordova : mais vous perdez alors tout lintrt du multiplateforme puisque vous devrez coder vos plugins pour chaque plateforme cible. Le bon projet Phonegap est donc celui qui nest pas trop exigeant en matire de performances et qui vous permettra de raliser une application multiplateforme en ne ncessitant que peu de plugins.

Leon 4 : le dveloppement Phonegap est une alternative viable au dveloppement natif, peut-tre mme la seule. Mais cest loin dtre toujours la meilleure option.
LE BON CHOIX POUR VOUS ?
Terminons par un rcapitulatif global de ces diffrentes possibilits pour le dveloppeur... les notations donnes ici donnent une tendance provenant la fois des qualits fondamentales de chaque solution mais sur tout de retours dexprience concrets. Lvaluation de Windows Phone 8 est donc encore imprcise de ce point de vue.

Leon 5 : vous voulez gagner

de largent en vendant sur un store ? Choisissez iOS. Vous voulez gagner de largent en dveloppant pour dautres smartphones ? Faites-vous embaucher :)

Fig.6

Comparatif des technologies prsentes

PROgrammez !

# Jean-Baptiste Boisseau Eutech SSII

< 44 >

JANVIER

2013

i dveloppement mobile

La dictature des Publics Stores est- lgitime ? elle L

orsque nous avons un service offrir sur le web, nous prsentons celui-ci au travers de notre site. Nous laborons une stratgie pour dvelopper le trafic des visiteurs. Nos clients sinscrivent, slectionnent un produit et lachtent. Nous conservons leurs coordonnes et travaillons notre connaissance client pour les inciter revenir et renouveler leur acte dachat, le plus rgulirement possible. Cette intimit client se construit progressivement, certes, sous le regard des moteurs de recherche et ventuellement via un appui publicitaire, mais finalement sans intermdiaires : ni ticket dentre, ni contrle de notre relation client. Notre site met en scne nos produits dans une vitrine dont nous grerons en fait tous les contours pour valoriser exclusivement nos offres.

Cette publication se fera sur lun des grands Public Stores .

Ces espaces du commerce mobile appartiennent des grands groupes qui les grent quasi exclusivement : Apple, Google, Microsoft, RIM Il existe bien des marchs alternatifs pour Android, avec parmi eux, des marchs lgaux et des marchs noirs illgaux mais ceux-ci restent anecdotiques. Pour proposer nos applications il nous faut une approbation. Elle peut prendre entre 5 et 15 jours et donner lieu une facturation, mais dans tous les cas, un pourcentage des ventes est revers au Public Store . Cependant, la forte valeur ajoute de ces espaces de vente ddis au canal mobile est intimement lie leur frquentation et au volume de tlchargements quils gnrent. Ils permettent de capter et de recruter de nouveaux clients. Le Public Store est-il pour autant une tte de gondole qui aide vendre ? Sur les Publics Stores finalement : Lorsque le mobinaute utilise comme clef de recherche les spcificits et avantages de nos produits, est-ce notre application qui apparat en premier ? Sommes-nous suffisamment visibles parmi les milliers dautres offres ? Notre capacit dacquisition clients est-elle efficace ? Notre offre est-elle labri de nos concurrents ?

Acceptons-nous volontiers, ventuellement ou pas du tout, les rgles imposes pour lapprobation dune application : les dlais, les cots, la possibilit que notre application soit supprime distance sans pravis ? La solution serait de pouvoir : Distribuer une application directement sur la messagerie de nos clients. Optimiser le reporting de donnes marketing mobiles analytiques Grer la publication des applications avec des fonctionnalits personnalises et un niveau de segmentation client plus fin. Ces fonctionnalits sont celles dun private store mais celui-ci nest autoris par Apple que dans le cadre de publication in house c'est--dire sur la flotte de mobiles des collaborateurs en interne. Les fonctions des terminaux et des OS jouent-elles un rle commercial suffisamment fort pour justifier quelles soient montises de manire rcurrente ? Il existe, toutefois, entre les publics stores des diffrences de contraintes et de business model quil faut prendre en compte ds llaboration de la stratgie mobile.

Nos clients internautes deviennent mobinautes !

Comment faire pour exploiter leur mobilit et leur offrir de nouveaux contextes dachat la fois attractifs et efficaces ? Notre site peut devenir mobile et lisible sur tous types de devices grce du responsiv design. Une webapp multi devices pourra, en plus, exploiter la fonctionnalit de golocalisation. Une application hybride pourra, elle, tirer parti de la plupart des fonctionnalits spcifiques chaque terminal : acclromtre, boussole, camra Une application native offrira une exprience exclusive qui tirera parti de toutes les fonctionnalits de la plateforme mobile cible. Plus nous cherchons tirer parti des fonctions du terminal mobile, plus nous sommes amens publier des applications mobiles directement charges sur les mobiles cibles.

# Remy Buclin, Corporate Business Developpeur Mobile & Digital, Devoteam

PROgrammez !

< 45 >

JANVIER

2013

i dveloppement mobile

Focus sur W indow s Phone 8

Windows Phone 8 est la dernire plateforme de systme dexploitation mobile par Microsoft. La version initiale fut lance fin 2010 avec une dizaine de modles de tlphones et a reu une mise jour majeure appele Mango, fin 2011. Nokia a commenc proposer ses tlphones ce moment-l. Depuis octobre 2012 Windows Phone 8 est disponible sur 7 tlphones des marques Nokia, HTC et Samsung, dautres sont dj annoncs.
Fig.1

Phone. Ces guidelines sont penses afin de permettre lutilisateur de vivre une exprience uniforme dune application une autre. Dans ces guidelines on peut retrouver des choses simples comme le drag and drop ou plus complexes telles que certains types danimations. Heureusement, si ces guidelines sont l pour simplifier la vie de lutilisateur final, elles permettent aussi tous les dveloppeurs utilisant les contrles du SDK de ne pas avoir sen proccuper vu que ces contrles respectent dj toutes ces rgles. Bien entendu, en plus dassurer la mme exprience utilisateur dune application une autre, Microsoft tend cela au-del du mobile puisque cette interface est semblable celle de Windows 8, Windows RT, linterface de la XBox 360 ainsi que celle du baladeur Zune. De quoi peut-tre donner lide certains dveloppeurs de crer une application sur ces divers supports [Fig.1].

> Uniformit
En plus de favoriser une exprience utilisateur semblable dune application une autre, Microsoft pousse la chose encore un peu plus loin en voulant la rendre semblable dun Smartphone sous Windows Phone 8 un autre. Cest dans ce but duniformatisation que Microsoft exige de ses partenaires une configuration minimale pour les Smartphones destins accueillir Windows Phone 8. Ces spcificits requises sont on ne peut plus simples, mais assez prcises en la matire : 4Go de mmoire de stockage minimum, un processeur dual-core de type Qualcomm Snapdragon S4, 1 Go de mmoire RAM (ou 512 pour les crans WVGA), cran tactile multi-touch capacitif, camra arrire avec autofocus et flash LED ou Xenon, GPS, acclromtre, dtecteur de proximit, capteur de luminosit, moteur de vibration, wifi 802.11 b/g, Bluetooth, gestion de DirectX, port Micro-USB 2.0.

loppos de lancienne plateforme Windows Mobile, Windows Phone repart de zro. Un nouveau design apparat sous le nom de Metro mais sappelle dsormais Modern UI. Linformation est mise en avant de faon image ou colore avec le minimum de travail sur les formes (bordures, chromes). La typographie devient reine dans un monde de tuiles aux couleurs unies qui saniment dinformations de tous les jours. Lauthenticit de lergonomie se dmarque profondment en laissant toujours la place de nouvelles faons de raliser graphiquement vos applications. Les applications panorama souvrent comme une premire de magazine de par leur dynamisme. Pour les professionnels, Windows Phone intgre les outils de tous les jours : Word, Excel, OneNote, PowerPoint et offre une connectivit vers SharePoint. Pour les passionns de musique ou vido, le hub music+video offre une collection imposante pour un abonnement mensuel. Finalement, les dveloppeurs dapplications retrouvent les outils quils connaissent dj bien : Visual Studio 2012 et Expression Blend.

> Live tiles

Les lives tiles sont apparues avec la version 7.0 de Windows Phone. Elles correspondent aux tuiles prsentes sur lcran daccueil du tlphone. Elles sont dites live car elles retransmettent en temps rel les informations dont lutilisateur veut avoir connaissance sans mme avoir lancer une application. Lcran daccueil est personnalisable par lutilisateur, cest lui qui dfinit la taille et lemplacement de ces tuiles. Le dveloppeur, de son ct, a la possibilit de mettre jour les informations de la tuile de son application de manire locale ou distante sans que lutilisateur ait lancer lapplication. Il est possible de modifier limage de la tuile, le badge associ (ie : le nombre de notifications en attente) et le/les textes informatifs. Depuis la version 8 de Windows Phone, on peut facilement recrer le mme comportement que les applications natives pour le design et lanimation des tuiles : contenus diffrents selon la taille de la tuile, animations cycliques de la tuile, comme lapplication native Photos qui fait dfiler des photos de lalbum du tlphone intervalle rgulier.

> Modern UI
Windows Phone 8 amne une nouvelle interface : Modern UI. En vrit, il sagit plutt dune volution de lancienne interface de Windows Phone 7. Une nouveaut importante de cette interface est sans doute la possibilit pour lutilisateur de modifier la taille des tuiles, trois tailles tant disponibles. Cela sajoutant aux tuiles dynamiques et aux nouvelles couleurs dinterface, la possibilit de personnaliser son Windows phone augmente donc encore un peu plus. Mais au-del de laspect utilisateur, Windows phone 8 apporte des guidelines suivre pour tous les crateurs dapplications Windows

PROgrammez !

< 46 >

JANVIER

2013

i dveloppement mobile
> Nokia Navtech Map Control
Sous Windows Phone 7, le seul moyen dintgrer des cartes aux applications tait dutiliser le Control Bing Map du SDK. Sous Windows Phone 8, ce contrle cde sa place au Nokia Navtech Map Control. Ce contrle apporte toute une srie de nouveauts par rapport son prdcesseur, allant du paysage 3D jusqu lintgration de certaines informations utiles aux pitons, linfo trafic... Dun point de vue dveloppement, Fig.2 le contrle Nokia remplace compltement celui de Bing, ce qui implique seulement des mthodes en plus pour le dveloppeur. Le contrle Nokia apporte en plus des fonctionnalits dj prsentes dans lapplication Nokia Drive comme les cartes de Jour et de Nuit, des car tes satellites et ariennes mais aussi des cartes indiquant le relief du terrain. Enfin le plus gros avantage quapporte ce nouveau contrle est sans aucun doute la capacit de tlcharger des cartes afin de les utiliser en mode offline [Fig.2].

> Portefeuille
Nouvelle fonctionnalit arrivant avec Windows Phone 8, le Portefeuille. Il va simplifier la vie de lutilisateur en permettant le regroupement des car tes de crdits, de fidlit et des coupons de rductions. Ce portefeuille lectronique permet aussi de conserver lhistorique des transactions. Petite ombre au tableau, cette fonctionnalit nest pas compatible avec tous les modles de tlphones. LAPI propose aux dveloppeurs dinteragir avec cette application, tendant idalement les applications e-commerce [Fig.3].

> Vente dapplications

Au niveau de la montisation dapplication, Windows Phone 8 reprend les mmes lments de Windows Phone 7. On retrouve donc le moyen de publier une application en version gratuite ou payante. Une application payante peut tre mise disposition lessai, laissant au crateur dapplication le choix des fonctionnalits actives durant la priode dessai. La priode dessai pouvant tre illimite, cela permet de ne publier quune seule fois lapplication si lon souhaite la rendre disponible en version payante et gratuite. Du point de vue des applications payantes, le Store Microsoft permet de vendre des applications entre 0.99$ et 499.99$. Les prix dans dautres monnaies dchange sont calculs en fonction de taux de changes fixes. 70% du prix de vente de lapplication reviendra au dveloppeur, les 30% restant allant Microsoft.

> API vocale

La plateforme Windows Phone inclut un composant de reconnaissance et de synthse vocale dans le tlphone. Arriv avec la version 7 il se prsentait sous le nom de TellMe et permettait aux utilisateurs de faire quelques oprations de manire vocale (appeler un contact, faire une recherche sur internet). Depuis la toute dernire version (8.0), le vocal sur Windows Phone a fait un bond en avant et rattrape, voire devance, les alternatives. TellMe change de nom pour lAPI Speech, et propose dsormais la possibilit aux dveloppeurs dutiliser la reconnaissance et la synthse vocale au sein de leur application. Hormis le mode dicte classique (la phrase de lutilisateur est entirement reconnue), lAPI speech permet de grer des grammaires (liste finie de mots) ce qui vite les problmatiques rcurrentes dans le domaine de la reconnaissance vocale. A savoir : les mots trop spcifiques qui ne sont pas prsents ou mal reconnus par la plateforme de reconnaissance. Cette API permet aussi de faire de la synthse vocale (le texte est lu par le tlphone) de manire avance grce lintgration de SSML (Speech Synthesis Markup Language Reference) comme mode de description du texte. Il est possible par exemple de dfinir la rapidit laquelle doit tre lue un texte. La reconnaissance et la synthse vocale fonctionnent dans diffrentes langues. Il est possible dutiliser sur un mme tlphone des langues diffrentes que ce soit pour la synthse ou la reconnaissance vocale, noter que toutes les langues ne sont pas installes par dfaut. De plus, lenvironnement Windows Phone permet au dveloppeur dajouter des commandes vocales pour le dmarrage de son application. De base, il est possible de lancer une application en disant Dmarrer application , mais la plateforme va plus loin en proposant aux dveloppeurs dajouter des commandes vocales comme Dmarrer application et rechercher information , qui aura pour effet damener lutilisateur directement la fonctionnalit recherche.

> Store et publication

Afin de publier votre application, vous devez crer un compte sur le Windows Phone Store. Un abonnement annuel est ncessaire pour pouvoir publier et maintenir vos applications. Si vous tes tudiant et que votre universit adhre au programme Microsoft Dreamspark, alors vous aurez droit un an dabonnement gratuit. La publication est une tape critique pour votre application. Le Store impose des rgles et des tests qui doivent tre respects. Parmi les rgles les plus importantes figurent : demander la permission lutilisateur pour laccs la localisation ou au push, ne pas dpasser les limites dutilisation mmoire, fournir des captures dcran, fournir des icnes dans les tailles demandes. Une fois la publication effectue, les quipes de Microsoft vont tester votre application afin de vrifier sa conformit. Tout problme entranera lenvoi dun rapport de tests stipulant les lments bloquants. Entre autres, lapplication ne doit pas planter , linterface doit rester ractive tout le temps, lutilisateur doit toujours pouvoir recevoir un appel sans drangement, le design doit tre soign Ce processus rigoureux est en place pour viter de proposer aux utilisateurs des applications instables ou ne rpondant pas aux rgles.

Fig.3

PROgrammez !

< 47 >

JANVIER

2013

i dveloppement mobile
> Publicit
Afin de montiser des applications gratuites, Microsoft propose dans le SDK un framework appel le Ad Framework. Il permet dintgrer facilement un contrle daffichage de publicit dans lapplication. Une fois le contrle intgr, il suffit de senregistrer sur le Microsoft Advertising Pub Center afin de dterminer le type de publicit affich dans lapplication. Bien entendu, rien nempche dintgrer un autre type de contrle de publicit. photo, il faudra le dvelopper vous-mme par code ou par lutilisation dune librairie tierce.

> Communication app-to-app

Windows Phone 8 intgre aussi un modle de communication appto-app afin de rendre possibles des scnarios comme dmarrer une conversation Skype depuis une autre application. Pour activer la rception de communication pour votre application, il suffit de dclarer dans le manifest que vous souhaitez supporter la rception dune URL dont vous dciderez de la structure. Le manifest est un document XML dans lequel on dclare les prrequis de lapplication et ses connectivits avec le reste du systme. Imaginons que ladresse myapp:user=1234 dsigne un utilisateur de votre application. <Protocol Name=myapp TaskID=_default NavUriFragment=encodedLaunchUri=%s /> Ce simple code permet de sabonner la rception dun lien dutilisateur Myapp et permet une application de demander la vtre douvrir llment dsir. Envoyer le code par SMS fonctionne : le systme cre un lien ouvrant lapplication. Scanner le code par NFC permet aussi le lancement de lapplication. Ct code, vous devez crer une classe hritant de UriMapperBase dans laquelle vous pourrez lire le lien par vous-mme et provoquer louverture dune page de votre application comme vous le souhaitez. Pour appeler une autre application dont vous connaissez ladresse associe, utilisez la class Launcher avec la mthode LaunchUriAsync. Windows.System.Launcher.LaunchUriAsync(new Uri(myapp:user=1234)); Si aucune application nest installe pour recevoir lURL, lutilisateur sera invit consulter la liste de toutes les applications supportant le protocole dans le store. Si plusieurs applications rpondent la mme extension de fichier, lutilisateur sera systmatiquement invit choisir lapplication souhaite. En conclusion, nous allons pouvoir dvelopper des applications forte capacit de partage dinformations (publications sur rseaux sociaux, transfert par proximit...). Tous les moyens sont bons pour ouvrir une application avec leur adresse : par SMS, NFC, email, un lien sur une page web.

> In-app purchase

En plus de leur contenu de base, certaines applications peuvent voluer au fil du temps et permettre lutilisation de nouvelles fonctionnalits. Les dveloppeurs de ces applications peuvent faire payer ces fonctionnalits supplmentaires afin daugmenter leurs revenus. Pour cela, Microsoft met disposition via lAPI le moyen dacheter directement dans lapplication de nouvelles fonctionnalits. Chaque fonctionnalit aura un Token qui permettra de lidentifier dans lapplication mais aussi dans le Windows Store. Ce Token est une chane de caractres permettant didentifier le block de code correspondant une fonctionnalit dans le code, ainsi que de dvelopper plus rapidement linterface graphique dachat lintrieur de lapplication. Bien sr, le prix de ces fonctionnalits devra tre dtermin dans la partie Advanced Features du processus denregistrement dapplications sur le Store.

> Enterprise Store

A ct du Windows Store pour les utilisateurs normaux, il existe un Windows store spcial pour les entreprises. Ce Store un peu particulier est disponible pour toute entreprise ayant un compte Microsoft Portail. Chaque entreprise dispose de son propre store o les applications doivent tre signes et o il faut un compte entreprise afin de sy connecter. Sur ce type de Store, les applications publies ne passent pas les diffrentes tapes de certifications comme pour une application grand public, cest lentreprise qui est tenue comme responsable de lapplication. Il est nanmoins toujours possible pour celle-ci dutiliser le kit de test utilis pour certifier les applications. Lavantage de ce type de store en interne, cest quune fois connect avec un compte de lentreprise, toutes les applications ncessaires sont automatiquement installes et mises jour. Bien entendu, rien nempche ladministrateur du Store de republier des applications grand public sur le Store interne de lentreprise.

> Associations fichiers

Le SDK fournit la capacit une application de sassocier des types de fichier afin de laisser lutilisateur le choix de lapplication dmarrer pour ouvrir un fichier (depuis un email, internet...). Cet extrait de fichier manifest montre comment indiquer que votre application peut ouvrir les fichiers C# dont lextension est .cs. Comme pour les oprations app-to-app, il suffit dhriter une nouvelle classe de UriMapperBase pour crire le comportement douverture du fichier dans votre application. <Extensions> <FileTypeAssociation Name=C# code file TaskID=_default Nav UriFragment=fileToken=%s> <Logos> <Logo Size=small IsRelative=true>Assets/file-csharp33x33.png</Logo> <Logo Size=medium IsRelative=true>Assets/file-csharp69x69.png</Logo> <Logo Size=large IsRelative=true>Assets/file-csharp-

> Rseaux sociaux

Windows Phone permet lutilisateur de configurer ses profils sociaux dune faon unifie. Les rseaux supports sont Facebook, Twitter et LinkedIn. Le premier avantage est lintgration des flux sociaux dans les applications prinstalles. Le second avantage est de pouvoir publier sur ces rseaux depuis vos applications par lusage dune tche de partage. Deux tches sont disponibles : partager un statut et partager un lien. ShareStatusTask shareStatusTask = new ShareStatusTask(); shareStatusTask.Status = Im developing a Windows Phone application!; shareStatusTask.Show(); Malheureusement, ces tches de partage sont limites en termes de fonctions disponibles. Si vous souhaitez effectuer des tches de partage complexes depuis votre application, comme publier une

PROgrammez !

< 48 >

JANVIER

2013

i dveloppement mobile
176x176.png</Logo> </Logos> <SupportedFileTypes> <FileType ContentType=text/plain>.cs</FileType> </SupportedFileTypes> </FileTypeAssociation> </Extensions> Il ne reste plus qu grer larrive dun fichier dans votre application et louvrir. Si plusieurs applications supportent le mme type de fichier, lutilisateur sera invit choisir lapplication de son choix. Si aucune application nest installe, il sera invit en trouver une sur le Store.

> Clavier
Une fonctionnalit assez intressante prsente sous Windows Phone 8 est la possibilit de changer le type de clavier visuel selon le type dentre raliser. Si loption parait sympathique utiliser afin de faciliter la vie de ses utilisateurs, elle peut sembler plus dure mettre en place pour le dveloppeur. Cest sur ce point justement que lon se trompe tant donn que Microsoft a rendu les choses trs simples. Un exemple valant mieux quun long discours : XAML : <TextBox InputScope=Number Name=txtPhoneNumber /> C# : InputScope scope = new InputScope(); InputScopeName name = new InputScopeName(); name.NameValue = InputScopeNameValue.Number; scope.Names.Add(name); txtPhoneNumber.InputScope = scope; On voit donc par cet exemple que le changement du type de clavier se ralise en quelques lignes de code. De quoi sans doute donner plus dides aux dveloppeurs voulant crer des applications simples et pratiques lutilisation [Fig.4].

Fig.4

Puissance de Microsoft
Un des plus gros avantages dont dispose Windows Phone 8 est sans aucun doute son appartenance larmada Microsoft. En effet, la firme de Redmond lui permet de profiter dun grand nombre dapplications et de services dj prouvs. Dun point de vue utilisateur on peut compter sur la compatibilit entre les versions mobiles et PC de la suite Office, la liaison entre Zune et la bibliothque de musiques et de vidos ainsi quavec le service Xbox Music. Skydrive vient aussi ajouter son lot de bnfices cette interconnexion de priphriques. Dun point de vue dveloppeur le SDK de Skydrive permettra dutiliser le compte stockage de lutilisateur que ce soit pour la lecture ou lcriture de donnes. En partant de ce qui a t dit ci-dessus, il serait tout fait normal quun dveloppeur vienne crer une application Windows Phone qui utiliserait Skydrive afin de stocker un fichier de configuration qui serait lui-mme utilis pour la version PC de cette mme application. Cela permettrait donc un dveloppement en parallle de version mobile et PC de futures applications.

dans la version prcdente, Blend est directement compris avec Visual Studio 2012, facilitant ainsi la vie des dveloppeurs qui nont plus deux tlchargements et installations raliser. Ces deux outils trs complmentaires permettent de dvelopper des applications dune meilleure richesse visuelle via Expression Blend qui autorise la cration danimations (ce qui est difficile avec Visual Studio). Cette nouvelle version de Blend apporte aussi des amliorations par rapport son prdcesseur. On peut par exemple citer des outils de dveloppement pour le CSS ainsi que lIntelliSense pour le CSS. Visual Studio va vous permettre de dvelopper vos applications en XAML+C# mais aussi en HTML ou XNA ou Direct3D (C++). Pour des raisons de scurit, le SDK ne permet pas daltrer le systme comme on pourrait le faire sur dautres plateformes. Vos applications sont excutes dans un environnement isol, empchant lcriture de code malicieux. Impossible donc daccder au systme de fichier ou de crer votre propre clavier visuel. Windows Phone nest donc pas un systme profondment customisable mais plutt un systme robuste et scuritaire.

Conclusion
En conclusion, Windows Phone 8 apporte toute une srie damliorations et de fonctionnalits pour sduire les utilisateurs de Smartphones, mais aussi des outils de dveloppement complets pour dveloppeurs qui sauront sans doute apprcier lattention que leur porte Microsoft avec ce nouvel OS mobile. Ensuite, la qualit de ces nouveauts ainsi que lnergie dpense par les crateur de cette nouvelle version montrent quel point Microsoft se soucie dtendre son public, que ce soit dutilisateurs, en prservant lexprience dutilisation entre ses diffrentes plateformes, ou de dveloppeurs, en essayant de leur simplifier la tche au maximum. Enfin, Windows Phone 8 dbarque sur le march des Smartphones en se plaant dabord comme une volution et non comme une simple mise jour de Windows Phone 7. # Giovanni Clment, Antoine Sottiau, Nicolas Tonneau, Mathias Herbaux Wygwam

Visual Studio et Blend

Windows Phone 8 amne avec lui des nouveaux outils de dveloppement, Visual Studio 2012 et une nouvelle version de Blend. Comme

PROgrammez !

< 49 >

JANVIER

2013

i carrire

Dveloppeur mobile : une carrire pleine davenir ?

Avec lexplosion du dveloppement des applications pour smartphones et tablettes, le dveloppeur doit-il envisager une carrire dans ces domaines, surtout avec la convergence entre les diffrents systmes ? Il y a des opportunits saisir. Mais il ny aura pas de place pour tout le monde !
> Un profil exigeant
Qui est donc le dveloppeur mobile (plus prcisment pour smartphone et tablette) ? Nos diffrents entretiens avec des diteurs et SSII dresse le profil suivant : cest un dveloppeur plutt jeune (25-30 ans), avec souvent une sensibilit lergonomie et au design (un point important quil ne faut pas ngliger), il comprendra (un peu) mieux le fonctionnel et les usages (autre point sensible sur mobile), il a fait des dveloppements professionnels, ou pour son loisir, il matrise au moins une plateforme mobile. Nous avons un grand nombre dingnieurs autour de 30 ans. Nos dveloppeurs mobiles sont un peu plus jeunes. Certains dveloppeurs se sont mis la mobilit et il est important davoir des dveloppeurs qui connaissent les usages , prcise Emmanuel Gauthier dirigeant dAZEO. Lidal est un dveloppeur hybride connaissant iOS, Android et Windows 8 / Windows Phone 8. Souvent, le dveloppeur a une exprience sur une plateforme. Nous avons aussi besoin de dveloppeurs pointus sur un systme, une technologie, par exemple, un dveloppeur iOS matrisant le Core Animation , recadre Christophe Claudel (Prsident et fondateur dItelios). Le dveloppeur ayant une vision globale de la mobilit avec une sensibilit au multiplateforme est un profil pas aussi frquent quil ny parat, except sur la partie iOS / Android. Mais un des problmes voqus est que chaque plateforme a son propre modle de dveloppement Lautodidacte sera apprci surtout sil prouve ses qualits. La certification sur une ou plusieurs plateformes sera un plus sur votre C.V. mais pas lultime ssame pour se faire recruter. des comptences, mais peu ont lexpertise ncessaire pour mener des projets de plus de 15 jours-hommes. Donc, lorsquon cherche les profils ayant cette expertise, le march est clairement tendu , commente J-B Boisseau (Eutech SSII). Nous trouvons beaucoup de dveloppeurs. Mais le plus difficile est de faire le tri, nous voyons beaucoup de profils junior avec peu dexprience , nuance Christophe Claudel. La candidature spontane est aussi un bon moyen pour se faire recruter. La proportion de dveloppeurs mobiles augmente rapidement : par exemple chez Eutech SSII, 50% des projets ont t lis la mobilit en 2012. Chez Itelios, dici fin 2013, les dveloppeurs mobiles reprsenteront un tiers des effectifs. Les SSII spcialises et diteurs mobiles continueront recruter en 2013. Exemple dannonces sur lesjeudis.com (au 12 dcembre) : profils divers Android (avec parfois Android / iOS) : 56 offres demploi profils divers iOS : 40 offres (sans compter les offres spcifiques iPad) profils Windows Phone 8 : difficiles trouver. Salaire : trs variable Les profils ayant dj une exprience significative pourront bien se valoriser et de ce fait viser au-dessus des moyennes habituelles. La seule difficult est que les employeurs/donneurs dordre ont encore du mal faire la diffrence entre le dveloppeur sachant un peu bricoler sur smartphone et un ingnieur de dveloppement capable de prendre en charge un projet significatif , explique J-B Boisseau. La fourchette de dpart sera celle dun dveloppeur classique , aux alentours de 28 / 30 K . Les profils experts monteront facilement 35, voire, 38/40 K . Mais comme loffre et la demande nest pas en dsquilibre, nous ne constatons pas de pressions particulires sur les salaires. # Franois Tonic

> Un march de lemploi fluide

La demande de dveloppement mobile explose depuis 2 ans. Les profils iOS / Android demeurent la rfrence. Windows Phone 8 est encore trop rcent pour voir son rel impact sur le recrutement, mais des SSII spcialises en technologies Microsoft recrutent et forment celles-ci. Le march est surtout difficile apprhender ! Cest un peu leffet que lon a pu connatre la fin des annes 90 pour le web. Beaucoup dintervenants disent avoir

Un exempl de recrutement :Genymobil e e

Genymobile, spcialise en technologies mobiles et objets connects, annonce rechercher 20 collaborateurs supplmentaires pour le 1er semestre 2013 (dveloppeurs et ingnieurs systmes Android, ainsi que des commerciaux, responsables communautaires, etc.). Ce qui fait notre originalit est avant tout une offre unique sur le march europen. En effet, nous sommes la seule socit proposer des solutions et services 100% Android. Grce nos quipes en place, nous dveloppons des applications forte valeur ajoute. Ce succs, on le doit nos collaborateurs, tous passionns par leur mtier. Genymobile est un laboratoire, o les ides se dveloppent et les comptences se ctoient au quotidien afin doffrir le meilleur nos clients , explique Cdric Ravalec, le CEO de Genymobile.

PROgrammez !

< 50 >

JANVIER

2013

i je dbute avec...

M igrezvos applications vers ASP. 4. NET 5

2e partie

ASP.NET est un langage compil et qui permet aux dveloppeurs de raliser des sites web dynamiques, des applications web et des Web Services tout en ayant accs aux fonctionnalits que peuvent offrir le Framework .NET (support du XML, les interactions avec la base de donnes, email, les expressions rgulires...).

ommenons par crer notre premire application Web API en ajoutant un nouveau projet ASP .NET MVC4 > Web API, avec le moteur de vue Razor [Fig.1]. Nous nous intresserons dans ce premier exemple 2 lments du projet cr : Le rpertoire Models Le rpertoire Controllers

Fig.1

> Les modles

Comme dans tout projet MVC, les modles contiennent la logique mtier. Ajoutons leur une nouvelle classe POCO Utilisateur : namespace Programmez.Models { public class User: { public int Id { get; set; } public string Login { get; set; } public string Password { get; set; } } } Nous voulons exposer une API dadministration permettant de manipuler ces utilisateurs. Pour ce faire, en nous basant sur le pattern Repository [Fig.2](http://martinfowler.com/eaaCatalog/repository.html), nous allons ajouter une interface notre modle : namespace Programmez.Models { public interface IUserRepository { IEnumerable<User> GetAll(); User Get(int id); User Add(Product item); void Remove(int id); bool Update(User item); } } Et ensuite une classe UserRepository : namespace Programmez.Models {
Fig.2

public class UserRepository : IUserRepository { private List<User> users = new List<User>(); private int _nextId = 1; public UserRepository () { Add(new User { Login = user1, Password = pwd1 }); Add(new User { Login = user2, Password = pwd2 }); Add(new User { Login = user3, Password = pwd3 }); } public IEnumerable<User> GetAll() { return users; } public User Get(int id) { return users.Find(p => p.Id == id); } public User Add(User item) { if (item == null) { throw new ArgumentNullException(item); } item.Id = _nextId++; users.Add(item);

PROgrammez !

< 51 >

JANVIER

2013

i je dbute avec...
return item; } public void Remove(int id) { users.RemoveAll(p => p.Id == id); } public bool Update(User item) { if (item == null) { throw new ArgumentNullException(item); } int index = users.FindIndex(p => p.Id == item.Id); if (index == -1) { return false; } users.RemoveAt(index); users.Add(item); return true; } } } Nous voici donc prts manipuler nos donnes. Cest logiquement le contrleur qui se charge de ces oprations. Par convention, Web API cherche une mthode commenant par le nom de la mthode http, et affine ensuite en fonction de la prsente et le nom des paramtres. Ce comportement est dbrayable laide dattributs. Notons ensuite que des classes HttpResponseMessage et HttpResponseException permettent de retourner des rsultats http conformes. Le rsultat renvoy par lAPI est un message XML ou JSON par dfaut, ou alors un format dfinir, qui devra tre gr ct client comme ct serveur. Pour tester manuellement votre API, un navigateur suffira. En appelant une URL de lAPI, un objet JSON ou XML sera renvoy. Il est lisible dans un diteur de texte. Pour consommer rellement le service, les possibilits sont larges ! Javascript JQuery, nouvelle classe .NET HttpClient, iOS, etc. taines mthodes. Notons ensuite que notre classe UsersController contient une variable repository de type IUserRepository. Cest donc le contrleur qui fait office de passe-plat entre lappel lAPI et le modle. Enrichissons maintenant notre contrleur : public IEnumerable<User> GetAllUsers() { return repository.GetAll(); } public Product GetUser(int id) { User item = repository.Get(id); if (item == null) { throw new HttpResponseException(HttpStatusCode.NotFound); } return item; } public HttpResponseMessage DeleteUser(int id) { repository.Remove(id); return new HttpResponseMessage(HttpStatusCode.NoContent); }

> Le routage
Le protocole http expose 4 mthodes : GET, POST, PUT et DELETE. Chacune de ces mthodes sera associe une ou plusieurs mthodes de nos contrleurs de faon interagir avec nos donnes. Par dfaut, nous allons avoir les routes suivantes :
Action HTTP method Relative URI

Rcuprer les users GET /api/users Rcuprer un user par son id GET /api/users/id Rcuprer les users dont le login correspond GET /api/users?login=loginPattern Crer un user POST /api/users Mettre jour un user PUT /api/users/id Supprimer un user DELETE /api/users/id

> Conclusion
Cet article a pour but de faire un rapide tat des lieux sur comment et pourquoi migrer vos applications ASP .NET existantes vers ASP .NET 4.5. Nous sommes convaincus que cette migration vaut la peine dtre effectue et elle peut dailleurs ltre de faon progressive. De forts gains en lisibilit et maintenabilit peuvent tre esprs. Et enfin, MVC4 permet de bnficier des apports de Web API, qui offre la possibilit dexposer des services REST de faon simple et lgante. # Nicholas Suter Architecte Logiciel chez Cellenza Cellenza - Software Development Done Right Blog : http://www.cellenza.com/author/nsuter/

> Les contrleurs

Clic droit sur le rpertoire Controllers, ajouter un nouveau contrleur, que nous allons nommer UsersController. Une classe UserController est gnre dans le fichier Controllers/UserController.cs. public class UsersController : ApiController { static readonly IUserRepository repository = new UserRepository(); } Notons tout dabord quelle hrite dApiController. Cest cette classe qui dfinit notamment toutes les rgles de configuration et de routage. En effet, linstar du DbContext dEntityFramework, le fonctionnement par dfaut dApiController est bas sur les conventions. Il est possible de personnaliser ce comportement en surchargeant cer-

# David Tran Consultant chez Cellenza Cellenza - Software Development Done Right

PROgrammez !

< 52 >

JANVIER

2013

i je dbute avec...

J dbute avec le kit de dmarrage e ASP . M VC net

La technologie Open Source ASP.net MVC a le vent en poupe. Vous avez envie de vous lancer, nhsitez pas ! Elle est excellente, cest la meilleure pour dvelopper des applications web pour navigateurs ou Smartphones. Dbutons avec le kit de dmarrage dInnovacall.
Dapparence facile ce nen est pas moins une technologie web qui ncessite une bonne matrise des technologies suivantes : HTML Razor ou ASP .net CSS Entity Framework JavaScript IIS 7.5 JQuery SQL Server (ou compatible EF) C# ou VB.net Les kits de dmarrage Innovacall permettent dviter les adaptations ncessaires au contexte dexploitation (Interne, externe ou Azure). Il ne sagit donc pas dune nouvelle technologie ou dune version concurrente de MVC, au contraire, cest plutt un facilitateur destin des environnements plus ralistes que ceux des dmos. Sources et portail de dmonstration (pour ASP .net MVC 4.0) : http://innovacallframework.codeplex.com http://framework.innovacall.net Dans cet article, vous trouverez une description des principaux lments qui constituent le kit de dmarrage ainsi que la marche suivre pour crer un nouveau projet. MetaData layer Contient les modles partiels utiliss par les vues dont les membres sont automatiquement dcors des attributs ncessaires la localisation et la validation. Gnre par POCO T4, les classes ont la mme signature que les classes du domaine pour faciliter le mapping. Spcifique chaque portail (Gnre automatiquement : ne doit pas tre modifie) Resources layer Centralise lensemble des ressources pour la localisation. Spcifique chaque portail (Peut-tre partiellement gnre automatiquement mais je ne fournis pas ce POCO T4) Security layer Roles & Membership provider sappuyant sur Entity Framework. Il est possible de le personnaliser pour affiner lisolation des donnes ligne par ligne. Spcifique chaque portail (Gnre automatiquement : ne doit pas tre modifie) Service layer Couche optionnelle destine centraliser les appels aux web services. Spcifique chaque portail Content CSS spcifiques aux composants clients spars de ceux qui sont spcifiques aux vues. Controllers Contrleurs MVC qui hritent de Controller_Base<T> du Framework. Un contrleur par vue. Models Structure hirarchise, le premier niveau contient le ViewModel qui hrite de ModelBase qui contient des MetaModel qui hritent des MetaData. Scripts Mme principe que pour les CSS. Les scripts des composants clients sont spars de ceux des vues. Views Vues MVC avec implmentation des EditorTemplates qui portent le nom des MetaModels

> Contenu du kit de dmarrage

Framework Framework Couches dabstraction Dossiers du portail _Controllers_Base<T> : Controller where T : _Models_Base Premier niveau de factorisation des contrleurs, classe gnrique qui hrite du premier niveau de factorisation des modles. _Models_Base contient les membres qui alimentent la vue partage : _Layout. Contient galement de nombreux outils, extensions et helpers. Doit tre partag par tous les projets MVC du S.I. Les outils Peuvent-tre utiliss par des projets non MVC. Business layer Contient le code mtier, cest--dire les fonctionnalits spcifiques lactivit pour laquelle il est cr. Partage par tous les projets MVC du SI qui en ont besoin. Common layer Couche ddie la factorisation des classes partages par plusieurs couches. Contient les enums extraits de la base gnrs par un POCO T4 ; la mthode de rendu des vues partielles en chane de caractres permettant la conservation de la mcanique MVC dans les rponses Ajax. Partage par tous les projets MVC du SI qui en ont besoin. Data layer Contient la classe DataRepositories (contexte de donnes qui permettent laccs aux entits) Partage par tous les projets MVC du SI qui en ont besoin (Gnre automatiquement : ne doit pas tre modifie) Domain layer Contient les entits utilises par le DataRepository. Chaque portail dot dune EntityLayer et dune DataLayer doit avoir une DomainLayer. (Gnre automatiquement : ne doit pas tre modifie, sauf hritage dinterface coder dans le POCO T4) Entity layer Contient lEDMX dEntity dont la stratgie de gnration de code est dsactive. Spcifique chaque portail (Seul lEDMX peut tre modifi, je suggre vivement une utilisation database-first)

> Fichiers de configuration

AppSettings.config ConnexionString.config JQueryCss.config mailSettings.config web.config Contient les paramtres de lapplication (peut tre complt par vos paramtres) Contient la ou les chanes de connexion Contient la liste des fichiers javascript et css qui seront inclus dans toutes les pages Contient le paramtrage pour lmission des e-mails Web.config classique

> Fondamentaux
Ce framework est plus strict que le MVC original. Il impose les rgles suivantes : A chaque vue correspond un contrleur et un seul Chaque contrleur est spcialis pour le ViewModel Le Contrleur doit imprativement hriter de _Controller_Base<T> du framework Le ViewModel doit imprativement hriter de _Model_Base du framework Les donnes fonctionnelles du ViewModel sont encapsules dans des MetaModels (classes qui hritent de MetaData gnres partir du modle Entity Framework)

PROgrammez !

< 53 >

JANVIER

2013

i je dbute avec...
> Les modles
Les modles sont de simples classes destines au transport des donnes entre le client et le serveur. Leurs membres sont dcors dannotations ncessaires au nommage et la validation des champs. Les modles inclus sont donc plus structurs que les classes utilises avec MVC original : les modles du kit ont t prfactoriss pour la mcanique de fonctionnement de la page : 4 Framework 2 Portal 1 Portal _model_base _model_base [View]Model Membres permettant dalimenter la vue _layout.cshtml Membres et mthodes communes aux couches et au portail Membres et mthodes communes aux contrleurs du portail Membres et mthodes ncessaires linitialisation de la vue { ContentData.Contact = ObjectMapperManager.DefaultInstance.Get Mapper<Contact, Contact_MetaModel>().Map(dbContact); } List<SelectListItem> Genres = _dataContext.Genre_Rep.GetAll(). OrderBy(x => x.SortIndex).Select(x => new SelectListItem() { Value = x.Id.ToString(), Text = x.Name, Selected = (x.Id == ContentData. Contact.FK_Genre) }).ToList(); Genres.Insert(0, new SelectListItem() { Value = -1, Text = string. Empty, Selected = (dbContact == null) }); ContentData.Contact.Genres = Genres;

3 CommonLayer _model_base

> Les contrleurs

Comme pour les modles, la logique suit celle du MVC original et ils sont galement pr-factoriss pour que les mthodes dalimentation des membres factoriss des modles soient en correspondance avec ces derniers. Le comportement original est garanti par hritage :

Initialisation de la vue _Layout.cshtml

@using INNOVACALL.Framework.Common @using InnovaApp.Layers.ResourcesLayer.Properties @{ InnovaApp.Layers.CommonLayer.Models._Models_Base layoutModel = (InnovaApp.Layers.CommonLayer.Models._Models_Base)Model; } Et pour la partie donnes fonctionnelles 1 Portal MetaModel Membres permettant dalimenter les choix et les collections Membres dcors des attributs MVC

Pour le contrleur de base du Framework

public abstract class _Controllers_Base<T> : Controller where T : INNOVACALL.Framework.Common.Models._Models_Base

Pour un contrleur du portail

public class Sample_BasicForm_MyProfileController : _Controllers _Base<Sample_BasicForm_MyProfileModel> [Fig.2] Cela permet dune part de forcer tous les contrleurs dhriter de la Classe Controller native MVC pour garantir un comportement similaire un contrleur standard et dautre part de spcialiser chaque contrleur pour une classe qui hrite de _Modele_Base crant ainsi un parallle entre la structure factorise du modle et celle du contrleur de sorte qu chaque hritage, on trouve les traitements correspondant aux membres du modle du mme niveau.

2 MetaDataLayer MetaData [Fig.1]

Initialisation des donnes du modle dans lexemple Sample_BasicForm_MyProfile

MembershipUser CurrentUser = Membership.GetUser(); Contact dbContact = _dataContext.Contact_Rep.Query(x => x.FK_Inno AppUser == (Guid)CurrentUser.ProviderUserKey).FirstOrDefault(); if (dbContact == null) { ContentData.Contact = new Models.MetaModels.ContactManagement. Contact_MetaModel(); } else

Initialisation des variables qui alimentent la mthode InitView qui instancie le modle
protected override void Initialize(System.Web.Routing.Request Context requestContext) { base.eMethodBase = InnovaApp.Portals.InnovaAppFrontOfficePortal. Controllers.Sample_BasicForm_MyProfileController; base.specificCssCollection = new string[] { _FormCommon.css,
Fig.2

Diagramme des classes modle de lexemple Sample_BasicForm_MyProfile du portail de dmo.

Fig.1

La variable correspondant au ViewModel dans le contrleur sappelle toujours ContentData.

Diagramme des classes Controller de lexemple Sample_BasicForm_MyProfile

PROgrammez !

< 54 >

JANVIER

2013

i je dbute avec...
Views/Sample_BasicForm_MyProfile.css, ClientComponents/Code Formatting/csharp.css, ClientComponents/KendoUI/kendo.common .min.css, ClientComponents/KendoUI/kendo.blueopal.min.css }; base.specificJSCollection = null; base.dynamicJSCollection = new string[] { /ScriptsG/inoSample _BasicForm_MyProfileDynamic.js }; base.specificJqueryJSCollection = new string[] { ClientComponents /KendoUI/kendo.web.min.js, InnovacallJS/Sample_BasicForm_My Profile/Sample_BasicForm_MyProfile.js }; base.externalCSS = null; base.Meta.Add(enMeta.Description, Resources.View_Sample_Basic Form_MyProfile_Meta_Description); base.Meta.Add(enMeta.Keywords, Resources.View_Sample_BasicForm _MyProfile_OrderWithDetails_Meta_Keywords); base.Meta.Add(enMeta.Subject, Resources.View_Sample_BasicForm _MyProfile_OrderWithDetails_Meta_Subject); base.Initialize(requestContext); } { ContentData.Contact = ObjectMapperManager.DefaultInstance. GetMapper<Contact, Contact_MetaModel>().Map(dbContact); } List<SelectListItem> Genres = _dataContext.Genre_Rep.Get All().OrderBy(x => x.SortIndex).Select(x => new SelectListItem() { Value = x.Id.ToString(), Text = x.Name, Selected = (x.Id == ContentData.Contact.FK_Genre) }).ToList(); Genres.Insert(0, new SelectListItem() { Value = -1, Text = string.Empty, Selected = (dbContact == null) }); ContentData.Contact.Genres = Genres; } return View(ContentData); } }

Traitement transactionnel du post Ajax des donnes du formulaire Ajax de la vue

[HttpPost, Authorize, CacheManager(enCacheMode.NoCache)] public JsonResult Index(Sample_BasicForm_MyProfileModel model) { string eMethod = eMethodBase + Index[Post]; string returnToUrl = Request.QueryString[ReturnUrl]; string scriptToExecute = string.Empty; object eParameters = new { @modelContactId = model.Contact.Id, @modelContactFK_Genre = model.Contact.FK_Genre, @modelContact FirstName = model.Contact.FirstName, @modelContactLastName = model. Contact.LastName }; JsonResult toReturn = new JsonResult { JsonRequestBehavior = Json RequestBehavior.AllowGet }; using (TransactionScope TS = new TransactionScope()) { try { using (DataRepositories _dataContext = new DataRepositories()) { Guid currentUserId = (Guid)Membership.GetUser().Provider UserKey; Contact dbContact = _dataContext.Contact_Rep.Query(x => x.FK _InnoAppUser == currentUserId).FirstOrDefault(); if (dbContact == null) { dbContact = new Contact(); dbContact.FK_InnoAppUser = currentUserId; } dbContact.FK_Genre = model.Contact.FK_Genre; dbContact.FirstName = model.Contact.FirstName; dbContact.LastName = model.Contact.LastName; _dataContext.Contact_Rep.AddUpdate(dbContact); _dataContext.Save(); TS.Complete(); } if (!string.IsNullOrEmpty(returnToUrl)) { scriptToExecute = $.fn.NavigateTo( + returnToUrl + ); } toReturn.Data = new { @success = true, @scriptToExecute = script

Prparation du premier affichage de la vue (puisque toutes les vues sont Ajax)
[HttpGet, Authorize, CacheManager(enCacheMode.NoCache)] public ActionResult Index() { { using (DataRepositories _dataContext = new DataRepositories()) { base.InitView( Resources.View_Sample_SingleControl_DropDownList_PageTitle, Resources.View_Sample_SingleControl_DropDownList_PageMessage, specificCssCollection, specificJSCollection, dynamicJSCollection, specificJqueryJSCollection, jsVariables, externalCSS, Meta, _dataContext, True );

Chargement des donnes dans le modle via le ContentData instanci par InitView ci-dessus
if (Request.QueryString[ReturnUrl] != null) { ContentData.ReturnUrlMessage = Resources.View_Sample_ BasicForm_MyProfile_PageMessage_Redirected; } MembershipUser CurrentUser = Membership.GetUser(); Contact dbContact = _dataContext.Contact_Rep.Query(x => x.FK_ InnoAppUser == (Guid)CurrentUser.ProviderUserKey).FirstOrDefault(); if (dbContact == null) { ContentData.Contact = new Management.Contact_MetaModel(); } else

Models.MetaModels.Contact

PROgrammez !

< 55 >

JANVIER

2013

i je dbute avec...
ToExecute, @divToUpdate = string.Empty }; return toReturn; } catch (Exception ex) { TS.Dispose(); throw ex; } } }

> EditorTemplates et vues partielles

LEditorTemplate doit porter le mme nom que la classe (MetaModel) qui lalimente. Aucun dentre eux na pour suffixe MetaData pour une meilleure homognit. En pratique, mme si un MetaData se suffit lui-mme on cre quand mme un MetaModel qui hrite du MetaData pour amliorer lvolutivit.

EditorTemplate de la fiche contact

@model InnovaApp.Portals.MVC4Portal.Models.MetaModels.Contact Management.Contact_MetaModel <ol> <li> @Html.LabelFor(m => m.FK_Genre) @Html.DropDownListFor(m => m.FK_Genre, Model.Genres) @Html.ValidationMessageFor(m => m.FK_Genre) </li> <li> @Html.LabelFor(m => m.FirstName) @Html.TextBoxFor(m => m.FirstName, new { @class = k-input }) @Html.ValidationMessageFor(m => m.FirstName) </li> <li> @Html.LabelFor(m => m.LastName) @Html.TextBoxFor(m => m.LastName, new { @class = k-input }) @Html.ValidationMessageFor(m => m.LastName) </li> </ol> (Notez lutilisation de Html.LabelFor et Html.ValidationMessageFor conformment au Standard MVC4)

> Les vues

Seule volution par rapport aux vues standards : inutile dutiliser la gnration des liens vers les fichiers javascript et css puisque tout est pris en charge dans la vue matre. La combinaison des modles structurs et des EditorTemplates permet de crer des vues complexes simplifiant les mises jour partielles et le post final de toute la hirarchie.

Vue de lexemple Sample_BasicForm_MyProfile

@using InnovaApp.Layers.ResourcesLayer.Properties @model InnovaApp.Portals.MVC4Portal.Models.Sample_BasicForm_ MyProfileModel @section featured { <section class=featured> <div class=content-wrapper> <hgroup class=title> <h1>@Model._PageTitle</h1> <h2>@Model._PageMessage</h2> </hgroup> @if (!string.IsNullOrEmpty(Model.ReturnUrlMessage)) { <p class=yellowText>@Model.ReturnUrlMessage</p> } <p class=message-info> @Resources.View_Sample_BasicForm_MyProfile_Help. </p> </div> </section> } @using (Ajax.BeginForm(new AjaxOptions() { HttpMethod = Post, OnSuccess = $.fn.MainAjaxSuccess, OnFailure = $.fn.MainAjax Failure })) { <section> <fieldset class=centerMargin25 ui-widget ui-widget-content ui-corner-all padding15> <legend>@Resources.View_Sample_BasicForm_MyProfile_Field setCaption</legend> <div> @Html.EditorFor(m => m.Contact) </div> <input type=submit value=@Resources.View_Sample_Basic Form_MyProfile_Submit id=cmdSubmit /> </fieldset> </section> } PROgrammez !

> Les formulaires Ajax

Les vues avec formulaire utilisent toujours le formulaire Ajax
@using (Ajax.BeginForm(new AjaxOptions() { HttpMethod = Post, OnSuccess = $.fn.MainAjaxSuccess, OnFailure = $.fn.MainAjax Failure })) { . . . }

Modification de lattribut action du formulaire pour diriger lappel Ajax vers la bonne mthode
$.fn.AddDetailRow = function (evt) { . . . $(form).attr(action, /AdvancedSamples_OrderWithDetails/ AddRow); } Ils sont toujours paramtrs pour utiliser les mthodes JQuery gnriques $.fn.MainAjaxSuccess et $.fn.MainAjaxFailure. Seule $.fn.MainAjaxSuccess doit tre adapte. $.fn.MainAjaxSuccess = function (a, b, c) { if (a.success) { if (a.divToUpdate != null) { if (a.htmlContent != null) { $(a.divToUpdate).html(a.htmlContent); } else {

< 56 >

JANVIER

2013

i je dbute avec...
$(a.divToUpdate).html(); } if (a.scriptToExecute != null) { eval(a.scriptToExecute); } } } } Table Si Success=false le traitement a chou sur le plan fonctionnel alors que sil sagit dune erreur Ajax elle sera traite par $.fn.MainAjaxFailure. divToUpdate est llment dont le contenu HTML sera remplac par htmlContent. Enfin scriptToExecute permet deffectuer des traitements aprs la mise jour, par exemple un binding dEvent une fonction JQuery. SEC.InnoApplication Fonctionnalit Role & Membership Dpendance Security Layer, LogOn, LogOff, Register, BasicSample_ MyProfile, Advanced Sample Address Manager, Advanced Sample Order / Details Security Layer, LogOn, LogOff, Register, BasicSample_ MyProfile, Advanced Sample Address Manager, Advanced Sample Order / Details Security Layer Security Layer Security Layer Toutes les pages du portail de dmonstration lexception de LogIn, et register Modifier les fichiers de configuration pour quils correspondent votre environnement Compilez, lancez le projet

Modification de la base de donnes

Vous pourrez modifier la base de donnes toutefois, si vous ne souhaitez pas conserver les fonctionnalits natives didentification

SEC.InnoAppUser

Role & Membership

> Le portail de dmonstration

Cest le Starter Kit, Il suffit donc de supprimer les lments inutiles dans la table des menus pour dsactiver les exemples. Voici ses fonctionnalits. Presque Identique la version du modle de projet Internet original Seul le contrleur existe (pas de vue). Lorsque le contrleur est invoqu, il clture la session et redirige la rponse vers la page daccueil. Register Saisie des informations minimales pour la cration dun compte : E-Mail / & Activation Login / Password. Le compte est cr et un mail contenant un lien vers du compte une landing page dactivation de compte est envoy lutilisateur. ChangePassword Accessible en cliquant sur le nom de lutilisateur connect. Text box Ajax Dmo dun petit callback Ajax sans passer par un formulaire. Drop Down List Ajax Prsentation de la mcanique de remplissage dune liste droulante partir de la base de donnes, et du traitement Ajax du changement doption. Mon profil Formulaire simple avec persistance en base Gestion dadresses Liste des adresses / Saisie dadresse Prise de commande Formulaire complet de prise de commande avec choix des adresses et du mode de livraison et gestion Ajax des dtails. LogOn LogOff

SEC.InnoProfile SEC.InnoRole SEC.InnoUsersInRoles TLS.LayoutMenu

Role & Membership Role & Membership Role & Membership Menu principal

Une fois vos modifications faites, il vous suffit de rgnrer les POCO T4.

> Conclusion
Dans cet article, nous avons survol les principales caractristiques de ce kit de dmarrage pour ASP .net MVC 4 et les quelques oprations ncessaires la cration dun nouveau projet sappuyant sur cette bote outils. ASP .net MVC 4 est encore jeune, le kit de dmarrage Open Source nest publi que depuis quelques semaines. Plusieurs outils complmentaires sont prvus comme une extension pour Visual Studio qui automatisera plusieurs tches qui sont encore rptitives, un enrichissement de la documentation et des vidos de formation. La prochaine fois, je prsenterai un tutoriel plus complet sur la cration dune vue et de ses dpendances permettant dditer son propre contenu laide dun diteur WYSIWYG en introduction de MyPrettyCMS, notre petit CMS Open Source. Jespre sincrement que tout ou partie de ces sources vous seront utiles. # Laurent Jordi PDG Innovacal

> Cration dun nouveau projet

Prparation
Tlcharger la dernire version sur Codeplex : http://innovacallframework.codeplex.com Excuter le script de gnration de la base de donnes (SQL Server 2008 R2). Sassurer que la version du fichier kendo.web.min.js soit bien la dernire version de kendo ui

ABONNEMENT

Abonnement INTGRAL
Pour un supplment de

www.programmez.com
PROgrammez !

soit 2,73 le numro

30 par an

PDF
< 57 >

10

an

accs illimit aux archives

Cette option est rserve aux abonns pour 1 an au magazine, quel que soit le type dabonnement (Standard, Numrique, Etudiant). Le prix de leur abonnement normal est major de 10 (prix identique pour toutes zones gographiques). Pendant la dure de leur abonnement, ils ont ainsi accs, en supplment, tous les anciens numros et articles/ dossiers parus.

JANVIER

2013

i je dbute avec...

Prise en main de C++ AM P

Que vous soyez dveloppeur C++ ou bien mme C# sans connaissance sur la programmation GPU, cet article vous permettra de comprendre la fois les concepts inhrents la programmation sur GPU et leurs implmentations respectives via la librairie C++ AMP. Si au contraire, vous tes dj familier avec les technologies comme CUDA ou OpenCL, cet article vous permettra dapprcier lexpressivit de C++ AMP, la fois simple et efficace.
Remarque : Toutes les dmonstrations sont ralises avec Visual Studio 2012 sous Windows 8 x64, le tout excut sur un portable Lenovo W520 contenant un processeur Intel i72820QM cadenc 2,6 GHz et une carte graphique NVIDIA Quadro M2000. Si vous tes compltement novice en programmation parallle sur GPU, je vous propose une dmonstration provenant du premier ouvrage traitant de C++ AMP de Kate Gregory et Ade Miller: http://www.gregcons.com/cppamp/, dont les codes sources sont tlchargeables : http://ampbook.codeplex.com/releases/view/93158. La dmonstration repose sur une des trois tudes de cas du livre. Cette dmonstration se nomme Cartoonizer. Elle est parfois utilise par Microsoft pour dmontrer C++ AMP La motivation de cette . application est de modifier les couleurs des contours dune ou plusieurs photos sur le disque ou prises par la Webcam de votre ordinateur en une image similaire un dessin anim. Au lancement de lapplication, si vous chargez la premire image par dfaut, vous obtiendrez limage ci-contre. Lapplication regroupe sous plusieurs thmes des informations relatives au traitement des images. Si vous cliquez sur le bouton Start , toutes les images du dossier par dfaut seront traites, mais nous nutiliserons pas ce mode de traitement dans cette dmonstration. Nous utiliserons essentiellement les boutons regroups sous le nom Single Image , afin de traiter une image la fois [Fig.1]. Lobjectif de cette premire dmonstration est de vous sensibiliser la puissance GPU, et non dtudier le code de cette application. Dans la liste Frame Processor vous slectionnez la technologie de paralllisation et dans la liste Image source choisissez le mode rcupration des images. Vous devez cliquer sur Load pour charger la premire image par dfaut. Pour notre premier test, nous choisissons le mode Image from folder et CPU Single Core pour la liste Frame processor . Puis vous cliquez sur le bouton Cartoonize [Fig.2].
Fig.2 Fig.1

Vous devriez obtenir un rsultat similaire et dans mon cas, ce premier traitement utilisant un seul CPU a pris environ 72 secondes. Passons au second traitement en choisissant cette fois, CPU Multi-core dans la liste Frame processor . Puis chargez nouveau la premire image et lancez le traitement en appuyant sur Cartoonize [Fig.3]. Ce traitement repose en interne sur la librairie parallle C++ PPL disponible depuis Visual Studio 2010 [Fig.4]. En affichant le Task Manager , on peut observer la charge CPU au moment du traitement. Le traitement utilisant tous les curs du processeur a pris 15 secondes environ. Il nous offre une bien meilleure performance, ce qui na rien dtonnant. Cette fois, vous allez slectionner dans la liste Frame processors litem C++ AMP Simple Model : WRAP . Cet item correspond au mode de repli de C++ AMP dans le cas o votre machine ne contient aucune carte graphique compatible avec son implmentation interne (nous reviendrons sur ce point un peu plus loin) [Fig.5]. Cette fois, le Task Manager affiche un profil CPU bien plus
Fig.3

PROgrammez !

< 58 >

JANVIER

2013

i je dbute avec...
maigre que la version prcdente [Fig.6]. Noter que le mode WARP est vraiment performant, car il na pris que 3 secondes, mme sil nutilise pas de technique GPU. Cest donc une excellente alternative au traitement GPU, nous en reparlerons. Cette fois, vous allez slectionner dans la liste Frame processors litem C++ AMP Simple Model : Single GPU . Rechargez limage et lancez le traitement [Fig.7]. Le premier traitement utilisant une technologie GPU na pris que 351 millisecondes, ce qui est bien plus rapide que tous les autres traitements. Voici un rcapitulatif de tous les rsultats de cette premire dmonstration [Fig.8]. Cette premire dmonstration vous permet de comprendre la puissance du calcul avec C++ AMP Je vous propose maintenant de com. prendre ce quest C++ AMP en expliquant les motivations qui ont , permis Microsoft de se lancer dans ce projet. tions riches, des applications web et serveurs applicatifs, sont gnralement orients donnes, mais ne rclament pas des traitements massivement parallles. Par nature, les cartes graphiques sont destines calculer des informations graphiques pour afficher de trs nombreux pixels sur un ou plusieurs crans. Cependant, certains dveloppeurs graphiques dans les annes 2005 ont trouv astucieux dutiliser les cartes graphiques plutt que le CPU pour acclrer des calculs sur des volumes de donnes trs importants. Le calcul sur carte graphique est pertinent lorsque votre problme repose sur un immense volume de donnes traiter. Les cartes GPU possdent des architectures plus simples que les CPU, mais ont surtout un nombre impressionnant de threads que nont pas les CPU. Aujourdhui encore, les architectures matrielles des cartes graphiques sont construites pour obtenir des performances daffichage exceptionnelles. Le succs du calcul sur GPU de ces dernires annes a donn lieu des cartes professionnelles sans sortie vido, compltement spcialises dans la programmation massivement parallle sur GPU. Le problme est quaujourdhui, peu de gens possdent des comptences pour programmer les GPU. Ce type de programmation reste laffaire de quelques spcialistes que lon trouve gnralement dans les services R&D, de nombreuses industries rclamant des calculs trs coteux, mais aussi dans le domaine des jeux o on utilise souvent la puissance des GPU. En dautres termes, les dveloppeurs gnralistes ne connaissent pas la programmation GPU, car ils sont rarement face des traitements coteux, mais surtout parce que la programmation GPU est une technologie de niche complique mettre uvre. Le dveloppeur gnraliste souhaite rarement sinvestir dans une technologie intimiste souvent exprime en langage C. Il est accompagn dun cosystme relativement pauvre, mme si parfois il se trouve face des cas o des portions de code seraient bien plus performantes en programmation GPU, car il nexiste pas de solution grand public pour programmer les GPU aujourdhui. Ce dernier point est trs important, car cest la premire motivation qui a pouss Microsoft lancer le projet C++ AMP .

> Contexte
Lorsque Microsoft ajoute une nouvelle librairie Visual Studio, ce nest pas sans plusieurs motivations parfaitement rflchies et cette nouvelle librairie, nchappe pas la rgle. Certains lecteurs pourraient tre surpris par ce choix, car des technologies comme CUDA et OpenCL disponibles depuis plusieurs annes ont rencontr un franc succs auprs des dveloppeurs spcialiss GPU. Pour quil ny ait aucun doute sur les motivations de C++ AMP je vous propo, se de passer en revue tous les lments qui ont pouss Microsoft se lancer sur un sujet aussi intimiste que la programmation GPU.

> Rendre la programmation GPU accessible tous

La grande majorit des dveloppeurs produit des programmes destination dun ou plusieurs CPU, mais finalement elle produit du code ciblant la technologie CPU. Les CPU sont par nature modliss pour raliser des traitements gnriques sans considration spcifique. Ils sont parfaitement adapts la majorit des besoins rclams par les programmes actuels. Par exemple des applica-

Fig.4

Fig.6

Fig.5

Fig.7

PROgrammez !

< 59 >

JANVIER

2013

i je dbute avec...
> Rendre agnostique votre code C++ AMP
Aujourdhui, les constructeurs de cartes graphiques sont la croise des chemins en termes darchitecture matrielle. On assiste des volutions importantes entre les GPU et les CPU. Cest un secteur en pleine volution o la comptition est rude et touche une poigne de constructeurs pour un march immense. Pour les dveloppeurs C++ AMP les ingnieurs Microsoft ont pris en compte ce paramtre et , affirment que tous les codes C++ AMP ne souffriront pas des futures volutions matrielles. En ralit, votre code C++ AMP est ds prsent capable de sexcuter sur de nombreux matriels sans aucune modification. Par nature C++ AMP nest pas rattach un matriel spcifique (pas de code spcifique aux cartes graphiques nVidia, AMD ou mme Intel). Autrement dit, votre investissement sera prserv. Ce dernier point est trs important, car cest la seconde motivation qui a pouss Microsoft lancer le projet C++ AMP .

> Quest ce que C++ AMP ?

C++ AMP fait partie du compilateur C++. Si vous utilisez dj le compilateur C++ de Visual Studio 2012, vous avez C++ AMP Vous navez . besoin de rien dautre. Pour dployer votre application C++ AMP , vous navez aucun prrequis supplmentaire, le redistribuable Visual C++ contient la librairie C++ AMP En tant que partie intgrante . Visual Studio, la librairie C++ AMP est parfaitement intgre Visual Studio la fois sur le plan du Debugging, du Profiling et de lIntelliSense. Avec C++ AMP vous pouvez rutiliser vos applications , et vos connaissances C++, car la librairie a t pense pour justement les prserver. On peut dfinir C++ AMP comme une librairie C++ exposant un petit jeu dAPI (compatible STL) sachant grer des donnes multidimensionnelles afin de faciliter leur paralllisation. La courbe dapprentissage de C++ AMP est donc faible, car le jeu dAPI est rduit et repose sur le standard C++ 11. Si vous connaissez la librairie STL, alors vous connaissez une bonne partie de C++ AMP . Limplmentation Microsoft de C++ repose sur lAPI Direct3D de DirectX 11. Ce choix dimplmentation est plutt une bonne chose, car DirectX est une librairie mature et donc stable. Ce choix apporte une abstraction pour supporter de nombreux matriels comme ceux de constructeurs nVidia, AMD, Intel, ARM Cependant, si votre programme ne dtecte pas de matriel compatible DirectX11, C++ AMP se tourne vers une solution de repli, WRAP que nous , avons utilis dans la premire dmonstration, exploitant alors les multi curs disponibles et la vectorisation parallle via les instructions SSE (AVX nest pas support pour linstant). Mme si Microsoft utilise DirectX pour implmenter C++ AMP les API DirectX ne sont , pas visibles des API C++ AMP Cest pour cette raison que Microsoft . a pu publier une spcification ouverte dcrivant le standard C++ AMP sans aucune adhrence avec DirectX. Pour Microsoft, C++ AMP se doit dtre performant, productif et portable pour tous les dveloppeurs, ce nest pas un produit de niche. Il nest pas utile dtre un spcialiste en programmation GPU pour utiliser C++ AMP Ainsi, un . dveloppeur C++ gnraliste disposant de Visual C++ 2012, peut parfaitement utiliser cette technologie sans contrainte technique majeure : pas de nouvelles comptences, pas de librairies ajouter pour la mise au point ou lanalyse de performance. La mise en production ne rclame rien de plus que le redistribuable C++. Et pour couronner le tout, votre code devrait tourner sur des plateformes complmentaires celle de Microsoft dans un avenir proche. Arriv ce stade, nous avons beaucoup dcrit C++ AMP sans jamais lillus, trer avec du code, il est temps de corriger le tir.

> Vous offrir un large choix de plateforme dexcution terme

Votre investissement sur C++ AMP ne se limite pas une seule plateforme : de Windows Azure Windows Phone, de Windows Desktop Windows RT, de Windows Server Windows Embedded, Windows HPC Server Xbox, toutes ces plateformes excuteront terme votre code C++ AMP Mais ce nest pas tout, dans un futur . proche, vous pourrez excuter du code C++ AMP sur des plateformes non Microsoft. En effet, Microsoft a publi en fvrier 2012, une spcification ouverte sur le standard C++ AMP (http://download.microsoft.com/download/4/0/E/40EA02D8-23A7-4BD2-AD3A0BFFFB640F28/CppAMPLanguageAndProgrammingModel.pdf), permettant aux fabricants de compilateurs dimplmenter C++ AMP sur des plateformes complmentaires celles de Microsoft. Aujourdhui, AMD a dj annonc quil produira une version de C++ AMP au-dessus dOpen CL. Linitiative de Microsoft travers la spcification ouverte de C++ AMP a pour but dencourager tous les fabricants de compi, lateurs dimplmenter la librairie C++ AMP sur diverses plateformes. Vous laurez compris, le champ des possibles de C++ AMP sera terme immense et vous navez pas vous soucier de la plateforme dexcution qui excutera votre code, ce point est trs important, car cest la fois la troisime et dernire motivation qui a incit Microsoft lancer le projet C++ AMP Arriv ce stade, . vous avez pris connaissance des motivations de Microsoft produire la librairie C++ AMP il est temps de dcrire ce quest C++ AMP , .
Fig.8

> Hello world

Dans ce premier exemple, lobjectif est dintroduire les bases de C++ AMP progressivement. Si vous cherchez un intrt vis--vis de la paralllisation : il ny en a pas ! En revanche, vous apprendrez lessentiel des lments pour exploiter C++ AMP correctement. Pour vous convaincre de la simplicit de C++ AMP dmarrez Visual Studio , 2012 et dans le Template C++, choisissez de crer une application, un projet vide que vous pouvez appeler HelloWorld . Puis sur le projet, ajoutez (clique droit) un nouvel lment source.cpp. Puis vous pouvez saisir ce code ou tlcharger lexemple. #include <iostream> void do_it(int* v, int size, int to_add) { PROgrammez !

< 60 >

JANVIER

2013

i je dbute avec...
for(int i = 0; i < size; i++) { v[i] += to_add; } for(unsigned int i = 0; i < size; i++) std::cout << static_cast<char>(v[i]); } int main() { int v[12] = {G, d, k, k, n, 31, v, n, q, k, c, -}; int to_add = 1; do_it(v, sizeof(v)/sizeof(int), to_add); std::cin.get(); } Si vous excutez ce code, vous obtiendrez le fameux Hello World. . Le code se compose dun point dentre; La fonction main et dune mthode do_it qui reoit le tableau dentier initialis dans la fonction main et un entier to_add valoris un. La mthode do_it contient deux boucles. La premire calcule lajout de lentier to_add sur tous les lments du tableau, la seconde affiche tous les lments une fois altrs. Naturellement, la seconde boucle ne fait quafficher et ne nous concerne pas sur plan de la paralllisation. Pour introduire C++ AMP ajouter le fichier header amp.h et lespace de nom , concurrency . #include <iostream> #include <amp.h> using namespace concurrency; Dans la mthode do_it, nous allons remplacer la premire boucle par la mthode parallel_for_each. Cette mthode existe aussi dans loffre parallle CPU (Parallel Pattern Library ou PPL), ce nest pas cette version que nous allons utiliser, mais celle du fichier amp.h . Le premier paramtre rclame la taille de tableau itrer, puis une expression lambda C++ 11. void do_it(int* v, int size, int to_add) { parallel_for_each(size, [=](int i) { v[i] += to_add; }); for(unsigned int i = 0; i < size; i++) std::cout << static_cast<char>(v[i]); } La mthode parallel_for_each, naccepte pas une taille sous la forme dun entier, mais dun type permettant de traiter des donnes multidimensionnelles via le type template extent<N>. Dans notre exemple, nous navons quune seule dimension, mais le prochain exemple disposera de deux dimensions. } void do_it(int* v, int size, int to_add) { extent<1> e(size); parallel_for_each(e, [=](int i) { v[i] += to_add; }); for(unsigned int i = 0; i < size; i++) std::cout << static_cast<char>(v[i]); } ce stade, notre mthode est presque correcte, mais les donnes de notre tableau ne peuvent toujours pas tre charges dans le GPU. Nous allons utiliser un nouveau type template C++ AMP : array_view<T,N>. Cest un wrapper sur les donnes, ici notre pointeur dentiers, permettant de les charger la demande. Le type array_view est naturellement capable de wrapper des conteneurs STL. De plus, le type du paramtre de lexpression lambda doit tre remplac par le type : index<N>. Cest une sorte dindice multidimensionnel, car il arrive souvent sur des projets plus ralistes que les donnes se reprsentent de manire multidimensionnelle. void do_it(int* v, int size, int to_add) { extent<1> e(size); array_view<int> av(1, v); parallel_for_each(e, [=](index<1> i) { av[i[0]] += to_add; }); for(unsigned int i = 0; i < size; i++) std::cout << static_cast<char>(v[i]);

> Nouveau mot clef C++ : restrict

Notre code nest pas encore correct, car le corps de lexpression lambda constitue le code dit noyau , cest--dire, celui qui est charg dans le GPU. Le code noyau ne peut pas excuter toutes les syntaxes supportes par le C++. Pour que le compilateur puisse vrifier ces restrictions, nous devons ajouter un nouveau mot clef ajout au C++ par C++ AMP : restrict(amp). Nous remplaons le tableau v par linstance av, dans la seconde boucle. void do_it(int* v, int size, int to_add) { extent<1> e(size); array_view<int> av(size, v); parallel_for_each(av.extent, [=](index<1> i) restrict(amp) { av[i[0]] += to_add; }); for(unsigned int i = 0; i < size; i++) std::cout << static_cast<char>(av[i]); }

PROgrammez !

< 61 >

JANVIER

2013

i je dbute avec...
Le principe de restriction peut sappliquer sur une expression lambda (comme dans notre exemple) ou bien sur une mthode. Noter que le mot cl restrict modifie la signature de la mthode ou de lexpression lambda, ce qui signifie que nous pourrions ajouter par exemple une mthode nomme foo() marque par le mot clef restrict(amp) sans soucis. #include <iostream> #include <amp.h> using namespace concurrency; void foo() restrict(amp) {} void do_it(int* v, int size, int to_add) { array_view<int> av(size, v); parallel_for_each(av.extent, [=](index<1> idx) restrict(amp) { foo(); av[idx] += to_add; }); for(unsigned int i = 0; i < size; i++) std::cout << static_cast<char>(av[i]); } ce stade de larticle, nous pouvovons prendre le temps dexpliquer le droulement de notre calcul. La variable idx est renseigne automatiquement par le moteur dexcution C++ AMP car elle reprsente , le thread GPU qui excutera le code noyau (le corps de lexpression lambda). Chaque itration de lexpression est donc calcule indpendamment et en parallle [Fig.9]. Pour linstant linstruction restrict ne supporte que les deux identifiants : amp et/ou cpu. Son rle est dinformer le compilateur pour quil applique des restrictions au langage (restrictions spcifiques, optimisations, gnration de code). Pour linstant, le mot clef restrict(amp) interdit les lments suivants : rcusions mot clef volatile fonctions virtuelles pointeurs de fonctions pointeurs vers des fonctions membres pointeurs dans des structures pointeurs de pointeurs champs de bits goto ou labels throw, try, catch Variables globales ou statiques dynamic_cast ou typeid dclarations __asm__ varargs types non supports: char, short, long double Si le code dune mthode est la fois compatible amp et cpu, vous pouvez marquer celle-ci des deux identifiants. void foo() restrict(amp, cpu) {} void do_it(int* v, int size, int to_add) { PROgrammez ! } Par dfaut, tout votre code est compatible la mode cpu, il est donc inutile de marquer votre code restrict(cpu), except si vous souhaitez surcharger une mthode portant une signature quivalente, mais marque avec restrict(amp) void foo() restrict(amp) {} void foo() {} void do_it(int* v, int size, int to_add) { array_view<int> av(size, v); parallel_for_each(av.extent, [=](index<1> idx) restrict(amp) { foo(); av[idx] += to_add; }); for(unsigned int i = 0; i < size; i++) std::cout << static_cast<char>(av[i]); } Nous pouvons remanier un peu ce code, afin dobtenir un code un peu plus lgant. Nous pouvons noter que le code final est peine plus grand que le code dorigine. void do_it(int* v, int size, int to_add) { array_view<int> av(size, v); parallel_for_each(av.extent, [=](index<1> idx) restrict(amp) { av[idx] += to_add; }); for(unsigned int i = 0; i < size; i++) std::cout << static_cast<char>(av[i]); }
Fig.9

array_view<int> av(size, v); parallel_for_each(av.extent, [=](index<1> idx) restrict(amp) { foo(); av[idx] += to_add; }); for(unsigned int i = 0; i < size; i++) std::cout << static_cast<char>(av[i]);

< 62 >

JANVIER

2013

i je dbute avec...
> Comment grer lexcution asynchrone du code GPU
Le code de la fonction do_it peut vous sembler parfaitement squentiel, alors que toute excution sur un GPU est par dfinition asynchrone. Alors qui est responsable de la synchronisation ? la fin de la premire boucle, nous avons fini dcrire dans la variable av, dans la seconde boucle on parcourt larray_view nouveau, mais dans ce cas, qui synchronise la premire lecture de la premire boucle vis--vis de la lecture dans la seconde ? La classe array_view assure la synchronisation et vite tous problmes asynchrones. Prenons un autre exemple, o cette fois nous ajoutons une seconde boucle dcriture. void do_it(int* v, int size, int to_add) { array_view<int> av(size, v); parallel_for_each(av.extent, [=](index<1> idx) restrict(amp) { av[idx] += to_add; }); parallel_for_each(av.extent, [=](index<1> idx) restrict(amp) { av[idx] += 2; }); for(int i = 0; i < size; i++) std::cout << static_cast<char>(v[i]); } la fin de la premire boucle, la seconde boucle reprend zro lcriture dans larray_view, et une fois encore larray_view va se synchroniser de manire entamer la premire criture une fois que toutes critures de boucle prcdente seront termines. Dans lexemple suivant, nous avons dplac le code daffichage dans la fonction main. La classe array_view est instancie sur la pile de la mthode do_it, ainsi la sortie de mthode, le destructeur de larray_view est appel. Ce destructeur contient un code de synchronisation, permettant de flusher dans lobjet wrapp, ici, le pointeur dentier, tous les lments traits dans la mthode noyau. void do_it(int* v, int size, int to_add) { array_view<int> av(size, v); parallel_for_each(av.extent, [=](index<1> idx) restrict(amp) { av[idx] += to_add; }); } int main() { int v[12] = {G, d, k, k, n, 31, v, n, q, k, c, -}; int to_add = 1; int size = sizeof(v)/sizeof(int); do_it(v, size, to_add); PROgrammez ! } Cependant, il est aussi possible dappeler sur linstance de larray_view, la mthode synchronize qui assure la synchronisation des donnes. void do_it(int* v, int size, int to_add) { array_view<int> av(size, v); parallel_for_each(av.extent, [=](index<1> idx) restrict(amp) { av[idx] += to_add; }); av.synchronize(); } Remarque : Il nest pas ncessaire dappeler la mthode synchronize car comme nous lavons dit prcdemment la classe array_view contient dans son destructeur le code pour synchroniser les donnes la sortie de ma mthode do_it. Cependant, lusage de cette mthode vous assure que votre code peut rester correct si vous ajoutez du code la fin de la mthode exploitant les donnes du tampon dentier v. for(int i = 0; i < size; i++) std::cout << static_cast<char>(v[i]); std::cin.get();

> Accelerator et accelerator_view

Pour sexcuter, un programme C++ AMP se doit dutiliser un acclrateur (rappelez-vous la dmonstration de lintroduction), cest--dire une cible dexcution o priphrique dexcution. Actuellement dans la version 1.0 de C++ AMP nous disposons des acclrateurs suivants : , accelerator::default_accelerator accelerator:: direct3d_warp accelerator::direct3d_ref accelerator:: cpu_accelerator Un acclrateur est gnralement attach une carte graphique, mais il peut arriver que lacclrateur cible votre CPU car aucune carte graphique compatible DirectX 11 na t trouve au dmarrage de lapplication. Dans ce cas, cest lacclrateur WARP ou Microsoft Basic Render Driver qui est utilis. Rappelez-vous dans la premire dmonstration, lexcution avec le mode WRAP nous avions obtenu des performances suprieures au code parallle CPU. Pour comprendre cet exploit, sachez que lacclrateur WARP utilise la fois le paralllisme multi cur et les instructions Intel SSE qui permettent de raliser du SIMD pour Single Instruction Multiple Data, afin dexcuter efficacement la paralllisation de vos donnes sur CPU. Sur le plan de limplmentation cet acclrateur repose sur le service WARP software rasterizer, fourni par le moteur dexcution Direct3D 11. Par dfaut cest lacclrateur accelerator::default_accelerator, que le moteur dexcution C++ AMP slectionne, en choisissant la solution la plus performante vis--vis de votre configuration matrielle. Si vous souhaitez faire de la mise au point du code noyau, vous ne pourrez pas utiliser lacclrateur le plus performant, mais loppos, le plus lent : accelerator::direct3d_ref. Le nom REF vient de Reference Rasterizer qui est une implmentation logicielle que le SDK DirectX a toujours fournie. Cest effectivement, le plus lent des

< 63 >

JANVIER

2013

i je dbute avec...
acclrateurs, car cest un mulateur dexcution GPU. Cest cet acclrateur qui est utilis si vous choisissez de debugger le code noyau. Nous reviendrons plus en dtail sur la manire de debugger du code C++ AMP dans un prochain article. Lacclrateur CPU, accelerator:: cpu_accelerator, est seulement utilis dans un cadre avanc de transfert de donnes depuis le noyau vers lhost que lon appelle aussi staging array . Lutilisation de cet acclrateur CPU dpasse le cadre de cette introduction. Vous pouvez afficher facilement toutes les proprits des acclrateurs disponibles sur votre machine, il vous suffit de frapper ces quelques lignes de code : std::for_each(accs.begin(), accs.end(), [&](accelerator acc) { std::wcout << New accelerator: << acc.description << std::endl; std::wcout << device_path = << acc.device_path << std::endl; std::wcout << version = << (acc.version >> 16) << . << (acc. version & 0xFFFF) << std::endl; std::wcout << dedicated_memory = << acc.dedicated_memory << KB << std::endl; std::wcout << doubles = << ((acc.supports_double_precision) ? true : false) << std::endl; std::wcout << limited_doubles = << ((acc.supports_limited_ double_precision) ? true : false) << std::endl; std::wcout << has_display = << ((acc.has_display) ? true : false) << std::endl; std::wcout << is_emulated = << ((acc.is_emulated) ? true : false) << std::endl; std::wcout << is_debug = << ((acc.is_debug) ? true : false) << std::endl; std::wcout << std::endl; }); Si jexcute ce code sur ma machine, jobtiens les rsultats suivants : [Fig.10]. On retrouve tous les types dacclrateurs et leurs proprits respectives. Ces informations sont trs utiles si vous souhaitez connatre les capacits de vos acclrateurs. En gnral, cest lacclrateur attach votre carte graphique qui vous importe, car cest gnralement celle-ci qui offrira le plus de performances. Si nous revenons notre dmonstration, nous navons jusqu prsent jamais prsent un exemple qui utilisait un acclrateur. Et pourtant, il y a toujours un acclrateur utilis. Dans le code ci-dessous, nous faisons apparatre lusage dun acclrateur. accelerator pick_accelerator() { accelerator rc; vector<accelerator> accelerators = accelerator::get_all(); auto it = std::find_if(accelerators.begin(), accelerators. end(), [&](accelerator accel) { return !accel.is_emulated; }); if (it != accelerators.end()) rc = *it; return rc; } void do_it(int* v, int size, int to_add) PROgrammez !
Fig.10

{ accelerator acc = pick_accelerator(); array_view<int> av(size, v); parallel_for_each(acc.default_view, av.extent, [=](index<1> idx) restrict(amp) { av[idx] += to_add; }); } Vous noterez que la mthode parallel_for_each ne prend pas en paramtre un acclrateur, mais une vue sur un acclrateur : accelerator_view. Le rle de la classe accelerator_view est dencapsuler lacclrateur afin de le protger des diffrents usages multithreads dans votre code. Pour conclure cette parenthse sur les acclrateurs, ils apparaissent gnralement lorsque vous souhaitez grer plusieurs cartes graphiques pour parallliser vos traitements sur plusieurs cartes graphiques.

> Array
Nous avons utilis le type array_view qui se prte bien notre exemple, mais il existe un autre type de conteneur, qui cette fois nest pas wrapper, mais un vrai conteneur, array<T,N>. Dun point vue de lusage, le type array<T, N> est un peu diffrent dun array_view, mais linstanciation est quivalente. La capture vis--vis de lexpression lambda de la mthode parallel_for_each change : contrairement linstance array_view, le type array nest pas un wrapper sur des donnes, mais un vrai conteneur qui ne doit pas tre pass par valeur, mais par rfrence. En revanche, la variable to_add doit tre passe par valeur, ce qui nous donne ce type de capture au niveau de lexpression lambda [=,&arr]. void do_it(int* v, int size, int to_add) { accelerator acc = pick_accelerator(); array<int> arr(size, v); parallel_for_each(acc.default_view, arr.extent, [=,&arr](index

< 64 >

JANVIER

2013

i je dbute avec...
<1> idx) restrict(amp) { arr[idx] += to_add; }); copy(arr, v); } Une fois la boucle parallel_for_each lance, nous devons attendre le retour du traitement sur la carte graphique puis copier les donnes dans le buffer dorigine nous-mmes, une fois la boucle termine. Vous laurez compris, la fonction copy assure exactement ce comportement. // Peupler la matrice A for (int i = 0; i < A.size(); i++) A[i] = i + 1; // Peupler la matrice B for (int i = 0; i < B.size(); i++) B[i] = i + 1; MatrixMultiply(C, A, B, M, N, W); } Limplmentation de lalgorithme est sans surprise et correspond la description de lalgorithme. Nous allons, comme nous lavions fait dans lexemple Hello World , introduire progressivement la paralllisation avec C++ AMP Nous recopions lalgorithme original et . renommons le nom de la mthode par MatrixMultiplyAMP. Nous devons ajouter le fichier amp.h ainsi que lespace de nom concurrency , puis nous introduisons trois array_view. #include <vector> #include <amp.h> using std::vector; using namespace concurrency; void MatrixMultiplyAMP(vector<int>& vC, vector<int>& vA, vector <int>& vB, int M, int N, int W) { array_view<int> a(M*W, vA), b(W*N, vB); array_view<int> c(M*N, vC); for (int row = 0; row < M; row++) for (int col = 0; col < N; col++) { int sum = 0; for (int k = 0; k < W; k++) sum += a[row * W + k] * b[k * N + col]; c[row * N + col] = sum; } } int N = 6; // 3 vecteurs pour reprsenter les matrices vector<int> A(M*W); vector<int> B(W*N); vector<int> C(M*N);

> Lexemple fil rouge : la multiplication matricielle

Toutes les introductions sur la programmation GPU utilisent lalgorithme de multiplication matricielle, car il est la fois simple et dmontre efficacement les performances du calcul sur un GPU. Voici un rappel de lalgorithme via une feuille Excel : [Fig.11]. Lobjectif est de calculer le produit de deux matrices A et B et dengendrer la matrice produit C. Dans notre exemple la matrice A est de dimension M x W, avec M=2 et W=4, la matrice B est dimension W x N avec W=4 et N=6 et enfin la matrice produit C est de dimension M x N. Chaque ligne A est multiplie par toutes les colonnes entires de B. Chaque multiplication est somme dans une variable temporaire. Aprs avoir multipli tous les lments de la ligne avec tous les lments de la colonne courante. Le rsultat temporaire est plac dans la cellule correspondante de la matrice produit C.

> Implmentation
Dans Visual Studio 2012, vous crez un projet C++ en choisissant le modle Empty Project , puis vous ajoutez un fichier C++. Le code cidessous reprsente une implmentation de la multiplication matricielle. #include <iostream> #include <vector> using std::vector; void MatrixMultiply(vector<int>& vC, vector<int>& vA, vector<int> & vB, int M, int N, int W) { for (int row = 0; row < M; row++) for (int col = 0; col < N; col++) { int sum = 0; for (int k = 0; k < W; k++) sum += vA[row * W + k] * vB[k * N + col]; vC[row * N + col] = sum; } } void main() { // Dimensions des matrices int M = 2; int W = 4; PROgrammez !

Fig.11

< 65 >

JANVIER

2013

i je dbute avec...
ce stade, le code compile correctement, mais cependant, il nest pas encore paralllis. Nous passons le code une dimension deux dimensions. Puis nous remplaons les deux boucles des lignes et des colonnes par la mthode parallel_for_each. Avec la variable idx de type index, nous raffectons les variables row et col. #include <vector> #include <amp.h> using std::vector; using namespace concurrency; void MatrixMultiplyAMP(vector<int>& vC, vector<int>& vA, vector <int>& vB, int M, int N, int W) { array_view<int, 2> a(M,W, vA), b(W,N, vB); array_view<int, 2> c(M,N, vC); //for (int row = 0; row < M; row++) //for (int col = 0; col < N; col++) parallel_for_each(c.extent, [=](index<2> idx) restrict(amp) { int row = idx[0]; int col = idx[1]; int sum = 0; for (int k = 0; k < W; k++) sum += a(row, k) * b(k, col); c(row, col) = sum; }); } Cependant, il nous reste quelques modifications afin dobtenir un code correct. Nous remplaons dans le type du template pour les variables a et b, qui reprsentent les deux matrices dentres venant nourrir le traitement, du type int const int, ce qui apporte une optimisation au traitement. La variable c, reprsentant la matrice produit qui va recevoir les rsultats, on appelle la mthode discard_data() afin de prciser que les valeurs en entres de cet array_view, ne sont pas copier sur le GPU, ceci ajoute une touche doptimisation. void MatrixMultiplyAMP(vector<int>& vC, vector<int>& vA, vector <int>& vB, int M, int N, int W) { array_view<const int,2> a(M, W, vA); array_view<const int,2> b(W, N, vB); array_view<int,2> c(M, N, vC); c.discard_data(); parallel_for_each( c.extent, [=](concurrency::index<2> idx) restrict(amp) { int row = idx[0]; int col = idx[1]; int sum = 0.0f; for(int k = 0; k < W; ++k) sum += a(row, k) * b(k, col); c[idx] = sum; }); c.synchronize(); } Nous avons ce stade disposition deux versions de lalgorithme, une en mode squentiel et la seconde en mode parallle. Pour mesurer les performances, il nous faut un minimum doutillage pour mesurer les performances de traitements reposant sur la technologie GPU. Vous trouverez sur le blog Microsoft Parallel Programming in Native Code , un billet sur High-resolution timer for C++ accompagn des sources de la classe Timer, http://blogs.msdn.com/b/nativeconcurrency/archive/2011/12/28/high-resolutiontimer-for-c.aspx, qui correspond parfaitement notre besoin. Pour observer les performances de C++ AMP nous avons rvis le , code et introduit lutilisation de la classe Timer via timer.h : voir les sources de larticle sur notre site. Nous obtenons ainsi des matrices carres bien plus lourdes de taille 1024*1024, afin de montrer les gains obtenus avec la technologie GPU. Naturellement, en fonction de votre matriel vous obtiendrez des rsultats diffrents. Pour le calcul en mode squentiel, le traitement a pris environ 9 secondes, alors que le calcul parallle avec C++ AMP a pris 142 millisecondes.

En rsum
Pour conclure, je vous propose de dresser le bilan des lments que vous avez appris. Sur le plan conceptuel : Sur des volumes de donnes immenses, le calcul sur GPU offre des performances extraordinaires Microsoft souhaite dmocratiser la programmation GPU avec C++ AMP sur toutes les plateformes Windows et non Windows Sur le plan de la programmation : class index<N> : pointe une valeur dans un conteneur multidimensionnel class extent<N> : taille dun conteneur multidimensionnel restrict(amp, cpu) : restreint la syntaxe C++ pour excuter une mthode ou une expression lambda en mode noyau parallel_for_each : excute une boucle en parallle sur des donnes multidimensionnelles class array_view<T,N> : wrapper multidimensionnel sur des donnes class accelerator : acclrateur utilis en interne pour excuter le code parallle class accelerator_view : isole lacclrateur des diffrents usages multithreads class array<T,N> : conteneur multidimensionnel sur des donnes. Avec ces quelques lments, vous pouvez dj produire des programmes utilisant la librairie C++ AMP et obtenir des excutions trs performantes. En adressant la programmation GPU avec autant dabstractions, vous comprenez quil nest pas ncessaire dtre un super expert pour parallliser du code sur GPU. Jespre que cette dcouverte de C++ AMP vous a , mis leau la bouche, et que vous allez vous essayer construire des applications utilisant C++ AMP .

# Bruno Boucard MVP - Architecte Finaxys PROgrammez !

< 66 >

JANVIER

2013

i pratique

Koneki,le dveloppement M 2M simplif i

Le projet Koneki vient tout juste de souffler sa premire bougie, et fait dj partie de la livraison simultane annuelle Juno. Nous vous proposons travers ces quelques pages de dcouvrir les bases du Machine-to-Machine (M2M) et les fonctionnalits les plus intressantes de Koneki.
ous avez dit...Koneki ? Koneki , en Maori, signifie ce lieu . En appelant le projet Koneki, nous avons souhait signifier que les dveloppeurs M2M pourront trs bientt bnficier doutils sintgrant en toute transparence lenvironnement Eclipse pour dvelopper, simuler et tester leurs applications en toute simplicit. Aujourdhui, lorsquune entreprise se lance dans un projet de dveloppement M2M, elle se retrouve trs rapidement confronte une foule de problmes dingnierie dveloppement des applications embarques, des applications mobiles ou Web, manipulation des protocoles industriels et perdue dans le labyrinthe des outils permettant de les rsoudre. Le but de Koneki est de les guider vers la sortie, en regroupant tous les outils ncessaires en un mme lieu.

Fig.1

Une des nombreuses applications M2M, la sant.

> Introduction au Machine-to-Machine

Le terme Internet of Things (IoT) ne vous est sans doute pas inconnu. Celui de M2M repose sur la mme ide, celle de connecter tous les objets possibles et imaginables lInternet, et de leur offrir la possibilit la fois de partager leurs donnes et dtre commands distance.

Dici 2020, on estime environ 50 milliards le nombre dappareils matriels connects dans le monde.
Les domaines du quotidien o le M2M modifie la manire dont nous interagissons avec les objets sont dj nombreux, et se multiplient de jour en jour. Celui de la mdecine, illustr figure 1, en est un bon exemple. Le fait de pouvoir relier des choses telles que des tensiomtres lectroniques ou des lectrocardiogrammes lInternet, permet dun ct aux dveloppeurs de crer des applications Web ou mobiles autour des donnes recueillies, et de lautre aux fabricants de ces appareils de les grer distance, par exemple pour les mettre jour [Fig.1]. Le problme est que les solutions M2M aujourdhui dployes sappuient sur des technologies et protocoles de communication propritaires, qui constituent un obstacle de taille la croissance du march M2M

M2M : leur manque dinteroprabilit. Lobjectif du M2MIWG (M2M Industry Working Group) est de travailler sa rsolution, en fournissant notamment toutes les bibliothques de communication, cadres applicatifs (application framework) et outils ncessaires un dveloppement simple et sain de solutions M2M [Fig.2]. A lheure actuelle, deux projets Eclipse Technology sont pilots par le M2M Industry Working Group : Paho et Koneki. Le but du projet Paho est de simplifier limplmentation de protocoles lgers pouvant servir aux applications M2M et IoT. Les contributions initiales ont man dIBM et Eurotech sous la forme de bibliothques client C et Java pour le protocole MQTT. MQTT (Message Queue Telemetry Transport) est un protocole de messagerie TCP/IP permettant doptimiser lutilisation de la bande passante lors des communications M2M. Pour reprendre ce qui a t dit en introduction, lobjectif de Koneki est de fournir des outils de dveloppement simples pour toute la chane M2M, de la cration dapplications embarques la simulation de scnarios de communication, en passant par le dveloppement dapplications mobiles ou Web.

> Lua, un langage de programmation aussi puissant que lger

Le langage de programmation Lua (prononcez lou-ah ) est n au Brsil en 1993 du besoin de disposer dun langage facile intgrer dans dautres applications. Ses concepteurs lont donc pens lger et en pur ANSI-C, ce qui le rend on ne peut plus facile transporter vers dautres plateformes aussi petites que des microcontrleurs limits quelques centaines de kilo-octets de RAM et de mmoire Flash. La distribution eLua [1], va encore plus loin dans loptimisation pour les cibles plus fortes contraintes.

> Les acteurs du M2M la rescousse

A la fin de lanne dernire, plusieurs acteurs de lcosystme M2M ont dcid de prendre les choses en main en crant un Groupe de travail industriel (Industry Working Group) sous lgide de la fondation Eclipse, pour adresser le plus gros problme actuel des solutions
Fig.2

Le langage Lua sapprend trs facilement. De nombreux diteurs de jeux vido et de plateformes de dveloppement mobile en ont mme fait le langage de dveloppement privilgi pour leurs applications.

> Lua pour le dveloppement dapplications M2M

La cration dun cosystme ouvert pour le M2M.
PROgrammez ! Vous vous demandez sans doute pourquoi nous avons choisi comme composante principale de Koneki un IDE ddi Lua, appel Lua Development Tools (LDT), et non quelque chose de plus spcifique au

< 67 >

JANVIER

2013

i pratique
M2M. La rponse est simple : lun des plus gros freins la cration de solutions M2M est, selon nous, la complexit de dveloppement des applications embarques dans les botiers de communication dploys sur le terrain. Il faut bien garder lesprit que les domaines dapplication du M2M sont infinis et que personne ne veut avoir apprendre un langage aussi complexe que le C, tout cela pour, au final, ne manipuler que quelques structures de donnes envoyer vers un serveur distant. Lua a dj t adopt par les dveloppeurs de jeux vido et applications mobiles, pourquoi ne pas ladopter galement pour le dveloppement dapplications embarques ? string `mode`. It returns a new file handle, or, in case of errors, nil plus an error message. The `mode` string can be any of the following: r: read mode (the default); w: write mode; a: append mode; r+: update mode, all previous data is preserved; w+: update mode, all previous data is erased; a+: append update mode, previous data is preserved, writing is only allowed at the end of file. The `mode` string can also have a `b` at the end, which is needed in some systems to open the file in binary mode. This string is exactly what is used in the standard C function `fopen`. @function [parent=#io] open @param filename @param mode @return #file Equivalent to `file:close()`. Without a `file`, closes the default output file. @function [parent=#io] close @param file [...] Il est galement possible dutiliser un mcanisme similaire aux target platforms de PDE (Plugin Development Environment), qui permet de stocker dans un fichier ZIP la dfinition des API Lua visibles pour un dveloppeur. Koneki ne livre pour linstant aucun de ces fichiers appels Environnements dexcution ; en revanche, lenvironnement dexcution Lua 5.1 ainsi que celui de lenvironnement de dveloppement mobile Gideros sont dores et dj disponibles sur le GitHub de Sierra Wireless [2].

Lua Development Tools a dj t tlcharg et install par plus de 15 000 utilisateurs !

> Premiers pas avec Lua Development Tools

Lua Development Tools (LDT), peut tre install depuis le dpt officiel Juno (dans la catgorie PROGRAMMING LANGUAGES ) ou depuis le Eclipse Marketplace. Le plus simple pour dmarrer est de crer un nouveau projet en lanant lassistant de cration par FILE > NEW > OTHER > LUA PROJECT. Vous avez le choix entre dmarrer un nouveau projet, ou vous baser sur des sources Lua existantes. Une fois la cration termine, il vous sera propos de basculer vers la perspective Lua (quil est conseill dutiliser), et le tour est jou !`

> Un effort particulier port lassistance utilisateur

Afin que les dveloppeurs pas forcment habitus programmer demble ne soient pas trop vite rebuts, Koneki propose un support avanc du langage Lua. Lua est un langage dynamique, ce qui rend dlicate la mise en place de fonctionnalits telles que lauto compltion ou la navigation dans le code, quand il ny a ni typage, ni distinction claire entre variables simples et fonctions, etc. LDT sappuie sur DLTK (Dynamic Languages Toolkit), qui fournit des fonctionnalits de base pour le dveloppement du code, mais il nous a fallu amliorer son analyse syntaxique pour permettre lIDE dinfrer un maximum dinformations de typage. Cette fonctionnalit a pu voir le jour, notamment grce au travail effectu sur la dfinition dun langage de documentation, qui permet de dcrire de faon dtaille les API des modules Lua. Les utilisateurs bnficient ainsi non seulement dune documentation comparable Javadoc, avec vues et pop-ups, mais aussi de lauto compltion et de la possibilit de parcourir le code (pour se rendre rapidement la dclaration dune mthode par exemple). Le Listing 1 vous donne un aperu de la documentation du module standard io de Lua 5.1, et la Figure 3 illustre la fonctionnalit dauto compltion. Listing 1 Input and Output Facilities. The I/O library provides function for file manipulation. @module io a file handle. @type #file This function opens a file, in the mode specified in the PROgrammez !

> Dboguer une application Lua

Outre son mcanisme dauto compltion, Lua Development Tools 0.8 saccompagne dun dbogueur utilisable avec la presque totalit des machines virtuelles Lua. Ce dbogueur prend la forme dun client DBGp (DeBuG protocol) crit en Lua qui instrumente un script Lua pour le faire communiquer avec un serveur de dbogage excut dans lIDE. Pour utiliser le dbogueur, il vous suffit dinclure deux fichiers (debugger.lua et debugintrospection.lua) dans votre LUA_PATH, puis de lancer le client de debug en prcdant le code dboguer dun appel : require(debugger)(). Vous pouvez galement lancer le dbogueur depuis nimporte quel script existant via la ligne de commande suivante : lua -e require(debugger)();
Fig.3

Auto compltion lors de lutilisation du module io de Lua 5.1.

JANVIER 2013

< 68 >

i pratique
MyApp.lua. Le dbogage ne fonctionne que si un serveur est lanc au pralable dans lIDE, une debug configuration doit donc tre lance avant dexcuter le script Lua instrument. La cration dune configuration de dbogage seffectue par le menu habituel RUN > DEBUG CONFIGURATIONS. Si votre machine virtuelle Lua ne sort pas trop de lordinaire elle doit au moins implmenter la mthode loadstring() toutes les fonctionnalits auxquelles vous tes habitu en tant que dveloppeur C ou Java dans Eclipse vous seront accessibles : points darrt (y compris les points darrt conditionnels), recherche et modification de variables, expressions interactives, dbogage multi-thread (coroutines) [Fig.4]. renseignes dans le modle dapplication pour estimer la bande passante consomme avec tel ou tel protocole de communication. Un tel modle a aussi vocation tre utilis au moment de lexcution de lapplication, en configurant par exemple automatiquement une API daccs aux donnes cachant la complexit de protocoles de communication sous-jacents. La version initiale de ce modle M2M, axe principalement sur la description des donnes manipules par une application, est disponible dans le dpt Git [4] du projet. Elle adresse les spcificits du M2M, en opposant par exemple clairement les donnes uniquement envoyes vers dautres machines aux donnes pouvant aussi tre mises jour distance, ou encore en dcrivant les oprations excutables distance. Les exigences de ce mta modle M2M sont discutes au sein du M2M Industry Working Group, qui sappuie sur des cas industriels concrets pour identifier les notions fondamentales devant tre imprativement couvertes.

> Les autres outils Koneki

Simulateur OMA-DM Nous avons mis disposition dbut 2012 un plug-in Eclipse permettant de configurer et dexcuter des simulations OMA-DM. OMA-DM est un standard de communication extrmement courant dans les tlcommunications, quon rencontre notamment dans la surveillance et la synchronisation dappareils tels que les tlphones mobiles (ou tout autre module de communication intervenant dans la chane M2M). Linterface utilisateur du simulateur comprend un formulaire permettant dditer les paramtres de la simulation, ainsi quune reprsentation graphique de larborescence de lappareil simul. Il comprend galement un tableau de bord interactif permettant de visualiser les paquets OMA-DM changs entre client et serveur. Le simulateur OMA-DM disponible dans Koneki est compatible avec limplmentation open source de serveur OMA-DM disponible dans le projet Funambol Device Management [3]. Si vous dsirez lessayer, notre Manuel utilisateur contient toutes les informations ncessaires linstallation de ce dernier. Modle M2M Nous travaillons actuellement la dfinition dun mtamodle dapplications M2M dont le but est dexpliciter de manire claire certaines notions importantes : donnes manipules par les applications, protocoles utiliss lors des changes de donnes entre diffrents lments de la chane M2M, dpendances vis-vis de matriel spcifique (GPS, par exemple) ou de bibliothques externes, etc. Nous esprons quun tel modle encouragera la cration doutils extensibles, en permettant chacun de dvelopper ses propres extensions, par exemple un outil utilisant les informations

> suivre
Vous devez sans doute vous demander maintenant ce que rservent les nouvelles versions de Koneki, et surtout quel nouveau contenu M2M nous allons ajouter Koneki. Notre prochaine tape sera de contribuer au dveloppement dune plateforme embarque Lua, compatible Linux, destine simplifier la gestion distance du systme, la manipulation des entres/sorties, les accs au rseau, etc. Au-del du M2M industriel, nous cherchons aussi rpondre la demande de la communaut DIY (Do It Yourself), en proposant un accs homogne et plus direct aux API de communication (SMS, connectivit 3G, etc.), en proposant des fonctionnalits de gestion distance des systmes embarqus (mise jour de firmware over-the-air, suivi de ltat du rseau, etc.), ... Cest lobjectif du projet Mihini [5], rcemment propos la fondation Eclipse. Nous envisageons galement de fournir un environnement de modlisation complet ddi au M2M, dvelopp en partenariat avec lquipe Damos [6]. Damos est un tout nouveau projet Eclipse, qui porte sur la cration dun environnement de dveloppement permettant de concevoir des systmes embarqus en suivant une dmarche oriente dataflow. Nous travaillons actuellement sur le plan de la version 0.9 de Koneki, qui devrait tre dj disponible. Vos suggestions sont plus que les bienvenues, alors venez nombreux dposer vos commentaires sur notre forum [7] ou notre liste de diffusion [8] ! Nous projetons une livraison de la version 1.0 en 2013, en mme temps que Kepler... les prochains mois sannoncent chargs ! www.eclipse.org/koneki

Rfrences
[1] http://www.eluaproject.net [2] http://sierrawireless.github.com/lua-execution-environments [3] https://dm.forge.funambol.org [4] http://git.eclipse.org/c/koneki [5] http://www.eclipse.org/proposals/technology.mihini [6] http://www.eclipse.org/proposals/tools.damos [7] http://www.eclipse.org/forums/eclipse.koneki [8] http://dev.eclipse.org/mhonarc/lists/koneki-dev

Fig.4

Le dbogueur Lua en action.

PROgrammez !

# Benjamin Cab vangliste Open Source chez Sierra Wireless. Il est passionn par Eclipse et son cosystme, et anime le projet et la communaut Koneki. Blog : http://blog.benjamin-cabe.com et @kartben sur Twitter.
JANVIER 2013

< 69 >

i webmaster

J avaScript :

la rvolution est- en marche ? elle

2e partie

Nous avions abord dans la premire partie de notre dossier, plusieurs lments autour de JavaScript, TypeScript et Node.JS. Nous continuons ce mois-ci lexploration du monde merveilleux de JavaScript avec plusieurs avis # Franois Tonic de dveloppeurs et des articles techniques ! Enjoy !

Crer un service Cloud en moins de 500 lignes

n voici un titre racoleur ! Du moins dans le monde de lIT... Jespre ne pas lancer une mode qui sapparenterait aux solutions pour maigrir en moins de 7 jours ou dapprendre le Javanais en moins dun mois, mais je relve nanmoins le dfi nonc dans le titre.Par la formulation crer un service, je souhaite proposer loptique du service dans son ensemble. Cela comprend le langage de programmation, les frameworks employs mais aussi le systme de stockage des donnes, la diffusion du service en termes de plateformes et enfin son hbergement. Pour tre bref, lIT volue beaucoup actuellement. Nous tions encore rcemment concentrs sur les nouveaux frameworks pour linfrastructure en place. Aujourdhui, toutes les briques sont remises en cause : langages de programmation (Scala, Groovy, JavaScript, Dart, TypeScript...), bases de donnes (MongoDB, Neo4j, Redis...), et lhbergement avec tout ce qui touche au Cloud. En somme, sans oser avancer que cette application est celle du futur, aborder ce que pourrait tre lapplication du futur ncessite une perspective trs large.

que de le dfinir de faon absolue, je proposerai ici ma vision, ou du moins celle qui a guid le design de lapplication. Un service Cloud est un service accessible via Internet sur un nombre important de plateformes : ordinateurs, tablettes et smartphones (je nai volontairement cit aucune marque ou systme dexploitation). Chaque utilisateur du service peut y trouver un espace qui lui est personnel et communiquer avec les autres utilisateurs du service. Lorsquil passe dun appareil un autre pour utiliser le service, il y retrouve son espace. La traduction technique de ce cahier des charges correspond un service proposant une interface accessible sur un maximum de plateformes (Web, Android, iOS...) proposant un hbergement et un stockage de donnes aux performances et au cot trs extensibles afin dtre capable de grer le succs du service (on ne sait jamais !).

> Le vif du sujet

Derrire un projet comme celui-l, il faut une ide de service. Pour cet article, je vous en propose une qui, a priori, nest ni rvolutionnaire, ni inintressante, donc plutt adapte son utilisation ici. Il sagit de crer des espaces graphiques partags, permettant dchanger avec dautres utilisateurs avec des dessins. Je lai sim-

> Quest-ce quun service Cloud

Comme beaucoup de notions marketing de lIT, le Cloud est certainement plus une ide quune technologie proprement parler. Plutt

PROgrammez !

< 70 >

JANVIER

2013

J avaScript :la rvolution est- en marche ? elle

plement appel Shared Whiteboard. Le service rpond aux exigences du Cloud par la persistance du contenu des tableaux, la diffusion du service sur le Web, les tablettes et les mobiles (les interfaces tactiles permettent de dessiner avec le doigt). Les changes se font par le partage dun mme tableau. et un hbergement facile galement. Le fonctionnement asynchrone de MongoDB permet de sintgrer rapidement dans les vnements socket.io dj prpars : var mongo = mongoose.createConnection(mongodb://whiteboard: ***@alex.mongohq.com:10007/shared-whiteboard); ... var WhiteBoardElement = mongo.model(WhiteBoardElement, new mon goose.Schema({ whiteboard: String, type: String })); io.sockets.on(connection, function (socket) { socket.on(connect, function(data) { WhiteBoardElement.find({ whiteboard: data.whiteboard }, function(err, docs) { if(!err) { socket.emit(init, docs); console.log(connect message, whiteboard, data.whiteboard, return, docs.length, docs); } else { console.error(connect message, error from mongodb, err); } }); }); socket.on(clear, function(data) { console.log(clear message, deleting elements for whiteboard, data); WhiteBoardElement.find({whiteboard: data}).remove(); }); socket.on(element, function(data) { console.log(element message, receiving new, data.type, element for, data.whiteboard, whiteboard); socket.broadcast.emit(element, data); var instance = new WhiteBoardElement(data, false); instance.save(function(err) { if(err) { console.error(error on adding the new element in mongodb, err); } }); }); }); Nous voil avec un code serveur complet pour seulement 54 lignes, e t f a c i l e m e n t h b e r g e a b l e : https://github.com/Swiip/sharedwhiteboard/blob/master/app.js

> Parlons technique

Nous voici arrivs au moment de choisir tous les composants techniques de notre service. Bien sr, chaque choix pourrait tre soumis dbat, je vous dcrirai simplement les choix qui ont t faits et leurs justifications.

> Ct serveur
Le serveur na pratiquement aucune rgle de gestion implmenter, son rle sera uniquement de recevoir les modifications sur les tableaux et de dispatcher ces modifications aux autres clients connects au mme tableau et au systme de stockage. Node.js apparat alors comme un choix tout dsign : trs performant sur de petites tches dI/O, simple hberger et trs facile dutilisation pour faire des WebSockets. Quelques lignes Node.js pour dmarrer un serveur HTTP (avec express.js) var _ = require(underscore); var express = require(express); ... var expressServer = express.createServer() expressServer.use(express.bodyParser()); expressServer.use(express.errorHandler()); expressServer.use(express.static(__dirname + /public)); var port = parseInt(process.env.PORT, 10) || 1337; expressServer.listen(port); console.info(listen port , port); Pour communiquer avec linterface Web et sachant quil faudra du Push, cest bien videmment Socket.io que nous allons utiliser. Configurer, connecter et transmettre les vnements de modification des tableaux se font, encore une fois, quelques lignes. var io = socketio.listen(expressServer, { log level: 2 }); io.sockets.on(connection, function (socket) { socket.on(connect, function(data) { // void ci-dessous });

socket.on(clear, function(data) { // void ci dessous }); socket.on(element, function(data) { console.log(element message, receiving new, data.type, element for, data.whiteboard, whiteboard); socket.broadcast.emit(element, data); // void ci dessous }); }); Ct stockage, nous pouvons facilement identifier nos tableaux pour tre des documents MongoDB avec une intgration Node.js rapide

> Ct client
Avec 500 lignes et lobjectif de cibler un maximum de plateformes mobiles, autant dire que les applications codes en natif pour chaque plateforme sont totalement inaccessibles. Linterface gnrique avec des technologies Web est donc incontournable. Il va falloir galement un framework de mise en forme qui sadapte tous les devices en un seul code. jQuery Mobile est pens pour cet objectif, cest lui que nous allons utiliser. Nous avons besoin de trois pages :

PROgrammez !

< 71 >

JANVIER

2013

i webmaster
Accueil, Tableau et Options que nous mettons dans un seul document HTML comme le propose loutil. Voir le code complet sur notre site. Le tableau en lui-mme doit tre une zone graphique. Dans les technologies Web, cela se concrtise par lutilisation des nouveaux composants HTML5 SVG ou Canvas. Dans ce cas je me suis dirig vers le framework SVG RaphaelJS et une petite librairie construite sur RaphaelJS qui sappelle Raphael Sketchpad et qui permet justement de tracer au doigt ou la souris des traits avec Raphael. http://ianli.com/sketchpad/|http://ianli.com/sketchpad/ Les puristes pourront mettre ma dmonstration en dfaut cet endroit prcis, et jen ai conscience, je prfre de ce fait annoncer la chose clairement. Une librairie si peu rpandue et dans laquelle en plus jai fait des modifications pourrait compter dans le nombre de lignes de code global, ce qui me ferait dpasser les 500 lignes (dune centaine ou deux). Mais cest nanmoins du code que jai rutilis dans sa grande majorit, que je ntais pas oblig de modifier en dehors de questions de performances et des photos (voir cidessous), et je suis loin davoir modifi autant de lignes que jaurai de marge la fin du compte, donc je me permettrai de continuer en considrant Sketchpad comme une librairie externe. <head> ... <script src=js/raphael.whiteboard.js></script> ... <script type=text/javascript> ... function startWhiteboard() { window.whiteboard = Raphael.whiteboard(editor, { width: 100%, height: 100%, editing: true }); whiteboard.addChangeHandler(function(attr) { if(listening) { attr.whiteboard = whiteboardName; socket.emit(element, attr); } }); } ... </script> </head> Se connecter avec le serveur que nous avons cr prcdemment demande dutiliser linterface cliente de socket.io. Ensuite, il sagit dcouter les modifications arrivant par la WebSocket et transmettre celles qui sont faites sur linterface. <head> ... <script src=js/socket.io.min.js></script> ... <script type=text/javascript> var socket, whiteboardName, listening = true; $(document).bind(pageinit, function(event) { socket = io.connect(); PROgrammez ! ... }); ... function startWhiteboard() { ... socket.emit(connect, { whiteboard: whiteboardName }); socket.on(init, function(elements) { listening = false; var result = whiteboard.paper().add(elements); listening = true; }); socket.on(element, function(attr) { if(attr.whiteboard == whiteboardName) { listening = false; console.log(receiving new element of type , attr.type); whiteboard.paper().add([attr]); listening = true; } }); } </script> </head> Dans la dfinition du projet, javais parl de distribution sur toutes les plateformes mobiles. En pratique, lapplication actuelle fonctionne dj sur la plupart des navigateurs mobiles mais il est possible daller plus loin en crant des applications susceptibles dtre distribues sur les markets avec la solution PhoneGap. Pratiquement aucun code supplmentaire nest ncessaire, il suffit de saisir ladresse du repository GitHub dans : [https://build.phonegap.com/|https://build.phonegap.com/]. Pour rellement intgrer lapplication pour le mobile, on peut ajouter la fonctionnalit prendre en photo pour lintgrer sur le tableau. Voir le code complet sur notre site. Et nous voici au bas dun document HTML trs complet, qui fait appel de nombreuses librairies, de nombreuses technologies mais qui ne fait pourtant que 172 lignes ! https://github.com/Swiip/shared-whiteboard/blob/master/public/index.html

> Conclusion
Un peu plus de 200 lignes en plus des modifications dans la librairie Sketchpad, nous sommes encore loin des 500 lignes, et pourtant les critres dun service Cloud sont respects. Bien sr, cest un embryon de service, les bases techniques fonctionnent, mais nombre de questions se poseront lintrpide qui voudra lancer son service Cloud : scalabilit (mme si sur le papier tout est prvu), marketing, design, communication, rentabilisation. Le but tait de dmontrer que les technologies actuelles permettent daller extrmement loin en quelques lignes de code. Bien sr, encore faut-il comprendre chaque technologie, sen servir bon escient et russir les intgrer. Les sources du projet sont toutes disponibles sur GitHub https://github.com/Swiip/shared-whiteboard Le projet manque de documentation et de finalisation mais il nest pas vou devenir une rfrence en la matire. Toutefois, si certains sy intressent, je rpondrais toutes les questions sy rapportant. # Matthieu Lux - Consultant JEE / Web Zenika

< 72 >

JANVIER

2013

J avaScript :la rvolution est- en marche ? elle

I mplmentations dapplications W eb avec Node et Express

Node permet notamment de mettre en uvre des applications serveurs en utilisant le langage JavaScript. Une de ses spcificits (et de ses forces) rside dans son utilisation de JavaScript et du moteur V8 de Google afin de mettre disposition une programmation asynchrone et non bloquante.

ode fournit galement toute une interface de programmation pour diffrents cas dutilisation dont HTTP afin dimplmenter des applications Web. Nous allons nous intresser ce type dapplication tout au long de cet article. Comme pour les autres langages de programmation tels que Java et PHP utiliser ces API bas , niveau savre fastidieux et peu productif pour des applications relles. Il apparat donc judicieux de considrer des outils plus haut niveau afin de gagner en structuration, productivit et maintenabilit. Dans cet article, nous allons dcrire comment utiliser Express (http://http://expressjs.com/), le plus populaire et utilis des frameworks Web pour Node, afin de crer une petite application Web daffichage de contacts. Ce framework fournit un intressant cadre au-dessus des API HTTP de Node pour implmenter des applications Web suivant le modle MVC (Model View Controller), une approche permettant de dissocier les traitements, des donnes manipules et de leurs prsentations dans linterface graphique.

nous allons nous attaquer notre application Web proprement parler. Commenons par le squelette de celle-ci.

> Cration du squelette de lapplication

Nous pourrions bien sr partir de zro et mettre en place les diffrents lments mais Express fournit un outil en ligne de commande pour nous aider dans cette tche. Il est situ dans le rpertoire node_modules/express/bin directement dans notre rpertoire courant. Cet outil nous permet de choisir les diffrents outils additionnels que nous allons utiliser dans notre application. La ligne de commande suivante sous-entend que nous utilisons Jade pour les templates ainsi que Less pour lcriture des styles CSS : $ ./node_modules/express/bin/express -c less contactapp Il est noter que le dernier paramtre prcise le rpertoire dans lequel sera cr le squelette de notre application. Nous lappellerons contactapp puisquelle retournera une liste Fig.1 de contacts. Lorganisation choisie est la suivante: un fichier app.js pour la configuration de lapplication, un sous-rpertoire public pour les ressources statiques, un sous-rpertoire routes pour les contrleurs et un sousrpertoire views pour les vues Jade. A noter la prsence dun fichier package.json la racine contenant la description du module correspondant lapplication [Fig.1]. Dcrivons maintenant plus en dtail lorganisation de lapplication ainsi que ses constituants.

> Installation du framework Express

Nous nallons pas revenir ici sur la manire dinstaller Node. Il convient nanmoins de savoir que son installation met galement disposition un puissant outil de gestion de modules dvelopps pour Node, NPM (Node Package Manager). Nous allons lutiliser afin dinstaller les diffrents outils dont nous aurons besoin dans cet article. NPM se base sur un dpt distribu contenant les modules ainsi que leurs descriptions et la liste des dpendances requises. Il permet ainsi de grer de manire automatique linstallation de ces dernires. Les lecteurs ayant utilis Linux ne seront pas dpayss car on y trouve des outils similaires tels que apt-get ou rpm. Express est disponible dans le dpt NPM et sinstalle donc par lintermdiaire de cet outil. Pour installer Express, il suffit simplement de taper la ligne de commande suivante : $ npm install express Comme nous utiliserons deux autres outils pour construire notre application Web, il faut galement installer ceux-ci de manire similaire. Le premier est Jade, un moteur de templates pour Node, et Less, un prprocesseur facilitant lutilisation de CSS. Les lignes de commande suivantes permettent dinstaller ces deux outils : $ npm install jade $ npm install less $ npm install less-middleware Il est noter que ces diffrents outils ont t installs dans le rpertoire courant. NPM y cre un rpertoire node_modules les contenant. Maintenant que tous les outils ncessaires ont t installs,

> Organisation et configuration de lapplication

Nous avons laiss Express crer pour nous le squelette de notre application. Nous allons dans cette section regarder comment celleci est organise. Comme vous le savez, Node met en uvre une organisation sous forme de modules. Nous allons faire quelques rappels ce niveau. Ces derniers peuvent se rfrencer les uns les autres par le biais de la fonction require, cette fonction permettant daccder aux objets mis disposition par le module identifi par un nom. Trois types de noms sont utilisables : Les noms correspondant des modules de Node lui-mme tels que http, filsystem... Les noms correspondant des modules prsents dans le rpertoire node_modules comme dans notre cas express, jade et less.

PROgrammez !

< 73 >

JANVIER

2013

i webmaster
Les noms rfrenant des fichiers JavaScript via un chemin explicite tels que ./routes/contacts. Dans ce cas, il est possible domettre lextension du fichier JavaScript. Il est possible, et recommand, de tirer parti de cette fonctionnalit de Node afin dorganiser de manire optimale notre application Web. Une bonne pratique consiste galement en lutilisation dun fichier JavaScript point dentre pour les applications. Ce point central pour notre application correspond au fichier app.js directement sous le rpertoire de lapplication. Ce fichier contient les traitements de base et sera excut via la commande Node pour lancer lapplication. Il contient les diffrents traitements suivants : Importation des modules systme, dExpress et de lapplication; Initialisation dExpress; Configuration des routes pour accder lapplication; Cration du serveur hbergeant lapplication. Tout dabord limportation des modules ncessaires se ralise par lintermdiaire de la fonction require de Node, comme dcrit ci-dessous : lassociation, dans notre cas get. Ainsi, lexemple suivant spcifie que la fonction contact.list aura la responsabilit de traiter les requtes HTTP GET pour lURI /contacts.

Nous verrons par la suite comment dfinir ce type de fonctions et implmenter le traitement des requtes correspondantes. La dernire chose faire consiste mettre en place un serveur afin de mettre disposition lapplication via le protocole HTTP Pour ce . faire, nous allons utiliser directement le support HTTP de Node et sa fonction createServer. Notre application Express sera directement en paramtre de cette fonction et le dmarrage du serveur est effectif lors de lappel de sa mthode listen. Le code suivant dcrit la mise en place du serveur au sein du fichier app.js :

Maintenant que les fondations de notre application sont poses, il est temps dimplmenter ces traitements. La figure en bas de page donne une vue gnrale de lorganisation de lapplication et de ses diffrents constituants [Fig.2].

Il convient ensuite de crer une instance dapplication Express avec la fonction express mise disposition par le framework. Les configurations gnrales de cette application se font ensuite en utilisant les mthodes set et use de cette instance, la premire pour le positionnement de proprits et la seconde pour ajouter des middlewares lapplication prenant part la chane de traitement des requtes HTTP Dans le code ci-dessous, nous dfinissons notamment le port . daccs de lapplication ainsi que le rpertoire contenant les fichiers des vues et le moteur de templates. Nous activons ensuite, entre autres, les supports de routage, des ressources statiques, la compression automatique des contenus.

> Implmentation des contrleurs

Nous commenons par un contrleur. Ce dernier correspond la fonction passe en paramtre lors de la dfinition des routes. Elle accepte en paramtre les objets request et response relatifs la requte courante de lutilisateur, respectivement une reprsentation objet de la requte et de la rponse. Cette fonction a la responsabilit de traiter la requte, rcuprer ventuellement des donnes et passer ensuite la main la vue. Ce dernier traitement se ralise en se basant sur la mthode render de lobjet response prcdent. Il prend en paramtre lidentifiant de la vue utiliser ainsi quun tableau associatif correspondant aux donnes. Lexemple ci-dessous montre comment implmenter un contrleur Express utilisant des donnes de contacts en dur puis passe la main la vue contacts :

Lexemple prcdent est trs simple et ne fait pas appel une base de donnes. Si nous ladaptons, il convient de bien faire attention aux aspects asynchrones ventuels lors dappels aux bases de donnes. En effet, lappel du rendu de la vue doit bien se trouver au sein de la
Fig.2

Comme vous pouvez le constater, les appels des mthodes set et use sont encapsuls dans des fonctions en paramtre de la mthode configure. Cette faon de faire offre des facilits afin dactiver ou non des configurations en fonction de lenvironnement dans lequel est excute lapplication (tous, dveloppement, production). Dans notre cas, la dtection et laffichage des erreurs sont activs uniquement pour le dveloppement. Passons maintenant aux routes pour accder aux pages. Leurs dfinitions dans Express se ralise trs simplement puisquelles permettent dassocier un chemin relatif avec une fonction de traitement pour une mthode HTTP donne, comme dcrit ci-dessous. Le choix de la mthode HTTP est dtermin par la mthode utilise lors de

PROgrammez !

< 74 >

JANVIER

2013

J avaScript :la rvolution est- en marche ? elle

fonction recevant les rsultats. Le code suivant illustre ladaptation utilisant une base PostgreSQL en sappuyant sur le client pg pour cette base (https://github.com/brianc/node-postgres) : Jade supporte galement la possibilit de mettre en place des layout. Ces derniers permettent de modulariser et rutiliser les parties rcurrentes de linterface graphique (en-ttes, pieds de page...). Pour ce faire, il suffit de crer plusieurs fichiers Jade, un pour le layout et un par page. Le lien entre la page et le layout se ralise par lintermdiaire dun hritage et dune rfrence. Commenons par le layout. Il sagit dun fichier Jade classique si ce nest la prsence dun lment block. Cet lment permet dembarquer un bloc de contenu dont le nom est content ici. Ce bloc sera substitu par la suite lors du rattachement une page.

Note : Une bonne pratique lors de lcriture dapplications pour Node est de rduire au maximum le niveau dimbrication des fonctions de rappel, qui peut vite augmenter de par lapproche asynchrone. Par exemple, pour le code prcdent, il serait intressant de scinder les traitements entre les appels la base et ceux du contrleur.

Dans notre page, il suffit dtendre le template avec un lment dnomm extends en prcisant le nom du template du layout, ici layout car nous lavons stock dans un fichier layout.jade. La seconde tape consiste dfinir le bloc de contenu dnomm content. Ce bloc sera alors plac dans le layout la place de llment block correspondant.

> Implmentation des vues avec Jade et Less

Nous arrivons la dernire section de notre article, limplmentation des vues afin de prsenter dans une page HTML la liste des contacts rcuprs. HTML, tant driv de XML, est un langage trs verbeux. Il faut ouvrir et bien fermer les balises, et dcrire les attributs sans oublier de fermer les guillemets. Le document HTML doit tre bien form pour obtenir le rendu souhait. Jade (http://jadelang.com/) est un moteur de templates qui met disposition une approche visant simplifier cela principalement en se basant sur lindentation des lignes et des raccourcis dcriture. Le code suivant illustre un exemple simple de template Jade :

Comme nous lavons voqu prcdemment, Express intgre un support de Less. Ce dernier permet de convertir la vole les feuilles de styles Less en CSS lorsquelles sont demandes. Il suffit uniquement de crer un fichier portant lextension .less qui sera utilis pour gnrer un fichier .css correspondant. Par exemple, si le fichier styles.css est demand via HTTP le fichier styles.less sera , utilis afin de le crer. Nous ne nous attarderons pas plus sur Less ici mais sachez que loutil supporte les expressions CSS et fournit des facilits dcriture afin de garantir un mme rendu pour les diffrents navigateurs sur des fonctionnalits telles que les dgrads et les bordures arrondies.

Indenter une ligne correspond ajouter un niveau dimbrication. Ainsi la balise head rsultante sera bien incluse dans la balise html. Vous pouvez galement remarquer la manire de dfinir le contenu dune balise partir dun lment prsent dans le modle au niveau du titre avec le symbole =. Avant de continuer, regardons rapidement ce que donne ce code aprs transformation par Jade :

> En rsum
Dans cet article, nous avons dcrit comment implmenter une application Web pour Node en utilisant Express, le plus populaire et utilis des frameworks Web pour Node. Ce framework met en uvre le patron de concept MVC (Model View Controller) afin de bien sparer les responsabilits de traitement des requtes Web de la prsentation des donnes manipules. Nous avons vu toute la puissance de loutil puisquen trs peu de lignes de code, nous arrivons mettre en place une application Web bien structure et maintenable, daffichage de contacts en utilisant JavaScript et base sur Node. De plus, Express permet la cration simplement et rapidement dun squelette dapplications Web pour dbuter le dveloppement. Express fournit de plus un ensemble de fonctionnalits configurables afin denrichir les traitements de lapplication (compression des donnes, scurit...). Aprs configuration, ils prennent part de manire transparente dans la chane de traitement des requtes. Il est noter quExpress permet lactivation de ces fonctionnalits selon lenvironnement dexcution. # Thierry Templier (thierry.templier@restlet.com) Architecte R&D, Restlet SAS Dveloppeur du portage de Restlet en JavaScript pour Node (https://github.com/restlet/restlet-framework-js)

Nous venons de dcrire un exemple simple de template Jade mais nous souhaitons dsormais prsenter les contacts que nous avons rcuprs dans notre contrleur. Pour ce faire, il convient de raliser une boucle sur la liste correspondante. Ceci est possible avec Jade par lintermdiaire de llment each. Ce dernier prend en paramtres le nom de la variable correspondant au tableau dans le modle, comme le montre le code suivant :

PROgrammez !

< 75 >

JANVIER

2013

i webmaster

J avaScript/dveloppeur : lAmour avec un grand A.

ilain petit canard du Web dans les annes 2000, le JavaScript sest aujourdhui taill une place de choix dans la bote outils des dveloppeurs. Le motif de ce dsamour initial ? Un langage difficilement abordable et entour de beaucoup da priori. Redout des dveloppeurs, le JavaScript a souvent fait figure de mauvais lve lcole du Web. Le JavaScript serait-il rserv llite ? Sous-entendu dmenti en quelques annes grce aux volutions qui senchanent : introduction de lAJAX, et mergence des frameworks que lon connat aujourdhui (JQuery, Mootools, Scriptaculous, ExtJS ou encore Sencha) qui envahissent le Web ( lheure actuelle, JQuery serait prsent sur prs dun site sur deux). Une revanche inattendue, pour autant, la transition entre un JavaScript distill au compte-gouttes dans des pages HTML et la propulsion dapplications Web dynamiques ne sest pas faite en un jour. Si les librairies ont particip lacclration du processus, cest tout lcosystme du Web qui a grandi simultanment.

Aujourdhui au centre de toutes les attentions, le JavaScript na pas toujours t aussi plbiscit. Mal aim il y a encore quelques annes, il est rapidement devenu le langage le plus en vogue chez les dveloppeurs dapplications Web. Comment expliquer ce succs fulgurant, quels sont les frameworks regarder de prs et quoi faut-il sattendre dans le futur... ? Dcryptage.

> Un langage en pleine mutation

En 2005, lAJAX fait son apparition ouvrant de nouveaux horizons aux dveloppeurs. Des applications dun nouveau genre dboulent sur le march, proposant une exprience utilisateur indite. Cette dferlante dapplications, en rupture avec tout ce qui se faisait prcdemment, sinscrira dans la vague Web 2.0. GMail est considr comme lun des pionniers de lAJAX, ayant rendu populaire le XmlHTTPRequest. Les volutions du langage senchanent, dcuplant les possibilits offertes aux dveloppeurs. Amlioration des performances, puissance de calcul accrue, introduction du JSON, les fonctionnalits natives du JavaScript ne cessent de stoffer. Le JavaScript est aujourdhui deve-

nu un alli indispensable dans la conception dune application Web. Pour rester dans la course, les navigateurs ont d sadapter. Le moteur JavaScript est mme devenu un argument marketing pour attirer les dveloppeurs. En 2008, Firefox ouvre les hostilits et annonant des performances entre 20 et 40 fois suprieures avec Tracemonkey. Google rpondra avec V8, la guerre tait dclare. Dans une bataille qui se joue entre benchmarks dun ct et exprimentations Web de lautre, il est difficile de dsigner un gagnant. Un seul constat simpose : le JavaScript daujourdhui nest plus ce langage relgu au second plan, car trop peu performant et hasardeux. Lunion faisant la force, le couplage des fonctionnalits natives de JavaScript et du HTML5 permettent maintenant de rivaliser avec les logiciels applicatifs. Travail hors-

ligne grce au stockage sur le disque de linternaute, Web sockets, push, modlisation via le canvas...Les perspectives semblent infinies.

> Lge dor du JavaScript

Il y a encore quelques annes, la simple vocation du nom JavaScript aurait fait tiquer nimporte quel dveloppeur Web ; associant le langage des mauvaises pratiques de codage, une interprtation alatoire suivant les navigateurs et lassurance de maux de tte en fin de journe. Larrive des frameworks a radicalement chang la donne et a contribu la rduction des temps de dveloppement des scripts front-end. Le principe : proposer des dizaines de mthodes simples implanter afin de simplifier lcriture de code. Grce elles, il est devenu plus simple de dvelopper des sites plus complexes ! En effet, si le JavaScript est un langage cross-

PROgrammez !

< 76 >

JANVIER

2013

J avaScript :la rvolution est- en marche ? elle

Comment choisir son framework ?

Il existe plusieurs grandes familles de frameworks : les frameworks permettant de travailler avec le DOM. Ce sont les plus rpandus : JQuery, Dojo, YUI... ceux permettant dappliquer une architecture MVC : Backbone.js est le plus populaire. dautres permettant de grer du templating comme Mustache, Handlebar ou Underscore ou encore des librairies de dtection type Modernizer, aidant au progressive enhancement (dsactivation de fonctionnalits si elles ne sont pas supportes par le navigateur). Cette liste est non exhaustive et uniquement prsente dans le but de structurer les choses. Il est galement possible de les faire voluer les uns avec les autres. Il faut garder lesprit quaucun framework nest meilleur quun autre. Ils fournissent tous des solutions rpondant un enjeu. Avant de vous engager avec un, mettez en place une liste de vos contraintes : techniques, dlais, budget. Puis posez-vous les bonnes questions : Le framework supporte-t-il les navigateurs dans ma cible ? Si vos deadlines sont serres et que vous ne le connaissez pas, essayez dvaluer relativement le temps dapprentissage dun framework. La librairie inclut-t-elle les lments dont jai absolument besoin ? Les autres sont-ils retirables ? Est-il simple dajouter un module ? De debugger mon code ? Que valent les performances par rapport aux concurrents ? La documentation est-elle suffisamment fournie et claire ? Quid de la communaut ? quand remonte la dernire mise jour ? Quelle est la licence ? Est-elle applicable mon projet ?

platform et quil fait lobjet de normes, il nen reste pas moins une lgre diffrence dinterprtation entre navigateurs. Seulement, ces quelques diffrences mineures, peuvent rendre caduque lintgralit dune Web app. Alors quil tait ncessaire de matriser toutes ces subtilits il y a encore peu, les frameworks soulagent le travail des dveloppeurs en palliant ces diffrences, et en assurant une interoprabilit complte des codes. La libert est ainsi laisse aux dveloppeurs de se concentrer sur leur algorithme.

> Lapparition de nouveaux outils

En parallle, des outils de debogage font leur apparition, tel Firebug, jouissant dune grande renomme sur Firefox, ou encore JSLint, service en ligne permettant de pointer les problmes potentiels de code (erreurs de syntaxe, respect des conventions dcriture, optimisation du code). Tous les navigateurs intgrent maintenant leurs propres outils de dveloppement, incluant une console JavaScript. La facilit crire et debugger du

Il est devenu plus simple de dvelopper des sites plus complexes !

code conditionnant pour beaucoup ladoption dun langage, ces outils ont contribu attirer les dveloppeurs vers le langage. Enfin, en plus de debugger son application, le dveloppeur sait quil est important de sassurer du bon fonctionnement de chaque module en effectuant des tests unitaires. En JavaScript, lopration peut sembler laborieuse. En effet, il est frquent de se retrouver avec divers modules rpartis sur des pages diffrentes, le tout mlang dans des bouts de HTML, quand on ne trouve pas des appels inline... Rajoutez cela des portions de code attaches des vnements (click, hover, survol, ...) et vous obtiendrez une belle soupe indigeste. Si les tests unitaires nont pas t prvus en amont du dveloppe-

ment, il faudra passer par ltape du refactoring : modifier la structure du code en gardant un fonctionnement identique. Ce refactoring est une tape intressante dans le sens o elle permet damliorer larchitecture dune app et ventuellement les performances. L encore, pour aider les dveloppeurs dans cette tche, plusieurs frameworks ont vu le jour. QUnit est le plus populaire et sinsre parfaitement avec JQuery tandis que FireUnit ajoute un onglet de test dans la console de Firebug. Tous ces frameworks JavaScript ont galement ouvert la porte des possibilits jusqualors peu explores : animations riches, gestion de slecteurs complexes. Un vrai plus pour lexprience utilisateur. Toutes ces librairies tirent parti de lorient objet et sont donc extensibles souhait. Grce au partage des ressources sur Internet, de nombreux modules sont gnreusement mis en t l c h a r g e m e n t ( s l i d e s h o w, f e n t r e s modales, scripts de validation ct utilisateur, ...) et contribuent rendre le langage accessible. Node.JS est lautre rvlation. Trs en vogue sur les sites Web forte audience, Node.JS a t conu pour permettre de btir rapidement des applications scalables. La plateforme sappuie sur le moteur V8 de Chrome pour excuter du JavaScript ct serveur. Ainsi, le mme langage est utilis pour le dveloppement ct client & serveur. Il est galement important de rappeler une dmarche en pleine expansion visant amliorer l'exprience utilisateur (UX). En lien avec le HTML et le CSS, il est possible de crer une vraie exprience dynamique et interactive entre linternaute et lapplication Web (ou le site vitrine). Cela passe galement par des petites amliorations moins remarques, mais, tout aussi importantes, comme les retours dinformations, lexcution de requtes asynchrones, permettant dacclrer les processus denvoi et rcupration dinformations en AJAX de faon non bloquante. Le JavaScript est un formidable

langage quand il est utilis habilement. Lavenir nous promet encore de belles surprises et il nest pas exclu de voir dautres utilisations innovantes du langage dans les prochains mois. # Matthieu Loussinian Directeur gnral de FrenchTouched, socit spcialise en dveloppement & consulting e-commerce. http://www.frenchtouched.fr

PROgrammez !

< 77 >

JANVIER

2013

i webmaster
Avis dexpert

J avaScript est souvent incompris !

Sil y a un langage dont pratiquement tout le monde a entendu parler, que lon travaille dans linformatique ou non, cest bien le JavaScript. Et pourtant il reste souvent incompris. Les raisons en sont multiples : son nom na jamais aid y voir clair et sa russite et sa vulgarisation font que chacun a souvent une ide diffrente de ses avantages et de ses inconvnients.

ela commence par un problme de nommage. Conu en 1995 Netscape, il devait servir dalternative au langage Java, pour permettre notamment aux dveloppeurs novices ou non professionnels dcrire des scripts pour les pages sexcutant dans le clbre navigateur de la compagnie. Ce statut lui a valu son nom : JavaScript. Or, le nouveau langage nhrite de son prdcesseur que le nom. Certes, sa syntaxe ressemble celle du langage dvelopp par Sun, et donc aussi au C ou au C++, mais les similitudes sarrtent l. Ses caractristiques de langage fonctionnel le rapprochent plus du Lisp ou du Scheme, les parenthses en moins.

> Une capacit dvoluer

Ds sa sortie, JavaScript est rapidement adopt par les dveloppeurs de pages web, qui trouvent dans le langage un moyen simple et efficace dajouter de linteractivit au code HTML statique, ce qui a pouss les concurrents de Netscape, et notamment Microsoft, crire leurs propres implmentations pour leurs navigateurs. Laccueil chaleureux des dveloppeurs et des constructeurs pousse Netscape soumettre la dfinition du langage un organisme de certification, la European Computer Manufacturers Association ou ECMA. Cest ainsi que, seulement 2 ans aprs sa cration, JavaScript devient une implmentation dun nouveau standard, lECMAScript. En quinze ans, le standard a peu volu, mais son adoption massive est incontestable, malgr les difficults quil a pu rencontrer au cours du temps. En effet, les implmentations du langage et des interprteurs qui lexcutent se sont longtemps caractriss par leurs pauvres performances et leurs bugs. En dpit dun manque de ressources pdagogiques de qualit, comme on en trouve abondamment pour

dautres langages, JavaScript a t adopt par un public trs large, et pas toujours professionnel, ce qui a aussi favoris la prolifration de code de qualit mdiocre, donnant par extension au langage une mauvaise rputation. Ce qui na, heureusement, pas empch JavaScript de devenir lun des plus importants moteurs derrire lvolution technique du Web, en tout cas, ct client. Au dbut des annes 2000, cest le J dans le nouveau terme AJAX qui dcrit les techniques permettant aux sites web de raliser des appels asynchrones sur le serveur et de proposer ainsi aux internautes des expriences plus riches et plus ergonomiques. Aujourdhui, il est aussi pratiquement indissociable de celui qui commence se faire une place importante dans le web, lHTML 5, qui lui, expose ses API de dragand-drop, de stockage, de golocalisation, etc. permettant la cration de sites extrmement riches, incorporant multimdia et animations, et de plus en plus difficiles diffrencier des applications natives. Cette adoption du langage a contribu lapparition dun cosystme trs diversifi (et malheureusement un peu fragment) dans lequel des bibliothques et des frameworks tels que jQuery, Prototype, Backbone, Knockout, et bien dautres, sefforcent dacclrer et de faciliter le dveloppement de sites web de plus en plus riches. Mais aucun moment il na t dit que JavaScript devait se limiter lexcution dans un navigateur web. Ds la sortie du langage, Netscape proposait une implmentation serveur de celui-ci et pendant longtemps le JScript, limplmentation de Microsoft, tait une alternative au VBScript pour crire des Active Server Pages qui, comme leur nom lindique, sexcutent ct serveur. Ces technologies nexistent plus aujourdhui, mais depuis peu Node.js est venu combler le vide dans ce

domaine, proposant un environnement de dveloppement serveur bas sur linterprteur JavaScript dvelopp par Google pour le navigateur Chrome et conu pour tre extrmement adaptable. diffrents moments dans son histoire, JavaScript a aussi russi quitter le Web pour sinstaller confortablement sur le bureau de lordinateur personnel sous une multitude de formes. Cest lui, par exemple, qui anime les widgets du Dashboard Mac OS X ou les gadgets sous Windows. Cest aussi JavaScript qui est utilis dans le dveloppement des extensions des navigateurs comme Firefox ou Chrome. Et au cas o on croirait que JavaScript ne sert dvelopper que des accessoires , Microsoft en a fait un langage de premire classe sur PC avec la sortie de Windows 8, puisque le couple HTML5/JavaScript permet dcrire des applications compltes capables dutiliser toute la puissance de la plateforme. Il est donc impossible de nier que ses qualits techniques et sa portabilit ont permis JavaScript de simposer aujourdhui dans tous les domaines. Soutenu par des gants de lindustrie, son cosystme gagne en robustesse et commence tre considr srieusement par les dveloppeurs professionnels. Ceci rsulte en une augmentation des ressources et du code de qualit la disposition des nouveaux arrivants, qui en profiteront pour ajouter leur rpertoire un outil promettant de nombreuses opportunits professionnelles. # Mauricio Diaz Orlich - Consultant - Wygwam

A lire dans le prochain numro

N160-Fvrier 2013, para le 31 ja tre nvier 2013 Dvelopper pour

Facebook

La plateforme, les API et SDK, opengraph, le modle conomique

Cloud, open Cloud : ce qui change pour les dveloppeurs

PROgrammez !

< 78 >

JANVIER

2013

i webmaster

Ecrire un module dextension Prestashop

Prestashop est un CMS orient commerce en ligne. Ds son installation il savre trs complet et trs efficace. De nombreux modules existent qui peuvent lenrichir, mais tt ou tard, il sera ncessaire dcrire soi-mme un module dextension pour des besoins particuliers.
Fig.1

restashop est un logiciel pour le commerce en ligne de mme nom que la socit qui ldite. Il est open source, sous licence Open Software 3.0. A lorigine, il sappelait phpOpenStore, et il a t cr en 2005 par 5 tudiants de lcole dinformatique Epitech. Trs rapidement, il a connu le succs auprs de ceux qui ont besoin dune solution rapide de mise en place dun site de e-commerce. De par sa conception et son architecture, il mrite le titre de CMS. Mais un CMS pens avant tout pour le commerce. Dentre de jeu, la gestion des factures, des commandes est prsente, alors quavec un CMS gnraliste comme Drupal, vous devrez ajouter des modules. Par contre Prestashop nest pas loutil pour tenir un blog. De trs nombreux modules dextension sont disponibles pour Prestashop, et bien entendu ceux-ci sont essentiellement ddis au commerce en ligne. Cependant, il viendra toujours le moment o il sera ncessaire de personnaliser rapidement Prestashop pour un besoin particulier. Nous allons faire le tour de ce quil faut savoir pour tre oprationnel rapidement. Pour cet article, nous avons utilis Prestashop 1.4.9.

1 INSTALLATION DE PRESTASHOP
Comme WordPress que nous avons tudi dernirement, Prestashop est conu pour fonctionner dans un hbergement bas de gamme, condition que celui-ci vous fournisse PHP 5 et MySQL 5 au minimum. La procdure dinstallation est des plus simples. Tout dabord vous devez disposer dune base de donnes, ce que vous fournira un hbergement bas de gamme, ou que vous mettrez en place sur un serveur ddi. Ensuite, on commence par tlcharger larchive de Prestashop. Puis, si vous disposez dun serveur ddi, vous uploadez larchive et la dcompressez sur place, sinon vous dcompressez larchive sur votre machine de travail, puis vous uploadez tout le contenu dcompress sur votre serveur, via un client FTP Ceci fait, vous allez visiter votre site sous Prestashop. Ce . dernier se rendra compte quil nest pas install et lancera la procdure. Vous aurez quelques renseignements donner, dont le nom de la base de donnes votre disposition, et linstallation se fera entirement. Au cours de la procdure, on vous demandera si vous souhaitez une installation simple, ou une installation plus lourde comprenant tout un jeu de modules. Sans hsiter, optez pour ce dernier choix. Une fois linstallation termine, vous devrez supprimer le rpertoire install de larborescence de Prestashop et aussi, pour des raisons de scurit, renommer le rpertoire admin dun nom qui vous conviendra et, si possible, que vous seul connatrez. Ensuite, pour accder linterface dadministration de votre site sous Prestashop, vous donnerez cette url dans un navigateur : http://www.mon-domaine.com/nouveau_repertoire_admin

sur trois colonnes, avec en-tte et pied de page. Les colonnes sont faites dun empilage de pavs ou blocks. Un module dextension peut agir sur toutes ces parties. Prestashop sappuie sur la programmation objet en PHP et sur une architecture 3-tiers dans lesprit, nous , dit sa documentation, de larchitecture MVC, ou Modle-Vue-Contrleur, et organise comme ceci, toujours selon la documentation: Object/donnes. Laccs la base de donnes se fait par le biais des fichiers du dossier /classes. Contrle des donnes. Le contenu envoy lutilisateur est vrifi par les fichiers du dossier racine. Apparence. Tous les fichiers du thme sont dans le dossier /themes. Les dossiers dont il est question sont ceux de larborescence de Prestashop. En jetant un oeil sur eux, on trouvera bien des renseignements qui devraient figurer dans la documentation, mais qui ny taient pas au moment de la rdaction de cet article. Il est vrai que la documentation tait signale comme tant en cours de rcriture. Par exemple, en visitant ce dossier classes, vous verrez que Prestashop propose une fine couche dabstraction pour le travail avec les bases de donnes. Ainsi, consultez le fichier Db.php et si vous utilisez MySQL, le fichier MySQL.php. qui implmente la classe abstraite DbCore de Db.php. Dans cette dernire vous trouverez des mthodes fort utiles, telles que pSQL qui permet dassainir des donnes devant tre passes des requtes SQL et de se prmunir ainsi des injections. Contrairement ce que dit la documentation, avec les versions rcentes de Prestashop, le contrle des donnes est effectu, par les fichiers rangs dans le rpertoire controllers. Les fichiers la racine ne font plus que renvoyer vers ce dossier.

2 LARCHITECTURE DE PRESTASHOP
Dentre de jeu, vous vous retrouvez avec un site dont la page daccueil est trs complte et structure [Fig.1]. La page est construite PROgrammez !

3 UN PREMIER MODULE
Commenons par crer un premier module en nous appuyant sur le Guide du Dveloppeur qui accompagne Prestashop, et en le compltant lorsque cela est ncessaire. Un module Prestashop est constitu dun sous-dossier du dossier modules de Prestashop.
JANVIER 2013

< 79 >

i webmaster
Ensuite ce sous-dossier doit contenir au moins un fichier .php de mme nom que le sous-dossier. Pour notre exemple nous avons cr un dossier nomm basicprog, que vous trouverez sur notre site. Voici le contenu de notre fichier basicprog.php : <?php if ( !defined( _PS_VERSION_ ) ) exit; class BasicProg extends Module { public function __construct() { $this->name = basicprog; $this->version = 1.0; $this->author = fred; $this->need_instance = 0; { if(parent::install() == false) return false; if(!$this->registerHook(leftColumn)) return false; if(!$this->registerHook(rightColumn)) return false; return true; } function uninstall() { if(!parent::uninstall()) return false; return true; } } ?> Le rle des deux premires lignes de code est dviter lexcution du contenu du fichier .php hors contexte, par une simple requte sur son URL. Nous voyons ensuite une classe qui drive de la classe module. Par convention, le nom de cette classe doit tre le mme que celui du module, en notation CamelCase. Nous initialisons ensuite quelques proprits publiques de la classe. Parmi elles, name doit tre le nom du module. La proprit need_instance prcise si le code de notre module doit tre charg ou non lorsquon navigue dans linterface dadministration de Prestashop. Aprs lappel au constructeur de la classe parent, viennent de nouvelles proprits publiques sous la forme de chanes de caractres. La premire est le message de confirmation mis par le backoffice de Prestashop. Les autres concernent laffichage du module dans linterface du backoffice. Dans le code, nous donnons du texte en anglais, mais celui-ci saffiche en franais dans linterface dadministration, ainsi que nous le voyons [Fig.2]. Ceci est la faon normale de procder avec Prestahop qui est conu ds le dpart pour linternationalisation. Bien remarquer dans notre code que la traduction des chanes est prpare par un appel la mthode 1 de la classe module. Toutes les chanes ainsi rpertories apparaissent dans linterface de traduction du backoffice (onglet Outil, puis menu Traductions), pour les langages activs. Il suffit alors de donner les chanes traduites pour que le module soit internationalis :-) Les chanes de traduction sont dposes par Prestahop dans le rpertoire du module, dans un fichier nomm daprs la langue, fr.php dans notre cas. Ce fichier ne doit pas tre modifi manuellement. Notre code pourrait sarrter au constructeur de notre classe. Nous aurions un module qui ne ferait rien, mais qui serait parfaitement fonctionnel. Nous pourrions linstaller depuis le backoffice, ce qui produirait un fichier XML supplmentaire dans le rpertoire de notre module. L encore ce fichier ne doit pas tre modifi manuellement. Attention au lien supprimer dans le backoffice modules, qui ne doit pas tre confondu avec le lien dsinstaller. Le lien supprimer efface purement et simplement le rpertoire du module et son contenu. Attention ne pas dtruire ainsi par maladresse tout votre code pendant le dveloppement ! Il est maintenant temps que notre module fasse un petit quelque chose.

parent::__construct(); $this->confirmUninstall = $this->l(Do you really want to uninstall BasicProg?); $this->displayName = $this->l(Basic Prog); $this->description = $this->l(A very basic demo); } public function hookLeftColumn($params) { global $smarty; return $this->display(__FILE__, basicprog.tpl); } public function install()
Fig.2

Nos chanes de textes apparaissent traduites dans le backoffice.

PROgrammez !

< 80 >

JANVIER

2013

i webmaster

4 LES HOOKS
Comme beaucoup de CMS, Prestahop fournit un mcanisme de hooks. Un hook est un point daccrochage pour des fonctions enregistres auprs du systme. Ces fonctions sont invoques au moment opportun par le systme, ou par des modules. Il existe des hooks pour tout : panier, produit, paiement affichage, etc. La liste, plus ou moins jour, est donne dans le guide du dveloppeur. Ne manquez toutefois pas de visiter la table ps_hook en base de donnes. Lendroit naturel pour enregistrer un hook est la mthode install de la classe du module. Cest ce que fait notre code, qui enregistre un hook pour afficher la vole un block dans la colonne gauche des pages de notre site. Le hook lui-mme gnre laffichage du block en invoquant un template Smarty, qui est le moteur de template de Prestashop. Attention, les hooks doivent obir eux aussi une convention de nommage, qui est donne dans le guide du dveloppeur. Voici notre template Smarty, dabord dans une forme rudimentaire. (Le lecteur trouvera les sources complets, y compris le fichier basicprog-page.php) : <! Block Left Basic Prog > <div id=basic-prog-left-bloc class=block left-block> <h4>Programmez!</h4> <div class=block-content> <ul> <li><a href={$base_dir}modules/basicprog/basicprog-page.php title =Cliquez ici !>Abonnez-vous!</a></li> </ul> </div> </div> <! /Block Left Basic Prog > Mais dans lesprit de Prestashop, il convient de prvoir ds le dpart linternationalisation, y compris dans les templates. On donnera donc : <! Block Left Basic Prog > <div id=basic-prog-left-bloc class=block left-block> <h4>Programmez!</h4> <div class=block-content> <ul> <li><a href={$base_dir}modules/basicprog/basicprog-page.php title={l s=Click here ! mod=basicprog}>{l s=Subscribe! mod=basicprog}</a></li> </ul> </div> </div> <! /Block Left Basic Prog > Ds le premier affichage dans le navigateur, Prestashop place les templates dans un cache pour des questions de performance. Au cours du dveloppement, dsactivez le cache, sinon vous ne verrez par le rsultat de vos modifications dans les templates. Pour linstant, notre template casse la structure des pages de Prestahop, ce que nous rsoudrons plus loin [Fig.3]. Au dpart, notre block apparatra trs probablement en bas de colonne. Ce problme se rgle par ladministrateur du site, via le backoffice, ainsi que les exceptions daffichage, lorsque le block ne doit pas apparatre sur telle ou telle page. Il est envisageable dagir sur lordre des blocks par program-

mation en modifiant la table ps_hook_module lors de linstallation du module. Nanmoins on doit auparavant bien se poser la question de la pertinence de faire cela. Car si de nombreux modules font de mme, cela perdra vite du sens.

5 AJOUTER UN NOUVEAU HOOK

Les hooks prexistants sont a priori suffisants pour crer des modules simples, mais il nest pas interdit de voir grand :-) Ainsi on peut imaginer le projet dun super module ambitieux et complexe qui pourrait tre enrichi de sous-modules. Ces sous-modules utiliseraient des hooks proposs par ce super module. Comment, dans ce cas, mettre en place un hook ? Dabord on crera une entre dans la table ps_hook. Ensuite, le code de notre super module invoquera les fonctions enregistres comme ceci : Module::hookExec(le-nom-de-notre hook); Ainsi toutes les fonctions enregistres seront invoques, mais dans un ordre a priori indtermin.

6 UN MODULE COMPLET
Nous allons maintenant passer notre second exemple qui est un module complet, et configurable depuis le backoffice. Notre module cre nouveau un block en colonne de gauche, et un clic sur ce lien simule lachat dun abonnement votre magazine prfr :-) La configuration dans le backoffice permet de tricher, en doublant le nombre des abonns :-) Voici les mthodes importantes de la classe de ce nouveau module (DemoProg sur notre site) public function install() { $this->initDB(); if(parent::install() == false) return false; if(!$this->registerHook(leftColumn)) return false; if(!Configuration::updateValue(DEMOPROG_DOUBLER_ABOS, 0)) return false; return true; } function uninstall() { Db::getInstance()->Execute(DROP TABLE `._DB_PREFIX_.demoprog`); if(!parent::uninstall()) return false; if(!Configuration::deleteByName(DEMOPROG_DOUBLER_ABOS)) return false; return true; }

Fig.3

Pour linstant notre template daffichage ne sintgre pas Prestahop.

JANVIER 2013

PROgrammez !

< 81 >

i webmaster
private function _displayForm() { $this->_html .= <form action=.$_SERVER[REQUEST_URI]. method=post> <div style=margin:0 0 20px 0;> <input type=checkbox name=DEMOPROG_DOUBLER_ABOS id= DEMOPROG_DOUBLER_ABOS style=vertical-align: middle; value=1 .(Configuration::get(DEMOPROG_DOUBLER_ABOS) ? checked =checked : ). /> <label class=t for=DEMOPROG_DOUBLER_ABOS> .$this->l(Double subscriptions).</label> </div> <input name=btnSubmit class=button type=submit value=Valider /> </form>; } public function getContent() { if (Tools::isSubmit(btnSubmit)) { Configuration::updateValue(DEMOPROG_DOUBLER_ABOS, (int)Tools::getValue(DEMOPROG_DOUBLER_ABOS)); } $this->_html .= <fieldset> <legend>.$this->l(Configuration Demo Prog).</legend>; $this->_displayForm(); $this->_html .= </fieldset>; return $this->_html; } public function initDB() { $id = 1; $nb_abo = 0; Db::getInstance()->Execute(
Fig.4

CREATE TABLE IF NOT EXISTS `._DB_PREFIX_.demoprog` ( `id` int(11) NOT NULL, `nb_abos` int(11) NOT NULL )ENGINE=MyISAM DEFAULT CHARSET=utf8;); Db::getInstance()->Execute(INSERT INTO ._DB_PREFIX_ .demo prog (id, nb_abos) VALUES (1, 0)); } La mthode install commence par crer une table en base de donnes. Cette table ne contiendra quun enregistrement, pour conserver le nombre dabonns. Puis notre mthode install enregistre un hook, comme dans lexemple prcdent, et enfin dfinit une variable de configuration dont nous nous servons pour savoir si nous devons doubler le nombre dabonns. La question se pose alors de savoir comme faire apparatre cette variable de configuration dans le backoffice [Fig.4]. Le guide du dveloppeur nen dit rien ! Cest l quil est intressant dinstaller Prestashop avec de nombreux modules. Ainsi, jai trouv la marche suivre dans le code du module Google Sitemap. La solution consiste implmenter dans notre classe une mthode getContent qui fournit laffichage pour le backoffice. Si laffichage provient dun clic sur le bouton de validation, on enregistre le nouvel tat de la variable, et dans tous les cas, on affiche un formulaire. Vient ensuite la question de savoir comment obtenir un affichage intgr Prestahop. Le lecteur trouvera la rponse dans le fichierdemoprog-page.php sur notre site, fichier qui sera invoqu lorsque lutilisateur cliquera sur le lien du bloc: Ce sont les includes de ce code qui assurent la structure de la page. Ensuite le point intressant est la cration, via $smarty->assign, dune variable qui sera accessible depuis le template qui est invoqu immdiatement aprs, et dont voici le code. (Linternationalisation est laisse au lecteur :-) <h1>Bienvenue Programmez!</h1> <p>Programmez! compte dsormais {$messageSmarty} abonns</p> Avec ce procd, notre module produit un affichage bien intgr Prestashop. # Frdric Mazu - fmazue@programmez.com
Fig.5

Notre variable de configuration apparat dans le backoffice.

PROgrammez !

Cette fois notre module sintgre correctement Prestashop.

< 82 >

JANVIER

2013

Les outils des Dcideurs Informatiques

Vous avez besoin dinfo sur des sujets dadministration, de scurit, de progiciel, de projets ? Accdez directement linformation cible.

Cas clients Actu trie par secteur Avis dExperts

Actus

Evnements

Newsletter

Vidos

www.solutions-logiciels.com
OUI, je mabonne (crire en lettres capitales)
1 an : 50
M. Titre : Mme

Envoyer par la poste : Solutions Logiciels, service Diffusion, GLIE - 17 chemin des Boulangers 78926 Yvelines cedex 9 - ou par fax : 01 55 56 70 20
au lieu de 60 , prix au numro (Tarif France mtropolitaine) - Autres destinations : CEE et Suisse : 60 - Algrie, Maroc, Tunisie : 65 , Canada : 80 - Dom : 75 Tom : 100

10 numros par an.

Mlle Socit . . . . . . . . . . . . . . . . . . . .. . . .. . .. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . Directeur informatique Responsable informatique Chef de projet Admin Autre . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Fonction : ....

NOM . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. .Prnom . . . .. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . . . . . N . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . .. . .. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . rue . . . . . . . Complment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . .. . . .. . .. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Code postal : L L L Ville . . . . . . . . . . . . . . . . . . . .. . . .. . .. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . L L I . . . .. . Adresse mail . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . .. . . .. . .. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

Je joins mon rglement par chque lordre de SOLUTIONS LOGICIELS

Je souhaite rgler rception de facture

Editeur : K-Now sarl au cap de 8000 sige social : 21 rue de Fcamp, 75012 Paris