بإمكانك الآن تحقيق أرباح عند ترويجك لكورسات كورس سيت .. للمزيد
اشترك في الدورة

تعلم الاساسيات وقم ببناء تطبيق ايكومرس كامل

 
       

في هذا المساق ستتعلم اساسيات الرياكت والرياكت نيتف ومجموعة من الادوات والمكتبات والمهارات التي تمكنك من بناء ونشر تطبيق ايكومرس كامل.
 
ومن اهم هذه الأساسيات:
React components
Props
State
Hooks
React Native Components => View, Text, TextInput, Image, FlatList, and more
React Native APIs => StyleSheet, Dimensions, and more
 
ومن أهم هذه الأدوات:
Expo
React Native CLI
Android Studio
XCode
Postman
Reactotron
 
ومن أهم هذه المكتبات:
redux, react-redux, redux-thunk
react-navigation
axios
 
ومن أهم هذه المهارات:
Transforming UI design into IOS & Android application
Working with REST APIs or Backend

مالذي ستتعلمه

React Native
React
React Hooks
Redux
Working with REST APIs
Building ECommerce (Android & IOS) Application

لمن هذا الكورس

Beginner JavaScript Developers

متطلبات الدورة

  • JavaScript

مدرب الدورة

المدرب حسام عبد الناصر كورس سيت courseset com

حسام عبدالناصر

React Native Developer | Instructor
A software engineer with experience in building cross-platform mobile applications using React Native and a bachelor degree in computer engineering & science.

Built multiple mobile applications and JavaScript tools.

Among those tools:

. api-request-biolerplate-actions

An NPM package for automating REST APIs integration when working with axios and redux

. React Native Generator

An Adobe XD plugin that generates React Native components directly from design

 
       
اشترك في الدورة

محتويات الدورة

