WeCours > Development > Web Development > Développement mobile et Web avec React et React Native
4.56 sur 5
4.56

Développement mobile et Web avec React et React Native

Apprenez React avec React JS, React Native, Router, Hooks and Context et approfondissez vos connaissances sur React Native
Instructeur :
Mahefa Abel
English
Plongez dans React JS et Native
Apprenez à créer des applications à page unique avec React JS
Apprendre à se connecter à une API externe
Créer des composants React réutilisables
Configurer notre environnement virtuel
Installer les dépendances React-Native pour MAC et Windows
Exécuter le simulateur Android et IOS
Syntaxe et expressions JSX
Syntaxe ES6
Voir le contenu sur le simulateur
Entrées utilisateur, formulaires et événements dans React
Utiliser les portails React pour rendre les enfants en dehors de la hiérarchie DOM
React JS Hooks et Contexte
Le visage moderne de React est de développer des applications Web avec React Js Hooks et Context
Créer des Hooks et des Structures de Contexte
Routage avec React Router
Itinéraire entre différents écrans
Transfert de données entre différents écrans avec navigation React
Réducteur, concepts d'action et de répartition et bien plus encore
Comment utiliser les techniques de codage pour faire un développement efficace avec React
Créez des applications Web rapides et conviviales avec React

Bienvenue dans le cours Développement mobile et Web avec React et React Native.

  • Voulez-vous apprendre React Js pour le scratch ?
  • Voulez-vous apprendre React Native pour le scratch ?
  • Voulez-vous découvrir les dernières fonctionnalités React de Hooks and Context système ?
  • Voulez-vous créer une application avec React React Router ; de manière très détaillée ?

Si votre réponse est “Oui”, vous êtes au bon endroit. Ce cours de Développement mobile et Web avec React et React Native conviendra parfaitement.

React est l’un des meilleurs choix pour créer des applications Web modernes. . Si vous débutez avec React ou si vous avez du mal à apprendre et à vraiment comprendre ce qui se passe, ce cours est le meilleur moyen pour vous d’apprendre React.

React-Native est une bibliothèque développée par l’équipe React et elle est largement utilisée pour créer des applications mobiles pour Android et IOS. Vous n’avez pas besoin d’apprendre Java, Android, Swift, Objective-C ou quoi que ce soit de cela.  React et JavaScript sont tout ce dont vous avez besoin pour créer des applications mobiles géniales qui fonctionnent à la fois sur Android et iOS.

Ce cours est pour tous les niveaux. Nous vous accompagnerons du niveau débutant au niveau avancé.  Vous apprendrez  Réagissez au développement pas à pas avec des démonstrations pratiques. Pour pouvoir bénéficier de ce cours, tout ce dont vous avez besoin est une compréhension de base de JavaScript.

Dans le cours, nous allons vous dire quelles dépendances vous devez installer et comment en détail, pour pouvoir pour créer des applications mobiles sur MAC et Windows. Nous allons utiliser des outils et plates-formes gratuits afin que vous n’ayez pas à acheter d’outils ou d’applications. Vous allez apprendre à exécuter un simulateur Android et IOS sur votre ordinateur MAC ou Windows. De plus, avec l’application Expo, vous pourrez également exécuter vos applications sur votre propre appareil mobile.

Plus tard dans le cours, nous allons apprendre les bases de React et React Navigation. JSX, props system et state system seront clairs pour vous à la fin du cours. Nous allons créer de jolis composants réutilisables. Vous allez pouvoir utiliser ces composants réutilisables dans vos propres projets futurs. Vous allez accéder à différents écrans de l’application avec la navigation React.

Enfin, vous allez apprendre les dernières fonctionnalités de React “Hooks and Context” du système. Nous allons créer deux belles applications, vous apprendre “Hooks and Context” de manière très détaillée. Vous allez apprendre à utiliser “state” dans des composants fonctionnels avec le système “Hooks” et avec “Context API” vous n’aurez besoin d’aucun package tiers pour gérer l’état de l’application.

