Formation React Native

Introduction à la formation React Native

Tour d’horizon du développement mobile
Les principaux outils et frameworks pour développer en multiplateformes (Cordova, Ionic, NativeScript…)
Vue d’ensemble de React Native : son historique et son positionnement
L’architecture React Native et les concepts fondamentaux
L’ECMAScript 6, 7 et 8,
Le moteur Babel
La syntaxe JSX
Comment « penser React » ?
Installation et configuration de React Native
Travaux pratiques possibles : Installer l’environnement de développement, créer sa première application React Native et prendre en main le debugging. Manipuler les nouveautés ES6, ES7 et ES8.

Apprenez les bases du framework avec notre formation React Native

Les composants basiques en React Native : View, Text, Image…
Le Cycle de vie des composants React
Création d’un composant
Utilisation des props et des states pour la configuration d’un composant
Les différences entre props et states
Travaux pratiques possibles : Démarrer un projet sous Create-React-Native-App. Créer et configurer des composants.

La mise en page en React Native avec Flexbox

Déclaration de styles
Utilisation des styles
L’API Stylesheet
Les méthodes d’utilisation de l’API, ses propriétés
Contrôle des dimensions des composants à l’écran
Application de styles particuliers à un composant
Combinaison, organisation et partage de styles
Introduction à Flexbox, différences avec CSS sur le web
Contrôle de la disposition d’éléments avec Flexbox
Bien utiliser flexDirection, justifyContent et alignItems
Travaux pratiques possibles : Manipulation des styles, découverte des bonnes pratiques, utilisation des différentes propriétés et valeurs de Flexbox.

Architecture : Flux et Redux

Présentation du MVC (Model-View-Controller)
Présentation de l’architecture d’une application Flux
Intérêts de Flux
La librairie JavaScript Redux : actions, reducer(s), store
Installation et implémentation de Redux
Présentation de MobX
Travaux pratiques possibles : Introduction à de Flux et Redux pour la gestion des états d’une application.

Construire une application React Native

Gestion des entrées textuelles de l’utilisateur
Travail avec Touch et le Gesture Responder System
Utilisation de composants FlatList, SectionList et ScrollView
Définition d’une hiérarchie de composants
Organisation de répertoire pour la structure d’un projet
Utilisation de composants développés communautairement : les chercher et les appliquer
Travaux pratiques possibles pendant la formation React Native : Développer une application React Native à l’aide de composants natifs et tiers, Manier Awesome React Native.

Navigation et animations

Tour d’horizon des solutions de gestion de la navigation
Introduction à React Navigation
Navigation entre plusieurs écrans d’une application
Gestion de la hiérarchie de routes
Gestion d’historique de navigation
Le composant NavigatorIOS
Naviguer : les options avancées
Les APIs Animated et LayoutAnimation
Création d’animation, configuration
Animation d’éléments depuis une interaction tactile à l’aide de PanResponder
Travaux pratiques possibles : Utiliser React-Navigation pour intégrer un deuxième écran dans uen application, ajouter des animations, ajouter des transitions personnalisées.

Les Formulaires et la gestion des données

Création des composants principaux d’un formulaire
Définition d’une logique de validation
Gestion des erreurs
Redux-form et les solutions similaires (tcomb-form-native, react-reactive-form)
Récupération de données à l’aide de XMLHttpRequest ou Fetch API
Stocker ses données offline et AsyncStorage pour la persistance des données
Les autres outils disponibles sur le marché (realm, graphQL…)
Utilisation de Redux pour améliorer la gestion des données
Travaux pratiques possibles lors de notre formation React Native : Développer un formulaire sur une application, y intégrer des fonctionnalités de récupération de données, intégrer une API REST, mettre en place une persistance de données.

Les principaux API et modules natifs sous React Native

Particularités d’iOS et d’Android
L’API Geolocation pour obtenir la localisation d’un utilisateur
Utiliser CameraRoll pour accéder aux photos et à la caméra du mobile
Gestion des permissions
Développement ou réutilisation d’un module natif
Travaux pratiques possibles : Mettre à jour une application à l’aide d’APIs natives, intégrer un module natif développé par la communauté.

Concepts avancés…

Optimisation des performances d’une application
Réaliser des tests unitaires, des tests fonctionnels
Déployer des mises à jour à distance (Over the Air), et utilisé le CodePush pour le déploiement continu
Publication d’une application React Native sur les stores
Les erreurs de développement à éviter
Les bonnes pratiques d’utilisation de React Native
Ressources additionnelles
Fin de la formation React Native