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

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

  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  

في هذا المساق ستتعلم اساسيات الرياكت والرياكت نيتف ومجموعة من الادوات والمكتبات والمهارات التي تمكنك من بناء ونشر تطبيق ايكومرس كامل.
 
ومن اهم هذه الأساسيات:
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
اشترك في الدورة
0 متدرب مسجل في الدورة

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

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

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