Cordova Tutoriel
Commencer avec Cordova
Recherche…
Remarques
Apache Cordova est utilisé pour créer des applications mobiles avec HTML, CSS et JS.
Apache Cordova cible plusieurs plates-formes avec une base de code.
Apache Cordova est gratuit et open source.
Cordova encapsule votre application HTML / JavaScript dans un conteneur natif pouvant accéder aux fonctions de périphérique de plusieurs plates-formes. Ces fonctions sont exposées via une API JavaScript unifiée, vous permettant d'écrire facilement un ensemble de codes pour cibler presque tous les téléphones ou tablettes sur le marché aujourd'hui et de les publier dans leurs magasins d'applications.
Qui pourrait utiliser Apache Cordova
un développeur mobile et souhaite étendre une application sur plusieurs plates-formes, sans avoir à la ré-implémenter avec la langue et les outils de chaque plate-forme.
un développeur Web et souhaitez déployer une application Web qui est emballée pour la distribution dans divers portails de la boutique d'applications.
un développeur mobile intéressé par le mélange de composants d'application natifs avec une fenêtre WebView (fenêtre de navigateur spéciale) capable d'accéder aux API au niveau du périphérique ou si vous souhaitez développer une interface de plug-in entre les composants natifs et WebView.
Introduction à Cordova: https://cordova.apache.org/docs/en/latest/
Installation ou configuration
Pour installer l'outil de ligne de commande cordova , procédez comme suit:
Téléchargez et installez Node.js. Lors de l'installation, vous devriez pouvoir invoquer node et npm sur votre ligne de commande.
Pour voir si Node est installé, ouvrez votre interface de ligne de commande (CLI). Pour Windows, il s'agit de l'invite de commande Windows. Pour MAC, c'est le terminal. Type:
$ node -v
Cela devrait imprimer un numéro de version, vous verrez donc quelque chose comme ceci v0.10.35. Si Node n'est pas installé, trouvez votre système d'exploitation et suivez les instructions ici: https://nodejs.org/en/download/package-manager/
(Facultatif) Téléchargez et installez un client git , si vous n'en avez pas déjà un. Après l'installation, vous devriez pouvoir appeler git sur votre ligne de commande. La CLI l'utilise pour télécharger des actifs lorsqu'ils sont référencés à l'aide d'une URL vers un référentiel git.
Installez le module cordova à l' aide de l'utilitaire npm de Node.js. Le module cordova sera automatiquement téléchargé par l'utilitaire npm .
sur OS X et Linux:
$ sudo npm install -g cordova
sur Windows:
C:\>npm install -g cordova
L'indicateur -g ci-dessus indique à npm d'installer cordova globalement. Sinon, il sera installé dans le sous-répertoire node_modules du répertoire de travail en cours.
Après l'installation, vous devriez être capable d'exécuter cordova sur la ligne de commande sans arguments et cela devrait imprimer du texte d'aide.
Créer une application
Préliminaire
Installez les outils cli de Cordova, si vous ne l’avez pas déjà fait.
$ npm install -g cordova
Accédez au dossier de travail de votre choix.
$ cd /path/to/coding/folder
Créer l'application
Créer une nouvelle application
$ cordova create <appProjectName> <appNameSpace> <appName>
Pour cet exemple, nous allons créer une application "HelloWorld":
$ cordova create helloWorld com.example.helloworld HelloWorld
Ajout de plates-formes et de plugins
Plates-formes
Tout d'abord, accédez au dossier de l'application.
$ cd <appName>
Ajoutez les plates-formes pour lesquelles vous souhaitez construire. La liste des plates-formes prises en charge peut être trouvée ici .
$ cordova platform add <platformList>
Nous allons ajouter la plate-forme Android, iOS et le navigateur. Utilisez la séparation d'espace pour ajouter plusieurs plates-formes à la fois. La plate-forme de browser
sera utile pour les tests dans le navigateur.
L'utilisation de l'argument --save
permet d'enregistrer la liste de plates-formes dans le fichier config.xml
de Cordova.
$ cordova platform add android ios browser --save
Une liste complète des options concernant la commande de platform
- platform
se trouve dans la documentation de cordova .
Plugins
Les plug-ins Cordova peuvent vous donner accès au matériel de l'appareil, aux fonctions spécifiques du système d'exploitation et à bien d'autres fonctionnalités.
La structure de la commande plugin
est la même que celle des plates-formes
$ cordova plugin add <plugins.value>
Nous allons ajouter le plug-in de fichier cordova (pour un accès facile au stockage de l'appareil) et le plug-in de caméra, qui donne accès à la caméra de l'appareil pour créer des photos et des vidéos.
$ cordova plugin add cordova-plugin-file cordova-plugin-camera --save
Rappelez - vous : l'utilisation de l'argument
--save
écrit vos paramètres dans le fichierconfig.xml
. Très utile pour recréer facilement le projet sur une autre machine.
Cordova a une excellente configuration de page de recherche de plugin pour votre commodité. Vous pouvez le trouver ici .
Exécuter votre application
L'exécution de l'application est assez simple. Utilisez simplement la commande suivante.
$ cordova run <platform name>
Pour notre exemple, nous allons exécuter notre application de test dans le navigateur.
$ cordova run browser
Cela ouvre votre navigateur par défaut avec votre application prête pour le test.
Installez Cordova sur Windows
Tout d'abord, installez Java SE Development Kit
Cela peut être aussi simple que de télécharger, de double-cliquer sur le fichier téléchargé et de suivre les instructions d'installation. Pour installer Java SE Development Kit, téléchargez-le à partir du site Web officiel. Kit de développement Java SE. Téléchargements
Une fois l'installation du JDK terminée, vous devez ajouter une nouvelle variable système JAVA_HOME
avec le chemin d'accès à votre JDK.
À côté de la variable système PATH
, ajoutez un chemin vers bin dirrectory de JDK
Maintenant, vous pouvez tester l'installation. Ouvrir l'invite de commande et utiliser la commande
javac -version
Si vous voyez un numéro de version, vous avez tout fait correctement!
Maintenant, installez les outils Android SDK avec Android Studio
J'ai recommandé d'installer Android Studio car pour le moment c'est le meilleur moyen d'installer rapidement et facilement toutes les choses nécessaires pour le développement Android. La liste des choses comprend:
- Kit de développement Android (SDK Android, Gestionnaire de SDK Android, Outils de plate-forme SDK Android, Outils de création de SDK Android)
- Émulateur Android avec un grand nombre de configurations Android
- IDE (pour le développement Android sur Java)
- Gradle
- Ce serait très utile si vous apprenez Java et que, dans le futur, vous voulez commencer à développer pour Android sur Java
Alors, téléchargez Android Studio depuis le site officiel developer.android.com
L'installation d'Android Studio est très simple et il vous suffit de suivre les instructions. Mais vous devriez prendre note de l'emplacement d'installation du SDK Android
Une fois l'installation d'Android Studio terminée, vous devez ajouter une nouvelle variable système ANDROID_HOME
avec le chemin d'accès à votre Android SDK
Vous devez maintenant ajouter les outils Android SDK et Android SDK à la variable système PATH. Dans la liste Variables utilisateur, sélectionnez PATH et cliquez sur le bouton Modifier. A la fin du champ Valeur de la variable, ajoutez un point-virgule et suivez les chemins:
C:\Users\User\AppData\Local\Android\sdk;C:\Users\User\AppData\Local\Android\sdk\tools;C:\Users\User\AppData\Local\Android\sdk\platform-tools;
Maintenant, vous pouvez tester l'installation. Ouvrir l'invite de commande et utiliser la commande
adb version
Cela devrait afficher la version du pont de débogage Android. Si vous voyez un numéro de version, vous avez tout fait correctement!
Maintenant, ouvrez de nouveau l'invite de commandes et utilisez la commande
android
pour ouvrir Android SDK Manager
Dans le gestionnaire de SDK Android, sélectionnez pour installer
- Outils du SDK Android
- Outils de plate-forme SDK Android
- Outils de création de SDK Android
- Outils de création de SDK Android
- Android 6.0 (API 23)
- Android 5.1.1 (API 22)
- Android 5.0.1 (API 21)
- Android 4.2.2 (API 17)
- Outils de débogage GPU
- Référentiel de support Android
- Bibliothèque de support Android
- Services Google Play
- Google Repository
- Pilote USB Google
- Intel x86 Emulator Accelerator (programme d'installation HAXM)
et cliquez sur le bouton Installer.
Remarque:
Niveaux d'API pris en charge par Cordova Android
Comprendre les niveaux d'API Android
Plate-forme Android / API Version Distribution
Installer Cordova
Ouvrez l'invite de commandes et installez Cordova en utilisant la commande
npm install -g cordova
Des versions
Dernière version de Cordova:
Cordova 6.1.0 - https://cordova.apache.org/news/2016/03/23/tools-release.html Cordova 6.0.0 - https://cordova.apache.org/news/2016/01/28 /tools-release.html
Dernière plateforme Android et plate-forme iOS
Cordova Android 5.2.2 - https://cordova.apache.org/announcements/2016/07/02/android-5.2.0.html Cordova iOS 4.2.1 - https://cordova.apache.org/announcements/2016 /07/11/cordova-android-5.2.1.html