Nous avons essayé de décrire très en détail tous les sujets complexes du cours. Nous avons utilisé des diagrammes pour décrire certains sujets importants et avons créé une belle application mobile. Nous avons montré deux façons différentes de créer une application mobile. Nous avons montré à la fois react-native-cli et expo-cli dans notre cours.

À la fin du cours ;

  • Bases des bibliothèques React, React-Native, React-Navigation
  • Comment envoyer une requête HTTP depuis une application mobile
  • Comment utiliser le système flex-box
  • Comment créer des composants réutilisables
  • Pour accéder à une autre application sur l’appareil depuis notre application
  • Créer votre propre application mobile à la fois avec react-native-cli et expo-cli
  • Créer un contexte avec Class Based et Composants fonctionnels
  • Comment utiliser le contexte dans les composants basés sur les classes et fonctionnels
  • Comment utiliser plusieurs contextes dans un seul composant
  • Fonctions Hooks(useState, useEffect, useReducer, useContext…)
  • Créer un réducteur et
  • L’utilisation de Reducer va être claire pour vous.

Aucune connaissance préalable n’est nécessaire !

Il n’a pas besoin de connaissances préalables pour apprendre rn et le React est facile à comprendre pour les débutants.

Ce cours commence par très les bases. Tout d’abord, vous apprendrez comment installer les outils, un peu de terminologie. Ensuite, le spectacle commencera et vous apprendrez tout avec des pratiques pratiques.  Je vais également vous apprendre les meilleures pratiques et les raccourcis.

Une méthode pas à pas, simple et facile avec des exercices

Vous obtiendrez également :

Accès à vie au cours

Rapide & Assistance conviviale dans la section Q&A

Certificat d’achèvement WeCours prêt à être téléchargé

Plongez maintenant dans notre cours natif complet de React avec routeur, crochets et contexte cours

Nous offrons un support complet, répondant à toutes les questions.

