Créer une application mobile avec Ionic 2 et Angular 2

Découvrir les outils en ligne de commande

Testez gratuitement nos 1300 formations

pendant 10 jours !

Tester maintenant Afficher tous les abonnements
Ionic dispose d'un outil en ligne de commande fort pratique. Voyez comment l'installer et ainsi, vous pourrez générer des bouts de code.
04:58

Transcription

Vous allez voir, tout au long de cette formation, on va utiliser la ligne de commandes. Qu'est ce que ça veut dire ? L'équipe de Ionic a créé un outil qui s'appelle le CLI. C'est ni plus ni moins qu'un utilitaire qu'on va installer au travers de NPM et qui va nous permettre de taper des commandes pour pouvoir accélérer le travail. Pour les installer, c'est assez simple, vous allez à la page de docs sous l'espace CLI, et puis vous prenez l'intro, et ici vous aurez la ligne de commande à taper. Alors on remarque que c'est un outil qui vient s'installer depuis le «Node Package Manager», avec la commande «install» que vous pouvez réduire en juste «i», le « - g » qu'on a là, c'est un flag qui nous permet d'installer en fait un paquet par NPM, mais de façon globale sur l'ordinateur, donc d'abord à disposition de la commande Ionic partout, et enfin, Ionic, c'est l'utilitaire. Donc, on va copier, simplement, cette commande, et dans la console, va allez taper ça. Attention, de temps en temps, vous aurez peut-être des conflits, si vous pouvez pas l'installer comme ça, pensez sous un Mac, à mettre un sudo devant, et puis sous Windows, ça devrait pas poser de problèmes, le « -g » passe très bien. Ici bien sûr, il va aller chercher tous les paquets, et, il va nous installer l'outil en ligne de commande. Ca peut prendre un certain temps, pendant ce temps là, faisons un petit tour des différents outils qui sont fournis et qui sont disponibles au travers de la lilgne de commande de Ionic 2. Avec la ligne de commande, on va pouvoir faire pas mal de choses. On a ces commandes là, qui sont un peu détaillées, N'hésitez pas à regardez un petit peu ce que ça fait, on va rapidement passer sur les différentes commandes, de toutes façons, on les utlisera pendant qu'on travaillera. «Build», ça permettra de créer un projet, avec une plateforme donnée, si vous êtes sur de l'Android evidemment, ça vous permettra de créer un AP4 directement, et pour Ios, bon ce sera un peu plus particulier, parce que il faudra passer par X Code, on n'aura pas le choix. «Emulate» nous permettra, comme son nom l'indique, d'émuler l'application sur un émulateur. La plupart du temps, ici, vous utiliserez l'émulateur qui est fourni- il existe d'autres possibilités, on peut utiliser des émulateurs un peu plus légers que ceux qui sont fournis de base avec Android Studio ou X Code. «Generate», ça, c'est pas mal, parce que ça me permettra de générer des pans d'application Par exemple générer une nouvelle page Ionic, générer un provider, un provider ça peut vous servir pour mettre en place une définition particulière pour un service, on a pas mal de petites choses qui sont possibles, donc, de la génération pure, ça, je vous inviterais à pas forcément l'utiliser, car, vous allez apprendre avec moi comment on va se développer un petit composant, comment on va développer des pages, comment on va architecturer le projet ça peut servir, quand on veut aller vite, mais la plupart du temps, c'est pas forcément le meilleur outil, en tous cas, il a le mérite d'exister. «Info» vous permettra quand vous arrivez sur un projet, d'avoir les informations actuelles du projet, ça vous donnera les informations sur le projet. Vous pourrez le taper dans un projet Ionic pour connaitre les différentes informations, le run time, l'environnement, etc. «Plateforme», c'est un outil très intéressant qui permettra d'ajouter -ou de retirer d'ailleurs- une plateforme à votre projet. De base, vous pourrez démarrer soit sur de l'Android, soit sur de l'Ios, et pourquoi pas, au fur et à mesure, ajouter une nouvelle plateforme. vous développez un Android, et puis bon, vous avez envie d'ajouter le support Ios. On utilisera Ionic Platform, qui permettra d'ajouter aved "Add", une nouvelle plateforme. «Run» vous permettra de faire donc du coup un "run" de votre projet. Alors soit sur un émulateur parce que vous avez que ça, soit sur un téléphone branché, notamment avec Android ça marche très bien on branche un téléphone, on va le valider en tant que téléphone développeur, il faudra faire ça dans les préférences d'Android, et vous pourrez très facilement en fait, avoir sur votre application une installation over téléphone (sur le téléphone), et puis, vous verrez que ça va démarrer tout seul et depuis la console vous pourrez demander un reload de l'application tout simplement, vous coderez, ça se mettra à jour automatiquement. «Serve», c'est intéressant - et pas. Tout simplement parce que ça a un peu évolué, maintenant on va plutôt utiliser Serve au travers NPM, on verra ensemble, ça vous permet de développer sur un environnement local. Donc ça fera tourner le code que vous avez fait en Ionic sur votre navigateur. Attention quand même, petit bémol, développer dans le navigateur, c'est bien, c'est rapide, c'est facile, mais on pourra pas tout tester. Notamment, tous les paquets qui sont des paquets Native, nécessiteront forcément un autre téléphone pour être testés, parce qu'on ne peut pas émuler le Native dans le navigateur. Vous verrez quand-même que, il existe certains outils qui sont intéressants pour travailler, pour essayer d'émuler un peu le téléphone, on ne pourra pas tout faire malheureusement, donc on sera quand même de temps en temps obligés de tester sur téléphone. «Start» vous permettra de démarrer un nouveau projet c'est la première commande que l'on va voir quand on va commencer à travailler avec le CLI, avec les outils console. Normalement ils ont dû s'installer, vous avez ici une installation fraiche, on va pouvoir donc taper Ionic, et logiquement, en tapant Ionic, vous devriez avoir quelque chose qui démarre, donc le CLI, et puis toutes les commandes. Si vous voulez obtenir plus d'informations sur les commandes, n'hésitez pas à ajouter un «-h», donc un flag pour l'aide, qui vous permettra de détailler toutes les commandes et surtout tous lez arguments que vous pouvez utiliser avec. Ca vous permet d'avoir une vue globale, d'ensemble de tous les outils de la console c'est très sympa en plus, parce que c'est coloré, c'est mignon, vous verrez que c'est extrêmement rapide à utiliser, quand on a compris les quelques commandes de base, ça va très vite.

Créer une application mobile avec Ionic 2 et Angular 2

Développez vos applications mobiles avec AngularJS et Ionic. Mettez en place un projet et exploitez les nombreuses possibilités offertes par l’écosystème Ionic.

2h25 (30 vidéos)
Aucun commentaire n´est disponible actuellement
 

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !