Ionic : développez des applications mobiles multiplateformes avec Cordova et AngularJS

Auteur(s) :

Millauriaux, Cédric Découvrir l'auteur

Résumé

Un ouvrage d'autoformation destiné à tirer parti de ses connaissances afin d'apprendre à développer des applications mobiles par le biais de Ionic, une technologie dépendante de Cordova et d'AngularJS. ©Electre 2017

Éditeur(s)
- ENI
Date
- cop. 2017
Notes
- La couv. porte en plus : Fichiers complémentaires à télécharger" ; "Informatique technique"
- La 4ème de couv. : Sur www.editions-eni.fr : le code de l'application développée tout au long des chapitres"
- Contient un "flashcode" permettant d'accéder à un contenu via Internet
Langues
- Français
Description matérielle
- 1 vol. (446 p.) : ill.; ; 21 cm
Collections
- Epsilon
Sujet(s)
ISBN
- 978-2-409-00633-3
Indice
- 681.230 Langages de script
Quatrième de couverture
- Ionic
  Développez des applications mobiles multiplateformes avec Cordova et AngularJS
  Ce livre s'adresse aux développeurs web qui souhaitent mettre à profit leurs connaissances pour développer des applications mobiles à l'aide de Ionic, une technologie tirant parti de Cordova et d'AngularJS, pour créer des applications Android, iOS et Windows Phone.
  L'auteur propose un premier tour d'horizon des technologies de développement multiplateformes (leur architecture, leur relation avec le système natif, leurs forces et leurs faiblesses), avant de plonger dans la manipulation des différents outils qui permettent de construire rapidement et simplement une première application mobile.
  L'ensemble des composants CSS et JavaScript seront passés en revue avant de poser les bases d'une architecture modulaire et de s'intéresser aux bonnes pratiques qui permettent de développer une application performante, à l'ergonomie adaptée à la manipulation sur mobile. Afin d'étendre les possibilités de l'application, des plugins seront présentés, permettant de localiser l'utilisateur à l'aide du GPS, de prendre des photos ou encore d'envoyer des notifications push.
  Le lecteur apprendra également à manipuler des composants complexes comme un système d'onglets, des éléments responsive destinés à adapter l'affichage sur tablette et à capturer les gestes de l'utilisateur pour dévoiler de nouvelles options dans l'application.
  Un projet de développement est lancé dès le début du livre. Il est enrichi au fur et à mesure des chapitres et propose au lecteur un apprentissage de Ionic par la pratique. À la fin du livre, le lecteur aura donc développé une application qui communique avec une API REST disponible sur Internet pour rechercher des films et afficher leurs caractéristiques. L'application finale est entièrement fonctionnelle, tire pleinement parti de Ionic et Cordova et est prête à être déployée sur les stores.
