React Native Pour Tous - L'Ultime Formation 2022 | 73 Heures

La formation en Français qui vous permet véritablement de maîtriser React Native (Formation PREMIUM Sans Promotions)

What you'll learn
Coder des applications "Mobile Native" avec du code JavaScript et la librairie React JS.
Développer des applications Mobiles "cross-platform" (iOS & Android) sans connaître ni Swift, ni ObjectiveC et ni Java, ni Kotlin! Uniquement JavaScript!
Maîtriser la librairie React Native et être en mesure d'intervenir sur les vrais projets en entreprise.
Apprendre React Native avec les Hooks de React JS.
Styliser les applications React Native et les rendre professionnelles.
Apprendre à gérer le state d'une application React Native via Redux.
Apprendre à installer et à utiliser les outils nécessaires pour coder les applications React Native et les tester sur un simulateur ou un appareil Android/iOS.
Découvrir les outils et les moyens permettant de débogguer une application React Native comme un véritable PRO!
Apprendre à travailler avec Expo-Cli pour vous faciliter le codage de vos applications. En effet, pourquoi réinventer la roue si quelqu'un l'a déjà créée ?
Apprendre à utiliser la mémoire intégrée dans les appareils iOS et Android pour y stocker des données.
Apprendre à effectuer des requêtes HTTP et le code asynchrone dans une application React Native.
Apprendre à intégrer Firebase dans une application React Native (Authentification utilisateur et base de données)
Créer des application avec React Native CLI (sans passer par Expo)
Combiner la facilité Expo avec React Native CLI grâce au Bare Workflow
Comment créer une application Expo et faire le Eject pour passer en mode BareWorkflow
Apprendre à gérer la navigation dans React Native (Menu en mode stack, menu latéral, et onglets) et bien plus encore..
Apprendre à gérer l'interface adaptative de vos applications afin de les adapter aux différentes tailles d'écrans.
Générer le build d'une app Expo via EAS Build et la tester sur le simulateurs iOS et l'émulateur Android.
Accès gratuit à une formation React avec les Hooks pour mieux maîtriser cette librairie sur laquelle est basé React Native.
Apprendre à coder des applications mobiles avec React Hooks
Maîtriser la création de composants partageables et stylisés en Flexbox
Apprendre à gérer le state d'une application React native via Redux
Apprendre à travailler avec firebase dans une application React Native
Réalisation de plusieurs exercices simples et accessibles à tous les niveaux.
Maîtriser React Native, React JS, Redux, FlexBox das une seule formation et bien plus encore !
Maîtriser React Router versions 5 et 6 !
Requirements
Connaissances de bases en Javascript (ES6)
Connaissances de bases en React JS (En cas de besoin, vous trouverez plusieurs vidéos sur les concepts de REACT + HOOKS à la fin de cette formation)
Connaissances de bases en CSS FlexBox (En cas de besoin, vous trouverez plusieurs vidéos sur les concepts du CSS FlexBox à la fin de cette formation)
Connaissances de bases en Redux (En cas de besoin, vous trouverez plusieurs vidéos sur les concepts de Redux à la fin de cette formation)
Un ordinateur (Windows/Linux/Mac) pas trop vieux ;-)
Description
Bienvenue les ami(e)s dans cette nouvelle formation REACT NATIVE POUR TOUS -  L'Ultime Formation 2021 (FR).D’abord, pour commencer, je tiens à vous féliciter car vous venez de découvrir la formation React Native la plus complète, la plus simple, et la plus didactique qui existe en français!Pour ceux qui ne me connaissent pas, je m’appelle Tahar, je suis développeur Senior, formateur, mais aussi Youtubeur. Aujourd’hui, j’ai l’honneur de vous présenter ma nouvelle formation « React Native Pour Tous – L’ultime Formation ». Si vous avez aimé mes précédentes formations sur React, Redux, TypeScript, Flexbox, vous allez aimer encore plus cette nouvelle formation. Personnellement, c’est celle dont je suis le plus fier et le plus satisfait car elle est, sans aucun doute, la meilleure formation React Native qui existe et qui existera en français!Pourquoi serait-elle la meilleure formation React Native en français ?Elle est, à mon sens, la meilleure formation React native pour plusieurs raisons :Premièrement, et contrairement à ce qui se fait régulièrement dans le milieu « DEV Francophone », j’ai décidé ici d’expliquer les différents concepts derrière React Native de la façon la plus simple et la plus organisée possible. Mon objectif étant de vous apprendre à coder des applications mobiles, je me dois donc d’être le plus clair et le plus simple possible pour que tout le monde puisse suivre sans aucun problème. Oui, je dis bien « Tout le monde ». Débutant comme expérimenté ! Je ne rejette personne dans mes formations ! Quand j’aborde un concept que je considère comme étant d’une grande importance, je n’hésite pas à me répéter ou à vous le réexpliquer de différentes façons afin de m’assurer que vous avez « tous », « sans exception », compris ce dont on parle. Pour ce faire, je m’hésite pas à expliquer les choses avec des exercices simples qui vont droit au but. Pas de bla-bla, pas d’hésitations, pas de « euh euh », pas de matraquage à coup de console.log sans réel intérêt ou de code spaghetti qui n’a pas de lien direct avec le sujet abordé.En outre, quand j’aborde un concept qui n’a pas de lien direct avec React Native, mais qui est néanmoins nécessaire à notre exercice, dans ce cas-là, je n’hésiterai pas à m’attarder dessus afin de vous l’expliquer clairement. Exemple : même si vous êtes censés avoir des notions en React JS, pour faire du React Native, je ne me permettrais jamais d’utiliser un hook comme useEffect, useLaoyoutEffect, useState ou autres sans vous les réexpliquer. C’est le rôle du formateur d’expliquer clairement ce que je fais et de ne pas supposer que c’est des notions acquises par ses élèves. Donc, afin de m’assurer que vous avez tous compris, je n’hésiterais pas à expliquer chaque bout de code dans des exercices pratiques, simples, claires et qui vont droit au but.Pour tester vos connaissances, vous aurez droit à des quiz.Tout au long de la formation, l’utilisation régulière des différentes documentations sera la norme ! On utilisera la doc React, React Native, React Navigation, Expo, Expo-Victor Icons, Redux, React-Redux, etc.Afin d’aider ceux et celles d’entre vous qui ont une mémoire visuelle, ce qui est mon cas, j’ai créé un véritable support de cours, en PDF, rempli de visuels, de diagrammes, de schémas etc. Ce support est évidemment accessible en téléchargement PDF ainsi que celui de Flex-box et de Redux.En plus des centaines d’exercices qu’on fera tout au long de cette formation, on codera ensemble, étape par étape, 5 projets ! En effet, c’est bien de faire des exercices, mais les intégrer dans une vraie application est un véritable plus et c’est ce que nous allons faire dans cette formation.Pourquoi apprendre React Native?En 2012, Mark Zuckerberg (Fondateur de Facebook) a déclaré ceci: « La plus grande erreur que nous ayons commise en tant que société a été de parier trop sur HTML5 par opposition au natif ». Il a donc promis que Facebook offrirait bientôt une meilleure expérience mobile. A présent, c’est chose faite! Après quelques mois de développement acharnés, l’équipe Facebook a enfin publié la première version de la configuration JavaScript de la librairie React JS en 2015.Depuis exactement le 26 mars 2015 (date de la première version lancée), React Native ne cesse de gagner le coeur des utilisateurs. En effet, en seulement quelques années, React Native est devenu un des frameworks incontournables dans le domaine du développement d’applications mobiles.Basé sur la librairie React JS, React Native ne cesse de s’enrichir chaque année de nouvelles innovations et de performance permettant aux développeurs de coder facilement des applications mobile, natives, que ce soit sur Android ou sur iOS et ce, tenez-vous bien, avec un seul langage le « JavaScript »!Oui, plus besoin d’apprendre un nouveau langage pour coder des applications mobiles ! Grâce à React Native, vous allez pouvoir coder des applications native pour Android et iOS avec un seul langage le JavaScript. En effet, avant l’arrivée de React Native (et même de nos jours, pour ceux qui n’utilisent pas React Native) on était obligés d’apprendre d’autres langages pour pouvoir coder son application Mobile. Exemple : pour créer une application sur iPhone (iOS) il fallait maîtriser le langage Swift ou ObjectiveC. La même chose pour les applications Android. Pour coder une application Android, il fallait maîtriser le langage Java ou Kotlin. Sans oublier toute la complexité qui va avec ces langages qui nécessitent énormément de temps d’apprentissage !Avec React Native, cette époque est définitivement révolue ! Désormais, avec un seul langage (le JavaScript), vous allez pouvoir coder une seule application et cette unique application sera compatible, à la fois « Android » et sur « IOS » ! On assiste là à une véritablement révolution dans le domaine du développement mobile, car désormais, grâce à React Native, vous allez pouvoir « faire d’une pierre, deux coups ! »Plus besoin de perdre votre temps à apprendre d’autres langages.Plus besoin de créer deux applications (une pour chaque système).Une grande facilité de travail avec à tas d’outils déjà disponibles et qui vous marchent déjà le travail.Vous pensez que React Native est compliqué ?Détrompez-vous les amis ! Il n’en est rien !!! Non seulement il n’y a rien de compliquer à coder une vraie application Mobile via React Native, mais, en plus de cette facilité, il existe un tas d’outils comme les divers outils offerts par Expo, ou même la navigation via React Navigation, entre autres, qui nous facilitent grandement le travail. Ne vous inquiétez donc surtout pas ! On verra tout cela dans les détails tout au long de cette formation.Si vous êtes motivé à apprendre React Native et devenir un véritable développeur d’applications Mobile Natives iOS et Android, vous êtes au bon moment et surtout au bon endroit !Sortez donc définitivement de votre esprit l’idée de complexité quand vous parlez de React Native. D’ailleurs, cette facilité à coder avec React Native, combinée avec la robustesse des applications « cross-platforme » est sans aucun doute ce qui a poussé même les grandes entreprises à s’orienter, de plus en plus, vers React Native. N’oublions pas le slogan de React Native: « Learn once, write everywhere ». En effet, avec React Native, on apprend une seule librairie, une seule fois, et on code pour les deux plate-forme Android et IOS en même temps.Voici quelques-unes des grandes entreprises qui ont sauté le pas pour adopter React Native:Le réseau social « Facebook », Facebook Ads Manager, Facebook Analytics, Instagram, Shopify, FlipKart, Discord, AirBnB, Skype, Bloomberg, Pinterest, Tesla, Uber Eats, Wix, Call of Duty Companion App, Artsy, adidas GLITCH, SoundCloud Pulse, le magazine vogue .. etc etcRappelez-vous de ceci: "Dans cette formation, vous allez apprendre, étape par étape, d’une manière logique et progressive les différents concepts de React Native".Nous allons d’abord commencer par les bases en découvrant les composants React Native les plus couramment utilisés comme View, Text, Button, Image etc avant d’attaquer les concepts les plus poussés comme la navigation via React navigation V4 et V5, la gestion de state dans une application React Native via la librairie Redux, comment effectuer des requêtes HTTP, le code asynchrone, les bases de données, l’authentification utilisateur (on utilisera Firebase), on verra le AsyncStorage, le SQLIte, la géo-locations, l’affichage des cartes, récupérer les photos dans la galerie du téléphone, ..etc. Nous allons étudier tout cela à la fois dans des exercices simples, mais aussi en réalisant quelques projets ensemble.À la fin de cette formation, vous seriez donc complètement autonomes sur vos projets React Native, et même capables (sur le plan technique évidemment) de décrocher un poste de développeur React Native ! En effet, connaître React Native est, de nos jours, un vrai plus qui va certainement vous ouvrir de nouvelles portes sur le marché du travail ! En outre, si vous suivez assidûment cette formation et que vous codez avec moi tous les exercices et les applications que je vous présente, je suis plus que convaincu que vous serez en mesure de réussir n’importe quel entretien technique traitant des bases de la librairie React Native.N’oubliez pas qu’actuellement, React Native est en plein BOOM. Il est de plus en plus demandé sur le marché du travail. Le maîtriser fera de vous un développeur de choix que les recruteurs s’arrachent !Donc, ne ratez pas la chance de décrocher cette formation qui fera de vous un véritable développeur "cross-platforme" via React Native!  Ne perdez pas votre temps avec les tutos Youtube où avec ceux qui, au lieu de vous former, passent leurs temps à vous faire croire qu'ils "savent coder" mais qui, en réalité, ne vous apprennent rien sauf à vous faire croire que ce qu'il font est compliqué tout en cherchant le clic! N'oubliez pas que le but principal est de vous former "VOUS" pour que vous puissiez réussir!  Vous n'êtes pas à la recherche d'un champion à applaudir! Cherchez un formateur qui va vous acclamer vous vos progrès et votre réussite!   Ne perdez pas votre temps, avec ceux qui vous compliquent ce qui n'est pas compliqué! Ne perdez pas votre temps à écouter le bla-bla mais orientez-vous vers de vraie formations structurées, accessibles à tous (Débutants comme expérimentés). Oui, une véritable formation qui s'adresse à tous les niveaux! Ne perdez pas votre temps avec les formations d'une heure ou deux qui bâclent le travail et vous feront perdre votre temps! Une vraie formation doit aborder énormément de concepts tout en les expliquant sereinement, paisiblement, étape par étape pour que tout le monde puisse suivre et comprendre. Rappelez-vous ceci: Ce n'est PAS de votre faute ! Si vous avez du mal à comprendre un concept, c'est qu'on vous l'a MAL expliqué!En effet, si d'autres l'ont compris, vous êtes capable de le comprendre et c'est justement le défit que je relève avec cette formation. Une formation sans bla-bla et qui s'adresse à tous les niveaux (Sans exception). Ne perdez pas votre temps, maîtrisez React Native maintenant et devenez de DEV que les recruteurs respectent et s'arrachent à des salaires élevés.  La décision vous revient et votre avenir vous appartient ! C'est vous qui décidez de votre réussite ou de votre échec.Si vous voulez réussir et devenir un véritable développeur d'applications Mobiles iOS et Android, vous ne pouvez pas trouver mieux que cette formation! Oui, vous êtes au bon moment et surtout au bon endroit !Vous souhaitez avoir un aperçu de la qualité de cette formation?En plus des deux vidéos accessibles au niveau du premier chapitre "Introduction et prérequis", vous pouvez consulter plusieurs autres vidéos gratuitement au niveau du chapitre "React Navigation 5" ;-) Ressources supplémentaires pour vous aider encore plus:Pour rappel, vous devez avoir des notions de base en React, en CSS Flexbox er Redux pour pouvoir coder des applications sous React Native. Cependant, ne vous inquiétez pas! Je vous ai préparé tout ce qu'il faut. Vous aurez accès à deux sections réservées à React JS dans lesquelles je vous présenterai les bases de la librairie React JS ainsi que les Hooks nouveaux. Vous pouvez y accéder dans les derniers chapitres de cette formation. Toujours dans les derniers chapitres de cette formation, vous aurez accès à une section réservées à l'apprentissage du CSS FlexBox. Redux étant un outil indispensable sur React et React Native, je vous donne également accès une une section réservée à l'apprentissage de Redux.Voici quelques nouvelles sections arrivées récemment :-)Les Interfaces Utilisateur AdaptativesUn Quiz sur les Interfaces Utilisateur AdaptativesLes Notifications dans React Native avec ExpoReact Native CLI (Mac)Exercices sur React Native CLI (React Navigation 6 + React-Native-Image-Picker)React Native via le Bare Workflow (Expo + React Native CLI)Créer une application Expo et faire le Eject pour passer en mode BareWorkflowGénérer le build d'une app Expo via EAS Build et la tester sur le simulateurs iOS et l'émulateur Android.Maîtriser le CSS FlexBoxExercices Pratiques CSS FlexBoxLes bases de la librairie REACT JSLes Hooks de ReactMaîtriser Redux avec React JSUpdate React-Router 6 (15 nouvelles vidéos)!Oui les ami(e)s, avec cette formation vous avez tout ce qu'il faut pour bien maîtriser React Native et bien plus encore !Bonne formation à tous :-)Donkey Geek.PS: Je ferai de mon mieux pour répondre à vos questions ayant un lien direct au contenu de cette formation. En revanche, je ne suis pas habilité à intervenir sur vos projets personnels ou ceux sur lesquels vous travaillez en entreprise.

