Разработка курса «React разработчик» | OTUS
Новогодняя распродажа!
Все курсы со скидкой 30%. Торопитесь!
Подробнее

Курсы

Курсы в разработке Подготовительные курсы
+7 499 110-61-65

React разработчик

Что даст вам этот курс
8
0

Разработка клиентской части приложения с React, Redux, Redux-Saga, Appolo



Что даст вам этот курс
- Глубокие знания React и паттернов;
- Опыта тестирования redux и side effects;
- Понимание подходов функционального программирования и их применение в React;
- Использование TypeScript, Ramda, Styled Components, React Router.

React является самым популярным JS-фреймворком количество вакансий на который ежегодно растет, как и его популярность. В процессе курса вы научитесь создавать SPA-приложения и оптимизировать их для production, научитесь писать чистый и лаконичный код с TypeScript, разберете как работает под капотом Webpack и Babel;

За 4 месяца вы научитесь:
- Разрабатывать клиентскую часть приложения любой сложности;
- Получите опыт SSR с использованием Next.js;
- Использовать основные принципы функционального программирования и начнете их применять на практике;
- Писать понятный и легкий код на TypeScript;
- Использовать и тестировать Redux-Saga на продвинутом уровне;

Для кого этот курс:
- Forntend-разработчики на JS;
- Backend разработчики, желающие освоить React;
- HTML/CSS верстальщики со знанием JS;
Преподаватель
Никита Овчинников
Окончил Волгоградский государственный технический университет по специальности «Автоматизированные системы обработки информации и управления». Увлёкся программированием ещё в студенческие годы (в 2010 году) и остановиться так и не смог. В коммерческой разработке с 2012 года.
Работал с проектами разного масштаба, прошёл путь от Junior до Senior. С 2016 года — старший инженер-программист в EPAM Systems, с 2018 по май 2019 — технический руководитель по разработке софта в Skywind Group.
Участвовал в международном проекте компании Ericsson, занимался web-программированием и собственными проектами.
Является специалистом по архитектуре веб-приложений, хорошо знает JS/NodeJS, Mongo, MySQL, фреймворки Express, Koa2, React, AngularJS. Уверен, что в программировании всё приходит с практикой.

Преподаватель
Никита Овчинников
Окончил Волгоградский государственный технический университет по специальности «Автоматизированные системы обработки информации и управления». Увлёкся программированием ещё в студенческие годы (в 2010 году) и остановиться так и не смог. В коммерческой разработке с 2012 года.
Работал с проектами разного масштаба, прошёл путь от Junior до Senior. С 2016 года — старший инженер-программист в EPAM Systems, с 2018 по май 2019 — технический руководитель по разработке софта в Skywind Group.
Участвовал в международном проекте компании Ericsson, занимался web-программированием и собственными проектами.
Является специалистом по архитектуре веб-приложений, хорошо знает JS/NodeJS, Mongo, MySQL, фреймворки Express, Koa2, React, AngularJS. Уверен, что в программировании всё приходит с практикой.