Tables des matières
- - Ionic
  - Développez des applications mobiles multiplateformes avec Cordova et AngularJS
  - Avant-propos
  - 1. Le marché des applications mobiles13
  - 2. Pourquoi développer une application mobile aujourd'hui ?14
  - 3. À qui s'adresse cet ouvrage ?15
  - 4. Approche de cet ouvrage15
  - 5. Le projet fil rouge16
  - 6. Remerciements16
  - Chapitre 1
  - Applications mobiles multiplateformes
  - 1. Qu'est-ce qu'une application mobile multiplateforme ?17
  - 2. Pourquoi utiliser une technologie multiplateforme ?20
  - 2.1 Avantages du développement multiplateforme20
  - 2.2 Types de technologies21
  - 2.2.1 webview22
  - 2.2.2 Métalangages23
  - 2.2.3 OpenGL ES 24
  - 2.2.4 Hybride25
  - 3. Différences fondamentales entre développement natif et multiplateforme26
  - Chapitre 2
  - Architecture multiplateforme
  - 1. Architecture multiplateforme webview29
  - 1.1 Principe de base29
  - 1.2 Navigateur web intégré30
  - 1.3 Système de plugins31
  - 1.4 Packaging33
  - 2. Ionic et le choix d'AngularJS34
  - 3. Architecture AngularJS36
  - 3.1 AngularJS et MVC36
  - 3.2 Application AngularJS37
  - Chapitre 3
  - Découverte de Cordova
  - 1. Présentation de Cordova39
  - 2. Installation de Cordova41
  - 2.1 Installation de NodeJS41
  - 2.2 Installation de GIT42
  - 2.3 Installation de Cordova42
  - 3. Commandes usuelles43
  - 3.1 Créer un projet44
  - 3.2 Ajouter une plateforme44
  - 3.3 Démarrer le serveur web46
  - 3.4 Démarrer l'application sur une plateforme native48
  - 3.5 Nettoyer le projet48
  - 4. Déployer sur Android49
  - 4.1 Installation de Java49
  - 4.1.1 Mise à jour des variables d'environnement Windows49
  - 4.1.2 Mise à jour des variables d'environnement Linux et OSX50
  - 4.2 Installation du SDK Android51
  - 4.2.1 Mise à jour des variables d'environnement Windows51
  - 4.2.2 Mise à jour des variables d'environnement Linux et OSX52
  - 4.2.3 Installation des packages Android52
  - 4.3 Ajout d'un émulateur54
  - 4.4 Ajout de la plateforme55
  - 4.5 Lancement de l'application56
  - 5. Déployer sur iOS56
  - 5.1 Installation de Xcode57
  - 5.2 Ajout de la plateforme57
  - 5.3 Ouverture du projet dans Xcode57
  - 5.4 Création des certificats58
  - 5.5 Compilation de l'application58
  - 5.6 Lancement de l'application59
  - 6. Déployer sur Windows61
  - 6.1 Installation de Visual Studio61
  - 6.2 Ajout de la plateforme63
  - 6.3 Lancement de l'application depuis la ligne de commande63
  - 6.3.1 Lancement d'une application de bureau63
  - 6.3.2 Lancement d'une application smartphone63
  - 6.4 Lancement de l'application depuis Visual Studio64
  - Chapitre 4
  - Découverte de Ionic
  - 1. Présentation de Ionic67
  - 2. Comparaison de Ionic et de ses challengers69
  - 2.1 Onsen69
  - 2.2 Intel XDK70
  - 2.3 Mobile Angular UI70
  - 2.4 TouchstoneJS71
  - 2.5 Frameworks commerciaux71
  - 2.6 Frameworks n'utilisant pas Cordova71
  - 2.7 Ionic, le choix du roi ?71
  - 3. Installation de Ionic72
  - 3.1 Prérequis72
  - 3.2 Installation de la ligne de commande72
  - 4. Apports de Ionic à Cordova73
  - 4.1 Création du projet74
  - 4.2 Exécution de l'application sur un serveur web74
  - 4.3 Rechargement en temps réel : le livereload75
  - 4.4 Gestion des plugins76
  - 4.5 Gestion de la configuration76
  - 4.5.1 Sauvegarde de la configuration77
  - 4.5.2 Restauration de la configuration78
  - 4.5.3 Remise à zéro de la configuration78
  - 4.6 Ionic Cloud79
  - 4.7 Commandes diverses79
  - Chapitre 5
  - Mise en place de l'application
  - 1. Initialisation du projet81
  - 1.1 Création de l'application81
  - 1.2 Arborescence du projet83
  - 1.2.1 Répertoire hooks83
  - 1.2.2 Répertoire platform83
  - 1.2.3 Répertoire plugins84
  - 1.2.4 Répertoire resources84
  - 1.2.5 Répertoire SCSS85
  - 1.2.6 Répertoire www85
  - 1.2.7 Fichiers divers86
  - 1.3 Environnement de développement87
  - 2. Découverte du projet par défaut88
  - 2.1 Fichier index.html89
  - 2.1.1 Section Head89
  - 2.1.2 Section Body90
  - 2.2 Fichier app.js91
  - 3. Création du premier couple contrôleur/service93
  - 3.1 Création du contrôleur93
  - 3.2 Création du service97
  - 3.3 Injection de dépendances99
  - 3.4 Affichage d'une liste101
  - 4. Vues105
  - 4.1 Installation de ui-router106
  - 4.2 Création d'une vue107
  - 4.3 Injection de la vue dans la page principale107
  - 5. Routes108
  - 5.1 Création d'une route108
  - 5.2 Choix d'une route par défaut109
  - 5.3 Navigation entre les routes110
  - 5.3.1 Création d'une deuxième route110
  - 5.3.2 Récupération de paramètres dans le contrôleur113
  - 5.3.3 Redirection avec un lien HTML113
  - 5.3.4 Redirection avec la directive ui-sref114
  - 5.3.5 Redirection depuis le contrôleur116
  - Chapitre 6
  - Habiller l'application
  - 1. Aperçu des composants CSS119
  - 1.1 Header120
  - 1.1.1 Ajout d'un header120
  - 1.1.2 Utilisation de la directive ion-header-bar121
  - 1.1.3 Choix de la couleur122
  - 1.1.4 Ajouter des boutons122
  - 1.1.5 Sous-header124
  - 1.2 Footer124
  - 1.3 Boutons126
  - 1.3.1 Utilisation d'un bouton127
  - 1.3.2 Taille des boutons127
  - 1.3.3 Largeur des boutons129
  - 1.3.4 Liens et boutons détourés130
  - 1.3.5 Groupe de boutons131
  - 1.3.6 Icônes132
  - 1.4 Listes135
  - 1.4.1 Liste simple135
  - 1.4.2 Séparateur137
  - 1.4.3 Icônes138
  - 1.4.4 Boutons140
  - 1.4.5 Images142
  - 1.5 Carte143
  - 1.5.1 Déclaration d'une carte144
  - 1.5.2 Titre et séparateur147
  - 1.5.3 Image148
  - 1.5.4 Contenu149
  - 1.5.5 Liste151
  - 1.6 Formulaires151
  - 1.6.1 Formulaire simple152
  - 1.6.2 Champs de saisie153
  - 1.6.3 Mise en forme155
  - 1.6.4 Combinaison de champs159
  - 1.6.5 Saisie HTML5160
  - 1.6.6 Case à cocher163
  - 1.6.7 Switch164
  - 1.6.8 Boutons radio166
  - 1.6.9 Liste déroulante168
  - 1.6.10 Slider170
  - 2. Grille et responsive design171
  - 2.1 Grille simple172
  - 2.2 Taille de colonne imposée174
  - 2.3 Espacement entre colonnes175
  - 2.4 Alignement vertical176
  - 2.5 Grille responsive176
  - 3. Aperçu des composants JS179
  - 3.1 Vue principale et scroll179
  - 3.2 Animation de chargement182
  - 3.3 Animation de chargement et blocage des actions utilisateur185
  - 3.4 Rafraîchissement de l'écran188
  - 3.5 Modale191
  - 3.6 Pop-up196
  - 3.6.1 Alerte197
  - 3.6.2 Saisie utilisateur199
  - 3.7 Listes201
  - 3.7.1 Options201
  - 3.7.2 Bouton de suppression203
  - 3.7.3 Ordonner la liste205
  - 3.8 Clavier207
  - 3.9 Carrousel208
  - 3.10 Zone de défilement213
  - 4. Navigation219
  - 4.1 Vues219
  - 4.2 Menu latéral230
  - 4.3 Onglets234
  - 5. Configuration générale242
  - 5.1 Cache243
  - 5.2 Navigation243
  - 5.2.1 Barre de navigation243
  - 5.3 Formulaires245
  - 5.4 Onglets246
  - 5.5 Vues247
  - 6. Gestes248
  - 6.1 Directives gestuelles248
  - 6.2 Service gestuel252
  - Chapitre 7
  - Communiquer avec un serveur
  - 1. Présentation de l'architecture REST253
  - 1.1 Protocole HTTP253
  - 1.2 Architecture REST256
  - 2. Création d'un service de communication HTTP258
  - 2.1 Service $http258
  - 2.2 Traitement du retour260
  - 3. Promesses et appels asynchrones262
  - 3.1 Appels asynchrones et callback262
  - 3.2 Promesses263
  - 3.2.1 Création d'une promesse264
  - 3.2.2 Retour de résultat265
  - 3.2.3 Utilisation du retour266
  - 3.2.4 Avantage des promesses266
  - 4. Échanges avec l'API OMDb268
  - 4.1 OMDb API268
  - 4.1.1 Recherche d'une liste de films268
  - 4.1.2 Détails d'un film277
  - 5. Utilisation du scroll infini282
  - Chapitre 8
  - Développement générique
  - 1. Pourquoi développer des composants génériques287
  - 2. Modules288
  - 2.1 Présentation du principe des modules289
  - 2.2 Application de l'architecture modulaire292
  - 2.2.1 Module starter292
  - 2.2.2 Création du module films294
  - 3. Directives297
  - 3.1 Concept297
  - 3.2 Création d'une directive297
  - 3.2.1 Types de directives298
  - 3.2.2 Passage de paramètres300
  - 3.2.3 Renvoi d'un template301
  - 3.2.4 Contrôleur interne302
  - 3.2.5 Manipulation de l'élément parent303
  - 3.3 Mise en application : la directive film304
  - 3.3.1 Création de la directive304
  - 3.3.2 Implémentation du contrôleur305
  - 3.3.3 Adaptation du template306
  - 3.3.4 Injection de la directive306
  - 3.3.5 Spécialisation de la directive307
  - 4. Filtres312
  - 4.1 Filtre simple312
  - 4.1.1 Utilisation de filtres312
  - 4.1.2 Mise en place d'un filtre313
  - 4.2 Filtre personnalisé315
  - 4.2.1 Déclarer un filtre315
  - 4.2.2 Implémenter un filtre315
  - 4.2.3 Implémenter un tri316
  - 5. Fichier de configuration et constantes316
  - Chapitre 9
  - S'adapter à la plateforme
  - 1. Pourquoi décliner l'interface pour une plateforme ?319
  - 2. Ionic et l'adaptation à la plateforme320
  - 2.1 Marqueurs de la plateforme320
  - 2.1.1 Spécifications de la plateforme dans la vue320
  - 2.1.2 Spécifications de la plateforme dans le code JS322
  - 2.1.3 Routage en fonction de la plateforme324
  - 2.1.4 Autres fonctionnalités de la classe platform325
  - 2.2 Événements système327
  - 3. Adaptations pour Android329
  - 3.1 Rappel des adaptations natives329
  - 3.2 Bouton retour330
  - 4. Adaptations pour iOS333
  - 5. Fichier config.xml335
  - 5.1 Structure du fichier config.xml336
  - 5.2 Informations sur l'application336
  - 5.3 Page de démarrage337
  - 5.4 Restriction des requêtes multidomaines337
  - 5.5 Préférences générales338
  - 5.6 Plateformes338
  - 5.7 Plugins339
  - Chapitre 10
  - Plugins
  - 1. Tirer parti des capacités des smartphones341
  - 2. Fonctionnement du système de plugins343
  - 2.1 Rappels sur l'architecture des plugins343
  - 2.2 Rechercher un plugin344
  - 2.3 Installer un plugin345
  - 2.4 Désinstaller un plugin347
  - 3. Social : partager sur les réseaux sociaux347
  - 4. Camera : prendre des photos353
  - 5. Geolocation : géolocaliser l'utilisateur363
  - 6. LocalStorage : stocker des données369
  - 7. NgCordova : utiliser les plugins à la manière d'AngularJS374
  - Chapitre 11
  - Ionic et performances
  - 1. Performances de Ionic et AngularJS sur mobile377
  - 2. Conseils pratiques pour optimiser les performances379
  - 2.1 Généralités379
  - 2.1.1 Appels asynchrones et promesses379
  - 2.1.2 Librairies381
  - 2.1.3 Animations381
  - 2.1.4 Manipulation du DOM383
  - 2.1.5 Taille et poids des images384
  - 2.1.6 Privilégier les maps385
  - 2.1.7 Minification JS et CSS386
  - 2.1.8 Les outils de diagnostic386
  - 2.2 AngularJS388
  - 2.2.1 Binding unique388
  - 2.2.2 Identifiant d'itération389
  - 2.2.3 ng-if vs ng-show390
  - 2.2.4 Enchaînement de filtres390
  - 2.2.5 Mode débogage390
  - 2.2.6 Pour aller plus loin391
  - 2.3 Ionic391
  - 2.3.1 Scroll natif391
  - 2.3.2 Collection repeat392
  - 2.3.3 Infinite scroll392
  - 2.3.4 Cache393
  - 2.3.5 Manipulation du DOM pendant les transitions393
  - 2.3.6 Crosswalk394
  - Chapitre 12
  - Publier son application
  - 1. Préparer son application397
  - 1.1 Préparation logicielle397
  - 1.2 Génération des icônes398
  - 1.3 Génération du splash screen399
  - 2. Publication sur Google Play Store401
  - 3. Publication sur Itunes406
  - 4. Mettre à jour l'application412
  - Chapitre 13
  - Pour aller plus loin
  - 1. Enrichir l'application413
  - 2. Ionic.io414
  - 2.1 Ionic Cloud414
  - 2.2 Ionic Creator420
  - 2.3 Ionic View421
  - 3. Ionic 2421
  - 3.1 Différences avec Ionic 1422
  - 3.2 Essayer Ionic 2425
  - 3.2.1 Création du projet426
  - 3.2.2 Analyse du projet426
  - 3.2.3 Mettre en place les premiers composants427
  - 3.2.4 Ajouter une deuxième page429
  - 3.2.5 Documentation et tutoriels433
  - Index435
Origine de la notice:
- Electre