Overview

Section 1: Introduction et prérequis

Lecture 1 Introduction et accès aux ressources de la formation

Lecture 2 C'est quoi React Native ?

Lecture 3 Les Prérequis

Section 2: React Native - Android et iOS

Lecture 4 Les différences entre plateformes

Lecture 5 Composants React.js Vs composants React-Native

Lecture 6 Exécution du JavaScript

Section 3: Outils et Environnement de développement

Lecture 7 Visual Studio Code & Expo-CLI

Lecture 8 Environnement de développement

Lecture 9 Initialisation de projet et découverte de ExpoDevTool.

Lecture 10 ExpoClient, Android et iOS

Lecture 11 Télécharger et installer Expo Go sur Android et Flasher le QR Code

Lecture 12 iOS Simulator et Android Studio Emulator

Lecture 13 Note Utilisateurs Mac

Lecture 14 Installation de Android Studio

Lecture 15 Note Installation Android Studio (MAC)

Lecture 16 Tester le simulateur Android Studio

Lecture 17 Installation et teste iOS Simulator

Lecture 18 Tester deux simulateurs en même temps

Section 4: Les Bases de React Native

Lecture 19 Présentation des composants de notre application

Lecture 20 Composants View et Text

Lecture 21 Découvrir le Inline Style

Lecture 22 Découvrir les Objet StyleSheets

