Vous êtes intéressé par le développement d'applications mobiles mais vous n'avez pas les connaissances spécialisées ou l'expérience nécessaires pour programmer et développer des applications iOS et Android ? Eh bien, laissez-moi vous présenter le framework Ionic, qui vous permet d'écrire une application une fois et de la publier sur n'importe quelle plateforme mobile.

Qu'est-ce que IONIC ?

En termes simples, Ionic est un framework libre d'utilisation qui permet de créer des applications mobiles pour iOS, Android et Windows Phone, à partir d'une base de code unique. En d'autres termes, Ionic est un outil de développement mobile multiplateforme.

Ionic a été fondé en 2012 par une start-up technologique appelée Drifty Co, et c'est aujourd'hui le meilleur framework open-source au monde pour la création d'applications mobiles (hybrides) multiplateformes.

Comment fonctionne Ionic ?

Ionic vous permet de développer des applications mobiles en utilisant les technologies et les langages du web comme HTML, CSS, JavaScript, Angular et TypeScript. Par conséquent, considérez Ionic comme un kit de développement logiciel (SDK) pour la création d'applications mobiles hybrides. En tant que tel, Ionic fournit une collection de composants qui imitent l'aspect, la convivialité et les fonctionnalités natives de chaque plateforme mobile. Ces composants comprennent par exemple des boutons, des onglets, des menus, des listes, des cartes, des modaux, etc.

En plus de ces composants qui donnent le style et l'aspect des applications mobiles, Ionic fournit également les comportements appropriés comme la navigation et les gestes - par exemple, le glissement, la rotation et les événements de pincement, pour n'en citer que quelques-uns. Ionic comprend également une collection d'icônes appelées Ionicons. Tous ces composants sont des éléments que vous utilisez dans la construction de vos applications ioniques, ainsi que les plugins Cordova et PhoneGap, que nous aborderons prochainement.

Est-il difficile de débuter avec Ionic ?

Il n'est vraiment pas difficile de commencer à utiliser Ionic. Ionic est livré avec des outils pour vous aider à mettre en place, construire et faire fonctionner votre projet ionique - c'est l'interface en ligne de commande (CLI). Toutes les bibliothèques frontales et la CLI sont des projets open-source, vous pouvez donc les utiliser gratuitement lorsque vous développez vos applications.

Pourquoi utiliser Ionic ?

Il est difficile de développer des applications natives. Le développement d'applications Android seul nécessite d'apprendre à utiliser l'IDE (Integrated Development Environment) d'Android Studio et de connaître le langage de programmation Java ou Kotlin. Vous devrez également comprendre les concepts spécifiques à Android comme les activités et les intentions, et vous créerez les interfaces utilisateur de votre application avec une syntaxe XML personnalisée.

Pour iOS, vous devrez utiliser l'EDI Xcode (qui n'est disponible que pour Mac), ainsi que les langages de programmation Objective-C ou Swift d'Apple. Sans parler des nombreux SDK et concepts spécifiques à Mac ! Et en plus de cela, si vous décidez également de construire pour Windows Phone, vous devrez aussi apprendre à utiliser l'EDI de Visual Studio, ainsi qu'à écrire du code en C# ou en Visual Basic, etc...

Donc, si vous voulez envoyer votre application sur plusieurs plateformes, vous devrez réécrire la même fonctionnalité dans trois langues différentes ! Développer des applications de cette manière ne nécessite pas seulement d'apprendre un grand nombre de langages et d'outils différents, cela signifie également que vous finissez par recoder la même logique pour deux ou trois langages de programmation et plates-formes mobiles différents. Et la même duplication des efforts est nécessaire lorsque vous devez faire des changements. Développer des applications en natif demande beaucoup de temps, d'argent et de compétences. Ne serait-il donc pas formidable d'avoir une seule base de code qui fonctionne pour les trois plateformes ?

C'est là qu'intervient la technologie ionique !

Applications hybrides

Les applications hybrides tirent parti des bibliothèques de chaque plateforme ou des composants de l'interface utilisateur tels que les boutons, les listes, etc. L'un de ces composants est le webview - une vue qui affiche les pages web. Il s'agit d'un composant d'application mobile natif qui peut exécuter une application web. Vous pouvez donc écrire une application en HTML, CSS et JavaScript et utiliser un webview pour l'afficher.

On les appelle des applications hybrides car elles utilisent un mélange de code natif et de HTML, CSS et JavaScript. Il existe de nombreux frameworks qui permettent de créer facilement une application qui fait tourner une application web dans un webview. La plus populaire est Apache Cordova, généralement accessible via sa distribution la plus populaire : PhoneGap. Cordova est un projet open-source, et PhoneGap, propriété d'Adobe, est basé sur Cordova et fournit des fonctionnalités et des services supplémentaires en plus de celui-ci.

Ionic utilise le projet Apache Cordova pour construire et exécuter vos applications en tant qu'applications natives.Ionic and Cordova

Ionic et Cordova

Cordova sert de pont vers le code natif pour Ionic. Il compile votre HTML, JavaScript et CSS dans des applications natives, leur permettant de s'exécuter en natif sur les appareils Android, iOS et Windows Phone.

Si vous écrivez simplement une application web de la même manière que vous écrivez un site web et que vous l'intégrez comme une application mobile avec Cordova, le résultat final sera une application qui ressemble à un site web. Les utilisateurs remarqueront que le style et l'interaction avec l'utilisateur sont différents de ceux d'une application mobile "normale".

C'est la pièce manquante que Ionic fournit - l'aspect et la convivialité natifs. Ionic comprend une collection de composants qui ont le même aspect et la même convivialité que les composants natifs, en utilisant les styles et les comportements appropriés pour chaque plateforme, comme mentionné précédemment. Vous pouvez donc écrire votre application en HTML, CSS et JavaScript, mais votre application ressemblera à une application native plutôt qu'à une page web.

Cordova fournit également plus de 200 plugins disponibles sous forme d'add-ons que vous pouvez utiliser dans vos projets ioniques, qui vous permettent d'accéder aux API de dispositifs natifs comme l'appareil photo du téléphone, la géolocalisation, le gyroscope, etc. Vous pouvez les utiliser pour améliorer les caractéristiques et les fonctionnalités de votre application.

Ionic et Angular

Il y a de fortes chances pour que vous ne souhaitiez pas créer vos applications web en utilisant uniquement du JavaScript, du HTML et du CSS vanille. Au lieu de cela, vous utiliseriez probablement un framework web comme Angular. Angular est un framework incroyablement populaire qui permet de créer facilement des applications web réactives. Et maintenant, Ionic apporte la puissance d'Angular au codage mobile !

Ionic permet d'utiliser le framework Angular pour écrire des applications mobiles en fournissant une riche bibliothèque de composants ainsi que l'outillage nécessaire pour compiler le code Angular TypeScript en un ensemble de JavaScript, HTML et CSS, qu'Apache Cordova peut ensuite regrouper dans une application mobile native.