React online course. Development of complex client applications - free course from HTML Academy, training 9 weeks, Date October 15, 2023.

Section 1 Introduction to TypeScript
Let's consider the scheme of work on the course. Let's find out what TypeScript is and what problems it solves. Let's get acquainted with the type system and understand how the typing process occurs. Let's learn how to configure the compiler and look at the basic settings. Then let's move on to practice and understand the features of writing typed code: tuples, interfaces, generics, and so on.

Organizational matters.

Review of projects.
Scheme of work on the course.

Introduction to TypeScript.

What is TypeScript and what problems does it solve?
Type system.
How TypeScript code turns into JavaScript.
Infrastructure: compiler settings.
Annotations and automatic type inference.

Practice using TypeScript.

Typing of objects, arrays, functions.
Generics.
Tuples.
Interfaces, type aliases.

Section 2 React
Introduction to the React library. Let's find out what problems it solves and how it can simplify front-end development. Let's prepare the basis of the project using the Create React App (CRA) tool. Let's learn how to use templates for CRA. Then we will get acquainted with the main features of the React library (JSX, components, data transfer between components).

React.

What is React.
How does React work?
What problems does it solve effectively?
Virtual DOM.

Infrastructure.

Create React App.
TypeScript.

JSX

How is it different from HTML?
Basic working methods.

Component approach.

React components.
Props. Passing data through properties.
Composition.

Rendering components.

Rendering lists.
Conditional rendering.

Section 3 Routing (React Router)
Let's find out how routing is organized in SPA. Let's add React Router to the project and look at the package's capabilities: routes, redirects, private routes, and so on.

Routing in SPA.
History API.
Route, Link, Redirect components.
Route management.

Section 4 React components. Hooks
Let's expand our knowledge of React and components. Let's learn how to manage state, use events and life cycle methods of components. Let's get acquainted with React Hooks and learn how to replace class components with them. Let's learn how to work with forms.

State.
Unidirectional data flow.
Functional components, class components, PureComponent.
Introduction to React Hooks.

Life cycle methods.

React and forms.

Section 5 React and Patterns
Let's look at the question of what software architecture is and how to design it. Let's get acquainted and learn to apply design patterns in practice.

Design.

What is the difference between a good program and a bad one?
Why design software. Design goals.
Software architecture.
Design tools.

Design patterns.

What problems do patterns solve?
What does the pattern consist of?
Types of design patterns.

Patterns in React.

Stateless components.
Proxy components.
Higher-order components.
Render Props.
Provider.
React Hooks and patterns.

Section 6 State Management. Redux
Let's get acquainted with Flux architecture: Actions, Dispatchers, Views and Stores. We connect to the Redux project and update the code base.

Flux architecture.
Storage, dispatcher, actions.

Redux.

Middlewares.

Extending Redux functionality.

Section 7 Asynchrony in Redux
Let's learn how to implement asynchronous code into the synchronous operation of Redux using Middleware. Let's learn how to interact with the server using the Axios package. Let's get acquainted with interceptors.

Redux-thunk.

Axios.

Section 8 Performance Optimization
Let's discuss the performance of React applications: what features there are, what you should pay attention to when designing components in the first place. Then we'll take a look at the Redux Toolkit and learn how to use it to get rid of boilerplate code when working with Redux.

Component profiling.
Component update management.
Memoization.
Redux Toolkit.

Section 9 Testing React
Let's get acquainted with the tools and techniques for testing React applications. We will set up the testing infrastructure and write tests for the components.

Jest.
React Testing Library.

First week of defense
Completion of work on the project and preparation for the final defense.

Second week of defense
The first assessment of the project by the reviewing mentor according to quality criteria.

Third week of defense
Improving the project based on the comments of the reviewing mentor and submitting it for a second assessment.

Section 10 Final
Let's summarize the course and determine the further vector of studying React and its ecosystem. Then we'll discuss new React features expected in future releases.

Fourth week of defense
Making final edits and receiving a final grade.