Duration: 5 days – 35 hrs.
Overview
React is a widely-used library for creating single page applications in JavaScript and HTML. It is used by companies such as Facebook, Instagram, Netflix and other social medias platform.
This training course aimed at developers who wish to use the NodeJS, ReactJs, Redux to build dynamic, high-performance, and scalable web development applications.
Objectives
- Set up the necessary development environment that integrates NodeJs, React, and Redux.
- Learn how to build REST APIs with NodeJs.
- Learn how to design interactive applications with React + Redux.
- Format of the Course
- Interactive lecture and discussion.
- Lots of exercises and practice.
- Hands-on implementation in a live-lab environment.
Audience
- Developers
Pre- requisites
- Basic knowledge HTML, JavaScript, CSS
Course Content
Modern JavaScript
- developing using node.js and npm
- JavaScript versions
- working with modules
- functions and arrow functions
- classes
- functional programming in JavaScript (map, filter, …)
TypeScript
- static vs dynamic typing
- declaring types of variables, functions and classes
- basic data types
- tuples, objects
- interfaces
- generics
React template language
- JavaScript-based template language: JSX
- setting element properties
- repeating elements
- if / else
- events
- CSS classes and styles
Managing state in React
- setting and changing the application state
- using the state hook and setState
- capturing the content of input elements in the state
Components: Building blocks of modern web applications
- defining custom HTML tags in React
- state, props & events
- data flow between components
- function components and class components
- using hooks in function components
- component lifecycle events (mount, update, unmount)
- including predefined components from a library
State management with Redux
- Redux basics: state mangment with pure functions, reducers and immutable data
- using the reducer hook in React
- integrating Redux into a React application
- presentational and container components
- the Redux ecosystem
- handling asynchronous events with Thunk
- fetching data from a REST API
Developer tools and testing
- React developer tools
- Redux developer tools
- Testing JavaScript with Jest
- Testing reducers
- Testing React components
React Router
- client-side routing
- displaying different views based on the current browser route
Server-Side JavaScript (NodeJS) is introduced and depended
- Design Fundamentals
- Module system
- Flow Control Patterns
- Coding with Streaming
- Design Patterns
- Wiring Modules
- Recipes and Scalability Architectural Patterns
- Data Serialization and Streams
- Network Paradigms