Let`s Start to Learn React JS

1
Project Files and Course Documents
2
Your First App Overview
3
Frequently Asked Questions
4
Let, Const and Var in 3 minutes
5
Install Node JS
6
Create Your React App
7
Why You Will Need To Create a React App?
8
Start Creating React App
9
Do You Want to Learn How To Stop React App?
10
Important Functional Components

What is this JSX?

1
Converting HTML JSX
2
Inline Styling with JSX in React JS
3
JavaScript Variable in JSX

React with Props

1
Three Tenets of Components
2
Simple App with React
3
Styling App with Semantic UI
4
Building Component
5
Specifying The Image in React JS
6
Duplicating The Single Component
7
Component Nesting
8
Props System
9
Passing Props to Child
10
Reusable Component Overview
11
Props Children
12
Quiz

Class-Based Components

1
Class-Based Components and Functional Component
2
New App Overview
3
Getting Users Physical Location
4
Handling Async Operation in React
5
Transformation Functional Component to Class Based Component

State in React

1
State Rules
2
Initializing State In Constructor
3
Lifecycle Method Overview
4
Conditional Rendering

Lifecycle Methods

1
Get to Know Lifecycle Method
2
Refactoring App with Lifecycle Method
3
Passing State As Props
4
Ternary Expressions in JSX
5
Showing Picture
6
Styling The App
7
Free React Developer Tools
8
General App Review

User Inputs, Forms and Events in React JS

1
App Overview
2
Component Design
3
Handling Forms
4
Styling The App
5
Creating Event Handlers
6
Controlled vs Uncontrolled Elements
7
Why Controlled Elements?
8
Understanding ‘this’ Key Word In JS
9
Communicating Child to Parent
10
Invoking Callbacks In Children

API Request with React

1
Fetching Data
2
Axios vs Fetch
3
Async Await Function
4
Setting The State
5
Rendering A List of Components
6
Implementing The Key Values In List
7
What We Have Learned From The App?

Navigation with React Router

1
Initializing The Project
2
The React Router
3
Link and Nav Links
4
Programmatic Redirects
5
Route Parameters
6
React Router Switch Tag

React Portals

1
How To Create A Modal?
2
Why React Portals?
3
Creating a React Portals

Let's meet Hooks and Context

1
Context and Hooks

Create Application

1
Let's Start Building Application
2
Why Context API
3
Context Provider
4
Context Provider-2
5
Let's Reach Out The Context State
6
Consuming Data in TodoList Component
7
Context Consumer
8
Update The Context Data

Multiple Context Usage

1
Create Multiple Context
2
Use Multiple Context Inside One Component

Introduction to React Hooks

1
Hooks

Create Application

1
Let's Start Creating The App
2
UseState Hook
3
UseState With Forms
4
useEffect Hook
5
useContext Hook
6
Create multiple context with useContext
7
Create context with functional component

Hooks & Context

1
Hooks and Context
2
Let's add new todo with Hooks and Context
3
Let's remove todo from context

Get to Know the UseReducer Hook

1
useReducer Hook
2
Let's implement useReducer
3
Reducer Component Structure

Setup For Windows

1
Free Tools For Windows
2
Windows Setup for React Native
3
How To Start Emulator in Android Studio

Setup For OSX

1
Free Tools for IOS
2
OSX Setup for React Native
3
Start The Emulator

React Native and JSX

1
How To Create An App
2
See Content On Emulator
3
Why Do We Need React and React-Native?
4
Es6 Syntax ( Let, Const, Var)
5
First Component
6
How To Show Component On Device
7
How to Build Our First App
8
How to Connect a Component To The Root Component
9
Import a Component to Another Component

Styling For React Native

1
Styling with JSX
2
Displaying Views
3
Header Component’s Styling
4
React Props
5
How to Reuse Code With Props System
6
Quiz

API Request With React Native

1
How To Show a List To The User
2
The List Component
3
Func Component vs Class Based Component

Lifecycle Methods

1
When Do We Need Lifecycle Methods?
2
Lifecycle Methods
3
Making Request With Axios

State In React Native

1
What Is State and How To Initial State?
2
Using of State
3
A Component’s Lifecycle With State
4
List Component
5
List Item Component
6
Reusable Components
7
Styled Component for List Items
8
Usage of Props.Children
9
Item Section
10
Introduction to the Flexbox
11
Section Header Component

Layout With Flexbox

1
How to Show An Image
2
Scrollable Content
3
User Interaction with ReactNative
4
Event Handlers
5
How to Open Another App (Browser)

React Native and Expo

1
React Native on Mobile Device
2
Expo CLI Project

Router Expo CLI Project

1
Router Expo CLI Project
2
See The Content On A Device or Emulator
3
What Is Router And Installation
4
Setting Up a Router in Project

FlatList

1
FlatList
2
Rendering A List With FlatList
3
How Does FlatList Work
4
Giving the Key Prop
5
FlatList Props

Route Different Screens

1
Book Detail Screen
2
Navigate Between Screens
3
Navigating from a Child Component
4
withNavigation Function
5
Data Transfer Between Screens
6
Quiz

BONUS

1
BONUS
Vous pouvez afficher et revoir les supports de cours indu00e9finiment, comme une chau00eene u00e0 la demande.
Absolumentu00a0! Si vous disposez d'une connexion Internet, les cours sur WeCours sont disponibles u00e0 tout moment sur n'importe quel appareil. Si vous n'avez pas de connexion Internet, certains instructeurs permettent u00e9galement u00e0 leurs u00e9tudiants de tu00e9lu00e9charger les cours. instructeur cependant, alors assurez-vous d'u00eatre de leur bon cu00f4tu00e9u00a0!
4.6
4.6 sur 5
Notes62

Détails des Notes

Étoiles 5
37
Étoiles 4
9
Étoiles 3
9
Étoiles 2
0
Étoiles 1
0
Suivre un cours
Paiement unique S'inscrire avec l'adhésion
Garantie de remboursement de 30 jours

Inclut

18 heures de vidéo à la demande
Accès complet à vie
Accès sur le mobile et la télévision
Certificat d'achèvement

Archive

Working hours

Monday 9:30 am - 6.00 pm
Tuesday 9:30 am - 6.00 pm
Wednesday 9:30 am - 6.00 pm
Thursday 9:30 am - 6.00 pm
Friday 9:30 am - 5.00 pm
Saturday Closed
Sunday Closed