Lecture 23 Styliser le composant Text

Lecture 24 Le JSX dans React Native

Lecture 25 Les Props dans React Native

Lecture 26 Le Props Children dans React Native

Lecture 27 Autres Props dans React Native

Lecture 28 Passer un objet dans un Props

Lecture 29 Découvrir le State et son utilité dans React Native

Lecture 30 Composant Button

Lecture 31 Modifier le State via un événement onPress

Lecture 32 Passer un objet dans le hook useState

Lecture 33 Composant TextInput

Lecture 34 Afficher le contenu d'un objet

Lecture 35 Composant ScrollView

Lecture 36 Composant FlatList

Lecture 37 Application Shopping List - Partie 1

Lecture 38 Application Shopping List - Partie 2

Lecture 39 Application Shopping List - Partie 3

Lecture 40 Application Shopping List - Partie 4

Lecture 41 Application Shopping List - Partie 5

Lecture 42 Application Shopping List - Partie 6

Lecture 43 Passer de la data entre les composants

Lecture 44 Passer une fonction dans un prop

Lecture 45 Passer une fonction du composant enfant vers le composant parent

Lecture 46 Invoquer une fonction dans un composant enfant pour y passer la valeur du state

Lecture 47 Découverte de TouchableHighlight

Lecture 48 Découverte de TouchableOpacity