Программа обучения
Модуль 1
React basic
Модуль 2
Redux и стейт приложения
Модуль 3
React и процесс реальной разработки приложения
Модуль 4
Проектный модуль
React basic
Оценить модуль
2
0
Тема 1: Webpack и Babel
ecma TC39;
Рассмотрим как в стандарт попадают новые возможности языка;
Знакомство с транспиляцией;
Babel 7;
Типовая конфигурация для Typescript;
Что такое Webpack;
Базовая настройка Webpack;
Установка и настройка Jest;
Что такое TDD и BDD;
Big O notation;
Тема 2: Установка и настройка React
сможете с нуля установить и настроить проект ReactJS с использованием create-react-app (CRA), либо конфигурируя приложения используя webpack + babel.
Установка и настройка Storybook.
Eslint, Typescript typechecker.
Precommit hooks.
Тема 3: JSX как основа ReactJS. Functional components
что такое JSX, почему завоевал такую большую популярность.
Во что превращается JSX?
JSX props, типы данных для props.
Проверка типов с помощью PropTypes и Typescript.
Разрабатываем сложный компонент с использованием Storybook, добавляем knobs.
Добавляем unit тесты для сложного компонента.
Тема 4: JSX + CSS
атрибут className.
BEM, CSS modules, CSS preprocessors.
CSS-in-JS.
Webpack и Babel - настройки для работы со стилями.
Добавляем стили в наш сложный компонент.
Учимся тестировать стили с помощью Jest.
Тема 5: Component lifecycle
что такое React state?
Как использовать state компонентов?
Как работает vDOM и перерисовка контента?
Жизненный цикл компонентов, Lifecycle hooks.
Presentational and Container Components (smart/dumb componets).
Разбираем, как написать тест к компоненту с lifecycle.
Разрабатываем компонент с жизненным циклом и покрываем его тестами.
Тема 6: Списки, события, формы
list and keys.
Управление событиями в приложении.
Работа с формами в приложении.
React refs.
Тема 7: React patterns часть 1
function component;
Destructuring props;
JSX spread attributes;
Merge destructured props with other values;
Conditional rendering;
Children types;
Array as children;
Function as children;
Render prop;
Children pass-through;
Proxy component;
Style component;
Тема 8: React patterns часть 2
разберем продвинутые паттерны, которые часто встречаются на практике:
-Event switch;
-Layout component;
-Container component;
-Higher-order component;
-State hoisting;
-Controlled input;
Что такое регрессия? Как в борьбе с регрессией помогут тесты
Тема 9: React-hooks
какие изменения произошли в 16 версии.
React Fiber;
React hooks;
Тема 10: React router
что такое роутинг в приложении?
HTML5 history API;
React router;
Подводим итоги;
Redux и стейт приложения
Оценить модуль
1
0
Тема 1: Основы функционального программирования
pure Functions;
Currying (каррирование);
Composing (композиция);
Signatures (сигнатуры типов);
ramdaJs;
Тема 2: Основные концепты Redux
immutability, Actions, Reducers, Store.
Тема 3: Redux actions
redux-Actions и как это упрощает работу.
Тестирование Redux - что нужно тестировать и как.
Тема 4: Redux middlewares and side effects
что такое side-effect?
Redux middlwares;
Redux debbug tools;
Redux thunk;
Тестирование side-effects;
Тема 5: React + redux
как работать с Redux в React приложении.
Memoization and Reselect.
Покрываем тестами connect
Тема 6: Redux-saga intro
jS Generators;
Основные концепты Redux-Saga - call, put, takeEvery;
Покрываем тестами простую сагу;
Тема 7: Redux-saga basic concepts
saga Helpers;
Declarative Effects;
Dispatching actions;
Обработка ошибок;
Тема 8: Redux-saga advanced concept
управление потоками эффектов (non- blocking, parralell, race);
Композиция saga;
Task cancellation;
Fork model;
Channels;
Тема 9: Redux-saga и интеграционное тестирование
что такое интеграционное тестирование?
Как встроить в приложение процесс интеграционного тестирования?
redux-saga-test-plan.
React и процесс реальной разработки приложения
Оценить модуль
1
0
Тема 1: Архитектура React приложения
библиотека презентационных компонентов.
Архитектура ducks.
Модули в приложении.
Тема 2: Процесс разработки React приложения
что представляет из себя процесс разработки приложения?
Git flow и разработка приложения;
Проектирования структуры компонентов;
Шаги для разработки новой фичи в соответствии с TDD;
Тема 3: Продвинутая конфигурация приложения
dev/Prod config;
Что такое процесс сборки приложения?
CDN, Nginx;
Server side rendering (SSR) простая конфигурация;
Обзор Next.js;
Тема 4: Test quality tools
test coverage;
Как правильно писать тесты?
Теория хауса и мутабельное тестирование;
Stryker;
Тема 5: GraphQL
что такое REST?
Основы GraphQL;
Queries and Mutations;
Schemas and Types;
Validation;
Тема 6: Appolo basic
другой взгляд на state management в приложении;
Queries;
Mutations;
Local state management;
Subscriptions;
Pagination;
Тема 7: Appolo advanced
appolo cache;
Testing React components;
Apollo with TypeScript;
Developer tools;
Appolo and SSR;
Проектный модуль
Оценить модуль
0
0
Тема 1: Консультация по проекту
Оценить занятие
0
0
Тема 2: Защита проектов
Оценить занятие
0
0
Опрос о программе "React разработчик"

При запуске нового курса нам очень важно оценивать качество и актуальность предлагаемой программы на этапе идеи и концепции модулей, поэтому мы будем очень рады и благодарны вашим ответам, экспертным оценкам и комментариям.

Вопрос №1 из 8
Выберите один вариант ответа
Опишите свой опыт в React
Вопрос №2 из 8
Выберите один или несколько вариантов ответа
Знаете ли вы какой-либо из перечисленных фреймворков:
Вопрос №3 из 8
Выберите один вариант ответа
Есть ли в программе темы, которые вам не интересны?
Вопрос №4 из 8
Выберите один вариант ответа
Оцените актуальность программы (в баллах от 1 "неактуально" до 10 "полностью актуальна")
Вопрос №5 из 8
Выберите один вариант ответа
Ваша специализация:
Вопрос №6 из 8
Телефон/телеграм для дополнительных вопросов
Вопрос №7 из 8
Удобное время для связи
Вопрос №8 из 8
Комментарии и предложения - мы всегда им рады!

Оставьте хотя бы один ответ для участия в опросе