Le cahier des charges.

Le cahier des charges tient en quelques lignes. L’application proposera une liste des festivals musicaux de l’été en France.

1. L’application sera disponible sur les plateformes iOS et Android.
2. On aura le choix entre une carte ou une liste des événements.
3. Un clic sur un événement (carte ou liste) affichera ses informations.
4. Un filtre permettra de n’afficher que certains événements.

L’entreprise qui reçoit cette demande a plusieurs choix possibles en ce qui concerne ses ressources humaines et cela peut se résumer par « développement natif ou hybride ? »

Natif ou hybride ?

Le développement dit natif.

Le développement dit hybride.

Dans les deux cas, le but est de créer une application native, les appellations sont donc trompeuses. Ce qui va changer c’est la façon de coder cette application. Vous remarquerez que j’ai présenté de manière égale le temps consacré au design au code et aux tests. Les étapes du design et surtout celles des tests sont souvent réduites à néant et c’est un problème majeur aujourd’hui : des applis mal pensées qui fourmillent de bugs.

Zoom sur le code.

Le développement dit natif.

Le développement dit hybride.

Vous l’aurez compris, le développement hybride est très avantageux et c’est cette méthode que je vais décrire dans la suite de cet article. Mais par quel miracle va-t-on pouvoir écrire une application mobile en JavaScript puis la convertir en deux applications natives ? La réponse est simple : Cordova.

Cordova ?

Cordova est un framework qui va permettre d’écrire une application mobile de la même façon qu’un site web, en accédant aux fonctions natives du mobile : géolocalisation, appareil photo, clavier, mouvements …

L’interface sera donc une simple page HTML5 avec sa feuille de style CSS et l’interaction ainsi que l’accès aux fonctionnalités natives se fera grâce au JavaScript. JavaScript est aujourd’hui exécuté de manière extrêmement rapide par votre smartphone grâce à Google qui a développé le moteur utilisé dans tous les navigateurs modernes : V8. Il n’y a donc aucune crainte à avoir quant aux performances de votre application.

Les fonctions natives d’Android et iOS ont été unifiées au sein de Cordova. Un appel à la fonctionnalité “géolocalisation” par exemple marchera donc sur les deux plateformes.

Pas si simple.

Je tiens à préciser que coder une application de cette façon n’est pas plus simple que de coder une application iOS avec xCode en Swift ou en Java pour Android, loin de là. De plus, le JavaScript est certainement le langage le plus difficile à appréhender des trois. Mais si vous voulez créer des applications natives universelles, vous devriez clairement vous y mettre.

Petit détail : grâce à sa versatilité, le JavaScript est de plus en plus valorisé en entreprise.

Premières étapes.

Une fois le cahier des charges établi, la première chose à faire est de mettre en forme l’application par des dessins à la main ou avec un logiciel de wireframing. Ensuite, on passe au design et pour cela j’ai mes chouchous.

1. Sketch, la référence pour le design d’interface avec son application “miroir” pour la prévisualisation sur votre smartphone.
2. Principle, qui permet d’animer complètement cette interface et bientôt de la prévisualiser sur votre mobile de la même façon que Sketch.

Deuxième étape.

Pour coder une application avec Cordova une multitude d’outils ont fait leur apparition. Pour commencer, je vous conseillerais Ionic qui est un framework basé sur Cordova en perpétuel développement. C’est un peu le bootstrap pour application mobile. Ionic utilise AngularJS qui est le plus utilisé des framework javascript, et oui.

À titre personnel, je développe toutes mes applications avec React Native+ Redux. Je ne suis pas un grand fan d’Angular, mais la facilité de prise en main de Ionic est assez impressionnante je dois l’avouer, et c’est pour cela que je lui dédit un article aujourd’hui.

Vous avez maintenant fait vos choix, il est temps de coder !

Rien d’insurmontable dans ce cahier des charges. Quelques heures suffiront à mettre au point une navigation correcte. La partie qui peut devenir très longue est la carte à afficher dans l’appli. Pour ne pas perdre de temps sur cette partie mon choix s’est tourné vers Google Maps : la documentation est très riche et vous propose des exemples pour la plupart des situations.

Conclusion.

Je me répète, mais le design UX et UI ainsi que la bêta sont des étapes très très importantes qui peuvent s’avérer bien plus longues que le développement lui même. Si vous souhaitez développer une application iOS (ou Android) uniquement je vous conseille de la développer par la voie dite native. Mais si votre application a vocation à être multiplateforme, n’hésitez pas à explorer ce nouveau monde !