Client MVC and Mobile Dev. with React.js & React Native

מק"ט: #3378 | משך קורס: 40 שעות אק'
| מספר מפגשים: 5

This course focus on implementing Single Page Application via React.js technology. The course details the SPA architecture and details about the different roles in client MVC design. The course walks through the way of designing and constructing a fully features SPA compliant web modules with React.js and covers both basics and advanced features.
These days, React technology becomes very popular for complex and advanced front end development and becomes a popular long-run solution for web based services.
Another exciting extension of React known as React-Native provides capabilities for creating native mobile application based on React.JS and by that exploid your React knowledge and experience for Mobile development as well. This course relates React native.

*שדות חובה
PDF version

מטרות

  • Understand MVC and SPA
  • Describe React technology and application structure
  • Use React basic components
  • Use ECMAScript
  • Combine Redux with React
  • Use routing and asynchronous messaging
  • Use some React advanced features 
  • Create native mobile applications with React Native

קהל יעד

Web developer that choose React as their solution for constructing Single Page Applications and implement client side MVC

תנאי קדם

  • Experience in client side technologies based on HTML & CSS
  • Experience in JavaScript programming
  • Some background in REST and Web-Services

נושאים

Introduction to SPA & Client MVC

  • SPA Architecture
  • Getting ready for future internet clients & IoT
  • Client MVC roles
  • Overview of supporting technologies (AJAX, REST)

Type Script

  • JavaScript, ECMAScript5 , ECMAScript6 and Type Script
  • Understanding the JavaScript Closures
  • Types
  • Classess
  • Inheritance
  • Generics Modules
  • Tools

Introduction to React.js

  • Github links for React libraries
  • Environment setup
  • Project setup
  • Basic concepts and terms
  • Most basic components
  • The virtual DOM
  • Introduction to React.js event model

React components & Lifecycle

  • Basic components
  • Components structure
  • Passing properties
  • Managing component state
  • Using references
  • Pure components
  • Component mount
  • Component unmount
  • Component props updated
  • Component state updated
  • Stateless vs stateful components
  • React children

Introduction to Redux with React

  • Introduction to Redux
  • Redux actions
  • Redux reducers
  • Redux store
  • Redux middleware
  • Combined with React
  • Use store with React
  • Using reducers and actions to manage component state

React routing

  • React router
  • Single routes
  • Multiple routes

Advanced Redux – Middleware

  • Async Actions
  • Logging
  • Crash reporting
  • Redux saga

Error Handing

  • Error boundaries
  • componentDidCatch

React Native – Mobile Development

  • Introduction
  • Setting environment
  • Main components
  • Components state & props
  • Basic styling
  • Layouts & Flexbox
  • Form components
  • Images & animation
  • Http based integration

Advanced React

  • Project structure
  • Some selected open-source supportive libraries
  • Best practices
  • Provider, Context 
תגיות