Lecture 49 Découverte de TouchableHighlight

Lecture 50 Découverte de Pressable

Lecture 51 Supprimer un produit

Lecture 52 Afficher une simple alerte

Lecture 53 API Alert de React Native

Lecture 54 Utilisation du Hook useEffect dans React Native

Lecture 55 Désactiver un bouton dans React Native

Lecture 56 Découverte du composant Modal - Partie 1

Lecture 57 Découverte du composant Modal - Partie 2

Lecture 58 Découverte du composant Modal - Partie 3

Lecture 59 Découverte du composant Modal - Partie 4

Lecture 60 Découverte du composant Modal - Partie 5

Lecture 61 Extensions Visual Studio Code pour la colorisation CSS

Lecture 62 Exercice 1

Lecture 63 Exercice 2

Lecture 64 Exercice 3

Lecture 65 Exercice 4

Lecture 66 Exercice 5

Lecture 67 Exercice 6

Lecture 68 Exercice 7

Lecture 69 Exercice 8

Lecture 70 Exercice 9

Lecture 71 Exercice 10

Lecture 72 Exercice 11

Lecture 73 Exercice-12 - Découverte du composant SectionList

Lecture 74 Exercice 13 - Props & TextInput

Lecture 75 Le module Keyboard

Lecture 76 Exercice sur le Keyboard avec addListener - removeListener et useEffect

Lecture 77 Afficher TextInput dans un Modal suite à onPress sur un bouton

Lecture 78 Retirer le Modal après validation du produit

Lecture 79 Retirer le modal sans validation

