Cours React Native

Leçon 1 • Outils de Développement et Bases du Débogage

Présente le débogueur React Native, Flipper et le menu développeur intégré à l'application. Donne aux étudiants des outils de retour immédiat sur lesquels ils compteront tout au long du cours.

Leçon 2 • Qu'est-ce que React Native

Couvre le rôle de React Native dans le développement mobile multiplateforme et en quoi il diffère de React pour le web. Établit la base conceptuelle pour tous les chapitres suivants.

Leçon 3 • Création de Votre Premier Projet

Utilise la CLI React Native et Expo pour échafauder une nouvelle application et explorer la structure de fichiers générée. Relie la connaissance des outils à la création pratique de projet.

Leçon 4 • Configuration de l'Environnement de Développement

Installe et configure tous les outils requis pour le développement iOS et Android. Assure que chaque étudiant dispose d'un environnement local reproductible et fonctionnel.

Leçon 1 • Composants Texte, Vue et Image

Couvre les trois composants React Native les plus fondamentaux et leurs propriétés essentielles. Les étudiants construisent des mises en page statiques combinant du texte, des conteneurs et des images.

Leçon 2 • Composants de Saisie et de Formulaire

Couvre TextInput, Switch et Picker pour capturer la saisie utilisateur. Établit les connaissances des composants nécessaires avant d'introduire la gestion d'état.

Leçon 3 • Fondamentaux de JSX dans React Native

Explique la syntaxe JSX, l'intégration d'expressions et comment JSX se compile en appels d'interface utilisateur natifs. Fournit la base syntaxique pour tout le travail sur les composants à venir.

Leçon 4 • Composants Touchable et Pressable

Introduit les composants de gestion tactile et leurs comportements de retour. Relie les mises en page statiques aux éléments interactifs que les étudiants utiliseront dans chaque application.

Leçon 1 • API StyleSheet et Styles en Ligne

Compare StyleSheet.create avec les objets de style en ligne et explique les implications de performance. Établit des motifs de style cohérents utilisés tout au long du cours.

Leçon 2 • Modèle de Mise en Page Flexbox

Explique en quoi le modèle Flexbox de React Native diffère du CSS et comment contrôler l'alignement des axes. Les étudiants acquièrent la compétence de mise en page centrale utilisée dans chaque écran.

Leçon 3 • Thème et Motifs de Style Réutilisables

Introduit les objets de thème, les constantes de style et l'encapsulation du style au niveau du composant. Prépare les étudiants à maintenir des systèmes de conception cohérents dans de grandes applications.

Leçon 4 • Espacement, Bordures et Ombres

Applique les propriétés de marge, remplissage, bordure et ombre pour affiner la hiérarchie visuelle. Relie les connaissances en mise en page à l'apparence soignée et de qualité production des composants.

Leçon 1 • useState pour l'État Local

Introduit le hook useState pour gérer l'état au niveau du composant et déclencher les nouveaux rendus. Permet aux étudiants de construire des éléments d'interface utilisateur interactifs et avec état.

Leçon 2 • useEffect et Effets Secondaires

Couvre useEffect pour la récupération de données, les abonnements et le nettoyage au démontage. Relie les concepts de cycle de vie des composants aux opérations asynchrones pratiques.

Leçon 3 • Motifs de Composants et Bonnes Pratiques

Couvre les composants conteneur vs. présentational, la mémorisation et l'évitement des rendus inutiles. Prépare les étudiants à écrire des arbres de composants performants et maintenables.

Leçon 4 • Propriétés et Communication entre Composants

Explique comment les propriétés transmettent des données et des rappels entre les composants parents et enfants. Établit le modèle de flux de données unidirectionnel central dans les applications React Native.

Leçon 1 • Navigateur de Pile pour les Flux d'Écrans

Construit des flux d'écrans push-and-pop en utilisant le navigateur de pile natif. Couvre le motif de navigation le plus courant dans les applications mobiles.

Leçon 2 • Navigateurs par Onglets et Tiroir

Ajoute des navigateurs par onglets en bas et par tiroir latéral pour les sections principales de l'application. Permet aux étudiants de construire les coques de navigation principales utilisées dans la plupart des applications.

Leçon 3 • Flux d'Authentification et Routes Protégées

Implémente la navigation conditionnelle basée sur l'état d'authentification en utilisant le changement de navigateur. Prépare les étudiants à construire une navigation d'application sécurisée et consciente des rôles.

Leçon 4 • Configuration et Concepts de React Navigation

Installe React Navigation et explique le modèle de navigateur, d'écran et de route. Fournit la carte conceptuelle dont les étudiants ont besoin avant de construire un flux de navigation.

Leçon 1 • API Fetch et Motifs Async

Utilise l'API Fetch intégrée avec async/await pour effectuer des requêtes HTTP depuis React Native. Établit le modèle de récupération de données asynchrone utilisé dans toutes les sections suivantes.

Leçon 2 • React Query pour l'État Serveur

Utilise React Query pour mettre en cache, actualiser et synchroniser automatiquement les données du serveur. Réduit le code passe-partout et améliore la fraîcheur des données dans l'application.

Leçon 3 • Axios pour les Requêtes HTTP

Introduit Axios pour une syntaxe de requête plus propre, des intercepteurs et la configuration d'une URL de base. Fait progresser les étudiants vers le client HTTP le plus utilisé dans les applications React Native de production.

Leçon 4 • Stockage Local avec AsyncStorage

Persiste les données clé-valeur localement en utilisant AsyncStorage pour des fonctionnalités hors ligne en premier. Prépare les étudiants à stocker des jetons, des préférences et des réponses mises en cache sur l'appareil.

Leçon 1 • Caméra et Sélecteur d'Images

Capture des photos et sélectionne des images depuis la galerie en utilisant react-native-image-picker. Permet aux étudiants de construire des fonctionnalités riches en médias courantes dans les applications sociales et utilitaires.

Leçon 2 • Gestion des Permissions

Demande et vérifie les permissions d'exécution pour les fonctionnalités sensibles de l'appareil sur iOS et Android. Établit le modèle de permission requis avant d'accéder à une API native.

Leçon 3 • Géolocalisation et Cartes

Récupère la localisation de l'appareil et rend des cartes interactives en utilisant react-native-maps. Relie les données de localisation aux expériences cartographiques visuelles que les étudiants peuvent livrer dans des applications réelles.

Leçon 4 • Notifications Push

Configure les notifications push locales et distantes en utilisant Expo Notifications ou Firebase. Enseigne le cycle de vie complet des notifications, de la planification à l'interaction utilisateur.

Leçon 1 • Tests Unitaires et d'Intégration

Écrit des tests de composants et de hooks en utilisant Jest et React Native Testing Library. Établit une base de test qui détecte les régressions avant le déploiement.

Leçon 2 • Construction et Publication sur les Magasins d'Applications

Génère des builds signés pour Android et iOS et les soumet à leurs magasins respectifs. Complète le cycle de vie complet du développement à la production pour les étudiants.

Leçon 3 • Profilage et Optimisation des Performances

Utilise Flipper et le Moniteur de Performances pour identifier les goulots d'étranglement du thread JS et du rendu. Équipe les étudiants pour diagnostiquer et corriger les problèmes de performance les plus courants de React Native.

Leçon 4 • Tests de Bout en Bout avec Detox

Automatise les flux utilisateur complets sur les simulateurs et les appareils en utilisant Detox. Valide les chemins critiques tels que la connexion et le paiement avant chaque publication.