Introduction
Introductionمجاناً 00:13:25
What is React Native?
Introductionمجاناً 00:00:31
What is React-Nativeمجاناً 00:02:17
What is React and its associated platforms => React-Dom, React-Nativeمجاناً 00:02:01
React-Native, React, and JavaScript all in one placeمجاناً 00:01:41
React-Native architecture => JavaScript thread, Native threads, Bridgeمجاناً 00:01:53
Environment Setup
Introductionمجاناً 00:00:42
Different React Native environmentsمجاناً 00:03:19
Snackمجاناً 00:01:55
Editorمجاناً 00:01:35
Expo CLIمجاناً 00:03:00
React Native CLI => Android – Mac 00:11:43
React Native CLI => Android – Other OSs 00:02:13
Running on android physical device 00:01:56
React Native CLI => IOS – Mac 00:04:27
Running on IOS physical device 00:01:15
Real app project structure 00:08:59
Opening Android application in Android Studio and IOS application in XCode 00:01:31
React Basics
Introduction 00:00:34
What are React Components 00:00:52
Building the first component 00:07:20
What is JSX 00:05:11
Components data buckets => Props & state 00:06:44
Using Props 00:04:44
Maintainability matters 00:05:20
Building reusable components 00:06:20
Handling Events 00:01:54
Building the first project component => AppButton 00:06:13
Encapsulate loading behaviour of AppButton 00:02:43
Using state 00:05:57
Binding component methods 00:04:01
Building AddToCartButton Component 00:08:14
Functional vs. Class-based components 00:03:13
Component Lifecycle methods 00:06:39
React.Component vs. React.PureComponent 00:01:52
Building Timer component 00:19:58
React Hooks 00:01:42
useState hook 00:04:05
useEffect hook 00:03:54
Transform AddToCart to Functional component using Hooks 00:02:20
Transform Timer to Functional component using Hooks 00:08:03
Styling
Introduction 00:00:36
style prop and StyleSheet API 00:04:26
style => layout & design 00:01:03
Style properties 00:01:10
Layout using flexbox 00:05:49
Flexbox in React Native 00:07:08
Implementing Layouts using FlexBox 00:13:10
Understanding previously written styles 00:01:24
Accessibility matters 00:02:28
UI component kits 00:01:26
Responsiveness challenge 00:01:22
Different layout example 00:20:59
Scaling 00:05:17
Using react-native-size-matters 00:03:54
Using react-native-extended-stylesheet 00:03:17
Icons 00:04:49
Displaying icons using Image component 00:02:18
Displaying icons using react-native-svg 00:09:17
Displaying icons using react-native-vector-icons 00:07:04
Building reusable TextInput component 00:19:35
Building App UI
Introduction 00:00:26
Building Login screen UI 00:11:00
Fixing AppButton component issue 00:02:38
Building ConfirmationCode screen UI 00:03:37
Building Category Component 00:07:01
Building Card component 00:06:44
Building Price component 00:09:19
Building Product component 00:02:51
Building Home screen UI 00:04:13
Building Category screen UI 00:02:08
Building Product screen UI 00:19:39
Fixing AddToCart component issue 00:01:51
Building IonIcon component 00:03:26
Building CartItem component UI 00:05:45
Building Cart screen UI 00:05:55
Building Checkout screen UI 00:13:27
Building Search screen UI 00:03:37
Building Account screen UI 00:13:28
Building UpdateProfile screen UI 00:08:15
Building AddAddress screen UI 00:01:23
Building Order component UI 00:05:38
Building Orders screen UI 00:01:55
Lists
Introduction 00:00:31
Mapping array of data into ui components 00:03:34
Scrolling using ScrollView 00:02:24
How does ScrollView work 00:03:11
keys 00:02:47
FlatList 00:02:42
SectionList 00:02:50
Use FlatList and SectionList for gigantic lists 00:02:06
FlatList and SectionList are PureComponents 00:09:00
Handy features using FlatList 00:02:50
Building Categories List 00:03:17
Building Products List 00:05:08
Building CartItems List 00:03:24
Building Orders List 00:01:45
Navigation
Introduction 00:00:34
Introducing react-navigation terms 00:02:39
Installing react-navigation 00:02:19
Design your app navigation structure first 00:01:44
Switching between AuthStack and Home Tabs 00:02:59
Implementing Auth stack 00:04:27
Implementing Tab-based Home 00:11:21
Implementing tabs stacks 00:04:29
Navigating in Home tabs 00:09:51
Passing params to screens when navigating 00:03:13
SafeAreaView 00:02:24
Fixing SafeAreaView padding issue 00:01:34
Handling user input
Introduction 00:00:39
Accessing user input 00:02:26
Validating user input 00:04:09
Regular Expressions 00:03:21
Realtime input validation and showing feedback 00:03:17
Reusable input validation feedback ui 00:05:36
Reusable input validation logic 00:08:39
Handling and validating auth inputs 00:08:18
Custom useInput hook 00:03:56
TextInput props and methods 00:03:26
Networking
Introduction 00:00:46
Networking terminology 00:07:23
Installing Postman and exploring project REST Api 00:02:54
Using fetch API 00:09:51
Using axios 00:05:11
Signing in 00:08:48
Confirming otp 00:06:40
Dealing with JSON Web Token JWT 00:11:39
Separation of concerns issue and data flow challenge 00:02:54
State management using redux
Introduction 00:00:30
Flux data flow model 00:07:17
Minimal implementation of flux 00:16:51
Introducing redux 00:04:25
Installing and preparing redux 00:05:18
setToken, and setUser using redux 00:15:44
react-redux hooks instead of connect 00:02:30
ActionTypes constants and action creators 00:03:18
Async actions using redux-thunk middleware 00:25:01
Understanding middlewares with redux-logger 00:02:04
Debugging
Introduction 00:00:39
In-app Developer Menu 00:04:32
Chrome 00:01:23
React-Dev-Tools 00:02:17
React-Native-Debugger 00:02:51
Reactotron 00:06:56
Focusing on the project
Introduction 00:00:21
Showing meaningful error message for user on entering wrong otp 00:10:01
Handling signing in edge case 00:06:21
Signing user out 00:11:06
Fetching user data at start 00:03:25
No boilerplate actions through api-request-biolerplate-actions 00:11:38
Updating user name 00:14:52
Adding addresses 00:06:55
Minimum validation to user name and address inputs 00:09:55
Less pain in handling errors 00:01:08
Displaying addresses and selecting one 00:08:44
Fetching and displaying orders 00:12:02
Fetching and displaying home categories and products 00:14:37
Fetching category children categories 00:08:06
Displaying category children categories 00:12:32
Fetching and displaying category products through pagination 00:23:05
Finishing category screen 00:08:09
Fetching and displaying a given product 00:09:19
Fetching and displaying cart items 00:08:22
Displaying cart items count badge 00:07:08
Calculating total and navigating to Checkout screen 00:04:15
Checking out 00:22:32
Adding product to cart 00:17:21
Updating cart item => increase, decrease, remove 00:11:43
Searching for a product 00:16:43
Polishing Account & Auth Stacks 00:13:23
Polishing Search Stack 00:07:02
Polishing Cart Stack 00:06:32
Polishing Home Stack 00:10:12
FlastLists and reference equality issue 00:05:38
Adding splash screen on Android 00:03:09
Adding splash screen on IOS 00:02:02
Publishing & Conclusion
Introduction 00:00:24
Publishing Android app 00:16:48
Publishing IOS app 00:10:24
Conclusion 00:02:08
Terminology
API 00:01:42
Thread 00:00:37
Synchronous VS. Asynchronous 00:02:35
Pure Functions 00:02:48
Shallow Comparison VS. Deep Comparison 00:02:16
Memory Leak and Garbage Collection 00:06:34

تقييم الدورة

N.A

تقييم
  • 5 نجوم0
  • 4 نجوم0
  • 3 نجوم0
  • 2 نجوم0
  • 1 نجوم0

لا يوجد تقييمات لهذا الكورس.

اخترنا لك الكورسات :

دورة تعلم React Native كورس سيت courseset com
اشترك في الدورة
1 متدرب مسجل في الدورة

مواعيد الدورة

  • ●

  • ●

  • ●

  • ●

المميزات الخاصة

لا تتردد بأي إستفسار
الإسم *الكورس الذي تستعلم عنه *البريد الإلكتروني *رقم الهاتفالبلد *رسالتك *

اشترك الطلاب أيضا بهذه الكورسات

مزيداً من الفائدة بإشتراكك بنشرة كورس سيت البريدية   إشتراك