Lecture 80 Aligner deux boutons horizontalement - Flex-box

Lecture 81 Découverte du composant React Native Image

Lecture 82 Découverte du composant React native ImageBackground

Lecture 83 Custom Button et props

Lecture 84 Custom Button avec le props children et TouchableOpacity

Lecture 85 Composants Text et View - Notions importantes relatives aux styling

Lecture 86 Custom Header avec logo

Lecture 87 Les constantes - Colors

Lecture 88 Créer un custom Input

Lecture 89 Les forward props dans un custom Input

Lecture 90 Filtrer les valeurs validées dans TextInput

Lecture 91 Custom fonts avec Google-fonts

Lecture 92 Expo Google Fonts

Lecture 93 Custom Component TitleText

Lecture 94 Les Icons via Vector Icons

Lecture 95 Gestion Globale des styles

Section 5: Quiz 1

Section 6: Notre relative aux versions de packages Expo/NPM

Lecture 96 Note importante à garder en tête

Section 7: Le Debugging en React Native

Lecture 97 Introduction au déboggage (Debugging) dans React Native

Lecture 98 Le debugging via Console.log()

Lecture 99 Le debugging via Chrome Debugger

Lecture 100 Le debugging via React-Devtools – Partie 1

Lecture 101 Le debugging via React-Devtools – Partie 2

Lecture 102 Installation de React-Native-Debugger

Lecture 103 Compatibilité de React-Native et React-Native-Debugger

Lecture 104 Connecter et tester React-Native-Debugger

Section 8: La Navigation avec React Navigation 4

Lecture 105 Introduction à React-Navigation

Lecture 106 App Pixels, création des screens et custom fonts

Lecture 107 Le Stack Navigator

Lecture 108 Navigation entre écrans via navigate()

Lecture 109 Revenir à l’écran précédant via goBack()

Lecture 110 Précisions concernant navigate et push

Lecture 111 Retirer un écran via replace()

Lecture 112 Les méthodes popToTop() et pop()

Lecture 113 Comprendre le Stack Navigator via les méthodes de cycle de vie

Lecture 114 Note images Pixabay

Lecture 115 Passer la data entre les écrans – Partie 1

Lecture 116 Passer la data entre les écrans – Partie 2

Lecture 117 Passer la data entre les écrans – Partie 3

Lecture 118 Définir la propriété navigationOptions à un route

Lecture 119 Définir la propriété navigationOptions par défaut

Lecture 120 Définir la propriété navigationOptions à un composant

Lecture 121 Hiérarchie des styles et API Platform

Lecture 122 Styliser le Header avec une data dynamique

Lecture 123 Passer la data et accéder aux méthodes de l’objet navigation

Lecture 124 Afficher un bouton sur le cote droit du header

Lecture 125 Afficher une icône cliquable avec React-Navigation-Header-Buttons

Lecture 126 Afficher l’icône de menu sur le côté gauche du header

Lecture 127 Drawer Navigation – Partie 1

Lecture 128 Drawer Navigation – Partie 2

Lecture 129 Rappel sur l’utilité de la documentation

Lecture 130 Styliser le Drawer

Lecture 131 Tab Navigation

Lecture 132 Afficher des icônes et changer le texte dans Tab Navigation

Lecture 133 Changer l’apparence du Tab-Navigation sur iOS et Android

Lecture 134 Changer le route Selected en un StackNavigator

Lecture 135 Travailler sur l’écran Portfolio – Partie 1

Lecture 136 Travailler sur l’écran Portfolio – Partie 2

Lecture 137 Travailler sur l’écran Portfolio – Partie 3

Lecture 138 Travailler l’écran Photo – Partie 1

Lecture 139 Travailler l’écran Photo – Partie 2

Lecture 140 Information avant d’aborder React-Navigation 5

Section 9: Quiz 2

Section 10: La gestion de State avec REDUX en React-Native

Lecture 141 Initialization et connexion de Redux à notre application.

Lecture 142 Afficher les catégories utilisateurs

Lecture 143 Définir une action et modifier l’icône du Header dans Portfolio

Lecture 144 Dispatcher l’action setSelection

Lecture 145 Gérer l’action dispatchée dans le Reducer

Lecture 146 Récupérer les images enregistrées

Lecture 147 Gérer l’affichage de l’icône

Lecture 148 Afficher un Modal dans Home

Lecture 149 Travailler les Settings via les Switch – Partie 1

Lecture 150 Travailler les Settings via les Switch – Partie 2

Lecture 151 Travailler les Settings via les Switch – Partie 3

Lecture 152 Validation des Settings

Lecture 153 Fermer le Modal après validation

Lecture 154 Créer et dispacher l’action des Settings

Section 11: La Navigation avec React Navigation 5

Lecture 155 Installation de React Navigation 5 et ses dépendances

Lecture 156 StackNavigator avec React Navigation 5

Lecture 157 Exercices StackNavigation v5

Lecture 158 Exercice StackNavigator v5 (suite)

Lecture 159 Exercice gestureEnabled et gestureDirection

Lecture 160 Exercices Animations avec StackNavigator v5

Lecture 161 Passer la data vers un autre route

Lecture 162 Afficher une data dans le header

Lecture 163 Incrémenter un count via un bouton dans header

