Ionic Framework pour vos applications mobiles hybrides


Technique

Create mobile apps with the web technologies you love.

Suite à notre article sur Apache Cordova, nous vous présentons cette semaine Ionic Framework : un framework utilisant Apache Cordova et aidant à la création d’applications mobiles hybrides.

Ionic utilise AngularJS pour le développement backend, et Sass pour la gestion du thème. Nul besoin de télécharger vous-même Apache Cordova afin de pouvoir déployer votre application puisque Ionic intègre directement la technologie dans son écosystème. Nous verrons comment dans la suite de cet article.

 

Comment cela fonctionne ?

Ionic est un framework complet, c’est-à-dire qu’il propose de vous aider dans le développement de votre interface graphique (frontend), mais aussi dans le développement de toute la logique métier (backend).

 

D’un point de vue frontend 

Le framework possède son propre thème HTML/CSS afin de pouvoir disposer rapidement d’une application fonctionnelle. L’utilisation de Sass permet notamment de modifier les variables du thème afin de changer les couleurs, les polices et tout autre paramètre disponible.

Comme on peut le voir sur la documentation CSS, le framework met à disposition un certain nombre d’éléments comme le fait également Twitter Bootstrap. On note par exemple la présence d’une grille, de tabs (en version iOS et Android), et de tous les éléments que l’on a l’habitude de retrouver sur l’UI d’une application mobile.

L’intérêt de disposer de tels éléments est d’avoir une base de travail pouvant être par la suite personnalisée selon votre charte graphique. En effet, l’interface des applications mobiles reste plus ou moins toujours la même, c’est donc beaucoup plus simple de travailler en ayant une base.

 

D’un point de vue backend 

Le framework est basé sur AngularJS, gage de stabilité puisque le framework est maintenant largement utilisé et surtout développé par Google.

Ionic apporte un lot de fonctionnalités très poussées afin de pouvoir développer une application “web” au plus proche du natif.

Comme indiqué dans la documentation JS, nous retrouvons notamment un “Side menu”, des tabs, la possibilité de gérer l’intégralité des gestures et évènements présents sur mobile (onTap, onDoubleTap..). Autant de fonctionnalités indispensables pour développer une application mobile, et se rapprocher ainsi au maximum d’une application développée “nativement”.

 

L’écosystème

Voici une liste non exhaustive des différentes fonctionnalités disponibles dans l’écosystème Ionic qui vont vous permettre de simplifier le développement de vos applications.

Ionic CLI : Ionic dispose de son CLI tout comme Symfony le propose en PHP. Celui-ci va permettre notamment de démarrer un projet rapidement, de lancer un serveur local de développement, de builder les applications, de lancer les émulateurs. Il s’agit donc d’un élément important de l’écosystème, et c’est un des atouts de ce framework.

Dans la pratique, l’utilisation du CLI se révèle être réellement indispensable.

 

Ionic Lab : Comme évoqué précédemment, Ionic met à disposition un “lab” : il s’agit d’un serveur de développement local émulant l’interface Android et iOS côte à côte et disposant d’un livereload.

Cette fonctionnalité est vraiment très intéressante lors du développement de l’application puisqu’elle permet de voir les différences entre les deux plateformes, mais également de développer à l’aide du livereload comme on le ferait sur un projet web.

lab 300x251 Ionic Framework pour vos applications mobiles hybrides

 

ngCordova : Extensions AngularJS permettant d’intégrer les plugins Apache Cordova et d’avoir ainsi accès aux fonctionnalités du device, telles que l’appareil photo, le touch id, ou encore l’accéléromètre, depuis un service Angular.

 

Ionic creator : Il s’agit d’un assistant à la création d’applications Ionic, permettant de créer des interfaces graphiques via de simples “drag and drop” puis de créer votre projet Ionic grâce à l’identifiant de votre projet “creator”.

 

Depuis quelques années, le développement d’applications hybrides est devenu un enjeu majeur car elles permettent de réduire considérablement les coûts liés au développement.

Et c’est avec l’arrivée des frameworks JS, tels que AngularJs, que celles-ci ont pu atteindre un niveau de performance presque équivalent à celui des applications natives.

Ionic n’en est qu’à ses débuts et pourtant une grande communauté s’est construite autour du framework, notamment avec la présence de Meet-up sur Paris. De plus, l’équipe de développement du framework travaille au quotidien sur de nouvelles technologies afin d’enrichir l’écosystème, ils ont par exemple récemment annoncé l’arrivée de Ionic Analytics, ou encore Ionic Deploy.

Nous vous recommandons donc d’ajouter Ionic à votre veille technologique et également de consulter le blog qui lui est dédié.

Laisser un commentaire