Fullstack JavaScript developer - course RUB 59,200. from Innopolis University, training 4 months

I. Introductory. Toolkit, git, project setup

In the first block, we will provide all course participants with a set of tools necessary to progress through the topics. Individual installation consultations will be held, during which we will determine individual goals for the course, based on your personal development experience. As a result of this block, you will learn how to independently configure the assembly of an SPA application with any CSS preprocessor using webpack. And also get a basic understanding of the Typescript language and the features of its configuration and use.

— In the first lesson we will show you the necessary set of tools, how to install and configure them. You'll learn how to set up a React project build from scratch.

— Get acquainted with the basics of the Typescript language and its differences from JavaScript.

II. React

During the second block, teams will be formed, consultations will switch to team meetings. At such meetings, we will decide on the project, form a set of functionality, which will be our goal for the course. You will develop layouts and by the end of the block you will have laid out all the pages of the team project in React.

— Let's get acquainted with the history of the emergence of web frameworks, discuss the advantages and disadvantages of React, and begin to develop the first components in React.

— Let's study the best practices for organizing the structure of a React application. Let's dive into the details of rendering React components. Let's start using the modern CSS-IN-JS approach to styling React components based on styled-components.

— Let's learn how to work correctly with the main components of React components - Props and State, which will help add flexibility to the components. Let's figure out the correct method of interacting with DOM elements from React components.

— Let’s continue to study the React API, look at ways to interact with child components, and learn how to avoid the problem of endless props props using context. Let's take a look at an alternative approach to expanding the capabilities of a React component.

— Let’s analyze the life cycle of a component, understand how to implement it, which will allow us to enrich components with new types of logic.

— Let’s understand how React was able to completely move away from class components towards functional ones using the new Hooks pattern. Let's get acquainted with the basic hooks of React.

— We’ll find out exactly how switching between pages works without reloading, and also implement React-Router into the work.

— Let's learn how to develop multilingual React applications.

— Let's look at ways to introduce flexibility in interface styling, working with themes (for example, light/dark), working with icons and animations using lotty as an example.

III. Nodejs

In this step, you will implement your server in Node.js using the Express.js library. Implementing an API for a team project. Learn to work in the postman program. Learn the basics of using a docker image using the example of working with the Mongodb database.

— Introduction to Node.js, its history and the basics of the package manager.

— Find out how Node.js works with files, how modules are created and published, and get acquainted with the features of this process.

— Learn to build a server on Node.js using the Express.js framework.

— Continuing to study the features of the server on Express.js.

IV. Redux

After completing this block, you will understand how interaction with the backend API occurs in a modern React application. Learn to develop and administer stub stubs for local development, learn how to make a configurable microfrontend application to work with a real server.

— To gain an in-depth understanding of how the Redux state manager works, let’s write our own version and understand the basics of using Redux.

— Let's see in practice how and why Redux is used in its classic form.

— Master the use and understand the concept of selectors with and without hooks.

— Based on previous knowledge, let's consider a more modern use of Redux thanks to the @reduxjs/toolkit library.

— Let's understand the intricacies of working with the server and the place of Redux in this process.

V. Jest

In this block, we will explore how and why to test a web application. You will learn how to test your application and increase your code test coverage to the industry standard of 80%. You will learn the principles of application testing using the Jest library as an example.

— Let's talk about why you need to write tests at all and how to do it quickly and efficiently.

— Master setting up the Jest test framework from scratch.

— Continuation of the previous topic with a focus on Unit testing.

— You will see how to add UI tests to the project.

VI. Single Page Application

In this block, we will explore technologies that will be used in all modern web applications and become available after the removal of support from Internet Explorer. This happened on June 15, 2022.

— Let's get acquainted with the idea of ​​a single-page application.

— Let's find out how to write your own component library.

— Let's master multithreading on Node.js.

— Let's write a chat on a web socket. You will hack it with your own hands in class, and also learn how to defend against such attacks.

— Let's look at creating your own video chat for two.

— Let's get acquainted with the basics of setting up a server on Nginx and balancing. We will also learn how to connect search engines with our SPA application.

Defense of the final project