Lecture 164 Drawer Navigation avec StackNavigator

Lecture 165 Exercice 1 DrawerNavigator

Lecture 166 Exercice 2 DrawerNavigator

Lecture 167 Custom Twitter Drawer Navigator – Partie 1

Lecture 168 Custom Twitter Drawer Navigator – Partie 2

Lecture 169 Custom Twitter Drawer Navigator – Partie 3

Lecture 170 Custom Twitter Drawer Navigator – Partie 4

Lecture 171 Custom Twitter Drawer Navigator – Partie 5

Lecture 172 TabNavigator v5

Lecture 173 Exercice sur TabNavigator v5

Section 12: Petit projet E-Commerce avec React Navigation V5

Lecture 174 Note Images Pixabay

Lecture 175 Initialisation de notre app E-Coomerce

Lecture 176 Afficher les cours disponibles

Lecture 177 Afficher les icônes

Lecture 178 Installer React Navigation 5 créer un StackNavigator

Lecture 179 Afficher le titre dans le header

Lecture 180 Afficher icône panier dans header

Lecture 181 Travailler l’affichage de CourseInfo

Lecture 182 Ajouter un cours dans le panier

Lecture 183 Vider le panier

Lecture 184 Afficher les cours dans le panier

Lecture 185 Effacer un cours du panier

Lecture 186 Afficher dans le catalogue le cours retiré du panier

Lecture 187 Effectuer le paiement et vider panier

Lecture 188 Utiliser un DrawerNavigator

Lecture 189 Afficher l’icône menu pour activer le Drawer

Lecture 190 Afficher l’historique des achats

Lecture 191 Ecrans éditer et créer une formation

Lecture 192 Affichage les cours d’un utilisateur

Lecture 193 Affichage des deux icônes éditer et effacer

Lecture 194 Effacer un cours et mettre à jour le catalogue et le panier

Lecture 195 Formulaire pour éditer ou créer un cours

Lecture 196 Gérer la modification et la création d’un cours

Lecture 197 Gérer la validation

Lecture 198 Dispatcher une action pour modifier le cours

Lecture 199 Dispatcher une action pour créer un cours

Section 13: Suite du Projet E-Commerce avec la validation de formulaires

Lecture 200 Validation du formulaire via useReducer – Partie 1

Lecture 201 Validation du formulaire via useReducer – Partie 2

Lecture 202 Validation du formulaire via useReducer – Partie 3

Lecture 203 Validation du formulaire via useReducer – Partie 4

Lecture 204 Validation du formulaire via useReducer – Partie 5

Lecture 205 Validation du formulaire via useReducer – Partie 6

Section 14: API AsyncStorage

Lecture 206 Présentation de l’API AsyncStorage

Lecture 207 Retravailler notre React Navigation

Lecture 208 Travailler la page Login

Lecture 209 Enregistrer une valeur de type string dans AsyncStorage

Lecture 210 Rediriger le user connecté vers Home et afficher son nom dans Drawer

Lecture 211 Supprimer la data du AsyncStorage

Lecture 212 Enregistrer un objet dans AsyncStorage et récupérer la data

Lecture 213 Supprimer toutes les clés enregistrées dans AsyncStorage

Section 15: L’authentification via Firebase

Lecture 214 Présentation de l’authentification & requêtes http

Lecture 215 Retravailler la page Login

Lecture 216 Découvrir le package Expo-Linear-Gradient

Lecture 217 Installation de Redux, React-redux, Thunk Middleware

Lecture 218 Action d’inscription Async et Thunk Middleware

Lecture 219 Affichage des erreurs via l’API Alert

Lecture 220 Composant ActivityIndicator

Lecture 221 Action de Connexion

Lecture 222 Gestion des Messages d’erreurs

Lecture 223 Dispatcher l’action d’authentification actionAuthUser

Lecture 224 Enregistrement dans AsyncStorage

Lecture 225 Récupérer la data de AsyncStorage

Lecture 226 Afficher un Spinner le temps d’authentifier l’utilisateur

Section 16: La base de données via Firebase

Lecture 227 La base de donnée Firebase

Lecture 228 Enregistrer les informations d’un utilisateur

Lecture 229 Enregistrer les informations utilisateur dans AsyncStorage

Lecture 230 Récupérer les informations utilisateur de AsyncStorage

Lecture 231 BDD Récupérer les infos utilisateur de la BDD Firebase

Lecture 232 Enregistrer les infos utilisateur dans Redux – Partie 1

Lecture 233 Enregistrer les infos utilisateur dans Redux – Partie 2

Lecture 234 Déconnexion de l’utilisateur

Section 17: Accès à la galerie de l’appareil iOS & Android

Lecture 235 Image-Picker – Partie 1

Lecture 236 Image-Picker – Partie 2

Section 18: SQLite, Géolocalisation et Cartes

Lecture 237 Présentation de l’objectif du chapitre

Lecture 238 Redirection vers l’écran de Géolocalisation

Lecture 239 Géolocalisation de l’utilisateur – Partie 1

Lecture 240 Géolocalisation de l’utilisateur – Partie 2

Lecture 241 Initialisation SQLite

Lecture 242 Enregistrement data de Géolocalisation dans SQLite

Lecture 243 Afficher les infos utilisateur dans Portfolio

Lecture 244 Fetch de data de SQLite

Lecture 245 Afficher la carte via MapView

Lecture 246 Tester l’affichage de la carte sur Android

Lecture 247 Afficher le Marker sur la carte

Lecture 248 Corriger le problème du Keyboard

Section 19: Interfaces Utilisateur Adaptatives

Lecture 249 Tester l’app Pixels sur un petit écran – Partie 1

Lecture 250 Tester l’app Pixels sur un petit écran – Partie 2

Lecture 251 Exercices API Dimensions

Lecture 252 Exercices API Dimensions avec conditions

Lecture 253 Exercices API Dimensions – Section Portfolio

Lecture 254 Exercice Mode Portrait, Paysage et les deux

Lecture 255 Exercice Dimensions avec addEventListener

Lecture 256 Listener Cleanup & useWindowDimensions

Lecture 257 Retourner différents contenus

Lecture 258 SafeAreaView

Section 20: Quiz 3

Section 21: Les Notifications dans React Native avec Expo

Lecture 259 Introduction aux notifications Locales et Push

Lecture 260 Exercice 1: Notifications Locales

Lecture 261 Exercice 2: Notifications Locales

Lecture 262 Exercice 2: Notifications Locales - Suite

Lecture 263 Fonctionnement des notifications Push

Lecture 264 Tester les notifications locales sur un téléphone (android)

Lecture 265 Vérifier si on utilise un vrai appareil ou un simulateur

Lecture 266 Autorisation de notification et récupération du Token Expo

Section 22: React Native CLI (Mac)

Lecture 267 Application React Native CLI

Lecture 268 Le Flux géré (Expo) versus le flux non-géré (RN CLI)

Lecture 269 Configuration React Native CLI - Partie 1

Lecture 270 Configuration React Native CLI - Partie 2

Lecture 271 Configuration React Native CLI - Partie 3

Lecture 272 Installation de CocoaPods

Lecture 273 Initialisation d'un projet React Native CLI

Lecture 274 Présentation de l'application React Native CLI

Lecture 275 Lancer notre application sur un simulateur iOS

Lecture 276 Lancer notre application sur Android Emulator

Lecture 277 Petit exercice pour tester notre application

Section 23: Exercices via React Native CLI

Lecture 278 Exigences minimales React Navigation 6

Lecture 279 Installation de React Navigation Version 6

Lecture 280 Installation du stack-navigator et création de nos écrans

Lecture 281 Naviguer entre les écrans

Lecture 282 Passer la data entre les écrans

Lecture 283 Exercices sur le header

Lecture 284 Créer deux tabs Navigations

Lecture 285 Exercices sur la TabBar

Lecture 286 React-Native-Image-Picker avec React Native CLI

Lecture 287 Récupérer une image dans la galerie et l'afficher

Lecture 288 Prendre une photo avec la caméra et l'afficher

Section 24: React Native via le Bare Workflow

Lecture 289 Le Bare-Workflow comparé à Expo-CLI et React-Native CLI

Lecture 290 Note Expo Go avec Bare Workflow

Lecture 291 Initialisation d'un projet React Native avec le Bare Workflow

Lecture 292 Exercice sur notre application BareWorkflow - Partie 1

Lecture 293 Exercice sur notre application BareWorkflow - Partie 2

Lecture 294 Expo Eject et test sur Android Émulateur - Partie 1

Lecture 295 Expo Eject et test sur Android Émulateur - Partie 2

Lecture 296 Expo Eject et test sur iOS Simulateur

Section 25: Générer le build d'une app Expo et tests sur les simulateurs

Lecture 297 Presentation du build d'une application Expo via EAS

Lecture 298 Configuration avant le build

Lecture 299 icon, adaptative-icon et splash

Lecture 300 EAS build Android

Lecture 301 Tester le build APK sur l'émulateur Android

Lecture 302 Correction affichage Splash et StatusBar

Lecture 303 Générer le build pour iOS

Lecture 304 Tester le build sur le simulateur iOS

Section 26: Maîtriser le CSS FlexBox

Lecture 305 Ressources relatives au CSS Flexbox

Lecture 306 Introduction à la section CSS FlexBox et ressources

Lecture 307 Display Flex

Lecture 308 Flex-Direction

Lecture 309 Flex-Wrap

Lecture 310 Flex-Flow

Lecture 311 Justify-Content

Lecture 312 Align-Items

Lecture 313 Align-Content

Lecture 314 Order

Lecture 315 Flex-Grow

Lecture 316 Flex-Shrink

Lecture 317 Flex-Basis

Lecture 318 Flex

Lecture 319 Align-Self

Section 27: Exercices Pratiques CSS FlexBox

Lecture 320 Exercice Pratique FlexBox - Partie 1

Lecture 321 Exercice Pratique FlexBox - Partie 2

Lecture 322 Exercice Pratique FlexBox - Partie 3

Lecture 323 Exercice Pratique FlexBox - Partie 4

Lecture 324 Exercice Pratique FlexBox - Partie 5

Lecture 325 Exercice Pratique FlexBox - Partie 6

Lecture 326 Exercice Pratique FlexBox - Partie 7

Lecture 327 Exercice Pratique FlexBox - Partie 8

Section 28: Les bases de la librairie REACT JS

Lecture 328 Introduction à React JS

Lecture 329 Les Composants React JS

Lecture 330 React via CDN, JSX, ES6 et Babel

Lecture 331 Créer une application React - Partie 1

Lecture 332 Créer une application React - Partie 2

Lecture 333 Note concernant React.StrictMode

Lecture 334 Composants, Props et State dans REACT JS - Partie 1

Lecture 335 Composants, Props et State dans REACT JS - Partie 2

Lecture 336 8- DOM Events et changement de State - Partie 1

Lecture 337 DOM Events et changement de State - Partie 2

Lecture 338 Passer une fonction dans un Props

Lecture 339 React Fragments

Lecture 340 Destructuring et React (ES6) - Partie 1

Lecture 341 Destructuring et React (ES6) - Partie 2

Lecture 342 Les Conditions dans React

Lecture 343 Affichage des images dans React

Lecture 344 Les Formulaires dans React

Lecture 345 Le CSS dans React

Lecture 346 Méthodes de cycle de vie

Lecture 347 Phase de montage d’un composant React

Lecture 348 Phase de Mise à jour d’un composant React

Lecture 349 Phase de Démontage d’un composant React

Lecture 350 La méthode getDerivedStateFromProps

Lecture 351 shouldComponentUpdate()

Lecture 352 PureComponent

Lecture 353 React Memo

Lecture 354 React Portails

Lecture 355 React Refs

Lecture 356 React Refs - forwardRef

Lecture 357 Composant d'ordre supérieur

Lecture 358 Périmètres d'erreurs ou Error Boundaries

Lecture 359 Props de Rendu ou Render Props

Lecture 360 Note React Router

Lecture 361 Route, Link, NavLink, Switch, Strict, Exact, Error page

Lecture 362 Redirection automatique dans React

Lecture 363 Paramètres Route dans React

Lecture 364 Context dans React - Partie 1

Lecture 365 Context dans React - Partie 2

Section 29: Les Hooks de React

Lecture 366 C'est quoi ces Hooks de React ?

Lecture 367 Hook d’état - useState - Partie 1

Lecture 368 Hook d’état - useState - Partie 2

Lecture 369 Hook d’effet - useEffect après render

Lecture 370 05 - Hook d’effet - useEffect avec condition

Lecture 371 Hook d’effet - useEffect comme ComponentDidMount

Lecture 372 Hook d’effet - useEffect avec Nettoyage

Lecture 373 Hook de Contexte - useContext

Lecture 374 Introduction au hook useReducer

Lecture 375 useReducer - Partie 2

Lecture 376 useReducer - Partie 3

Lecture 377 useCallback - Partie 1

Lecture 378 useCallback - Partie 2

Lecture 379 useMemo

Lecture 380 useRef

Lecture 381 useImperativeHandle

Lecture 382 useLayoutEffect

Section 30: Update React-Router-Dom version 6

Lecture 383 Infos téléchargement application

Lecture 384 Application et Node Modules

Lecture 385 Révisions React Router v5 avant mise à jour vers v6

Lecture 386 Routes et Route

Lecture 387 Link et NavLink

Lecture 388 Navigate

Lecture 389 Redirection programmée

Lecture 390 Navigate avec replace

Lecture 391 Gérer les routes inexistants via ErrorPage

Lecture 392 Exercice 1

Lecture 393 Correction Exercice 1

Lecture 394 Exercice 2

Lecture 395 Correction Exercice 2

Lecture 396 Routes imbriques (Nested Routes)

Lecture 397 Route Index

Lecture 398 Récupérer la data dans l'URL

Lecture 399 Récupérer une data d'une API via paramètres Route

Lecture 400 Paramètres de requêtes

Lecture 401 Télécharger le projet React-Router 6

Section 31: Maîtriser Redux avec React JS

Lecture 402 Ressources relatives à Redux

Lecture 403 Introduction à la bibliothèque Redux

Lecture 404 Les Actions dans Redux

Lecture 405 Le Reducer dans Redux

Lecture 406 Redux Store via createStore

Lecture 407 Gestion de plusieurs actions

Lecture 408 Combiner plusieurs Reducers

Lecture 409 La bibliothèque React-Redux

Lecture 410 React-Redux Store Provider

Lecture 411 Connect HOC et mapStateToProps

Lecture 412 Connect HOC et mapDispatchToProps

Lecture 413 useSelector Hook

Lecture 414 useDispatch Hook

Lecture 415 La documentation Redux et React-Redux

Lecture 416 combineReducers dans une app React

Lecture 417 Redux Action Payload

Lecture 418 Middleware – applyMiddleware

Lecture 419 Thunk Middleware

Lecture 420 L’extension Redux DevTools

Section 32: Remerciements et suite ;-)

Lecture 421 Remerciements et suite

Débutants ou avancés souhaitant se lancer dans la programmation d'applications mobiles.,Développeurs React JS souhaitant élargir leurs compétences vers le développement mobile.,Développeur JavaScript qui veut coder de vraies applications Mobiles compatibles iOS et Android en javaScript sans passer par les langages Swift, ObjectiveC, Java ou Kotlin!,Toute personne sachant coder un peu en JavaScript (+ notions en React) souhaitant coder des applications mobiles.