Курс по React
Этот онлайн-курс посвящён профессиональной разработке веб-приложений с помощью React.
О курсе
Современные веб-приложения — это не просто набор страниц. Это сложные клиентские системы со множеством состояний, асинхронными запросами, навигацией и бизнес-логикой. Когда интерфейсы усложняются, а данные становятся всё более динамичными, управление состоянием и обновление DOM превращаются в настоящую боль.
React появился как решение этой проблемы: он предлагает декларативный способ описания пользовательского интерфейса и берёт на себя всю сложную логику обновления DOM. Но React — это не просто библиотека для UI. Это полноценная экосистема, и в этом курсе мы разберёмся, как использовать её возможности для создания современного production-приложения.
На курсе мы с нуля создадим современное SPA, используя React, и в процессе разберемся в самой библиотеке. Мы изучим основы и базовые принципы, а затем перейдем к продвинутым техникам React. Научимся работать с данными в приложении и выполнять ассинхронную логику для запросов в бекенд, построим полноценный роутинг в приложении и разберем оптимизации и паттерны, которые используются в React. Мы изучим, как устроен рендеринг React "под капотом", и научимся эффективно его использовать, а не просто писать компоненты.
Курс состоит из 4-ех блоков:
- React база.
- Работа с данными в приложении. State managers. Запросы в бекенд.
- Роутинг.
- Продвинутый React. Оптимизации и паттерны.
Детали программы смотрите далее.
Как организовано обучение?
Курс идёт 1.5 месяца.
До начала обучения: вводные материалы
Мы будем использовать систему Git/GitHub для обмена исходным кодом, так делает большинство проектов. Для тех, кому это в новинку - дадим крэш-курс и поможем разобраться.
Онлайн-занятия с преподавателем 2 раза в неделю
Занятие проходит в формате вебинара. Запись занятия доступна через 15 минут после окончания. Вы также сохраняете доступ к записям после окончания курса.
Каждое занятие идёт примерно 1.5 часа.
Домашние задания, обратная связь по ним
Ваши решения присылаете преподавателю, он проверяет качество кода, использование правильных приёмов проектирования, даёт обратную связь.
Чат
Между занятиями доступен групповой чат для общения и вопросов преподавателю.
Курсовой проект
На этом курсе мы делаем курсовой проект: сервис заказа еды из разных ресторанов. Код для проекта вы напишете сами.
Результат
Вы знаете, понимаете и умеете использовать основные продвинутые идеи React.
Вы умеете строить современное приложение с помощью React.
Вы знаете в каком направлении развиваться и на какие элементы инфраструктуры React стоит обратить внимание.
Сертификат
По окончанию курсов вы получаете сертификат в электронном виде на русском и английском языках.
Хотя сертификатам в нашей профессии обычно не придают значения. Главное - знания и умения, которые вы получите, если будете полноценно участвовать в курсе.
Программа курса
Программа может быть дополнительно адаптирована под темп обучения и вопросы группы.
Блок 1
Создание React-приложений
- Что такое React и зачем он нам?
- Способы создания React приложения.
- Элементы - основные строительные блоки.
- Учимся использовать функциональные компоненты.
- Что такое хуки и зачем они нам? Правила их использования.
- Разбор встроенных хуков: useState, useEffect, useReducer, useRef, useCallback, useMemo и тд.
- Кастомные хуки.
- Базовая теория рендеринга.
- Работа с формами.
- Работа со стилями (ccs modules).
- Модальные окна, использование Portal.
Блок 2
Работа с данными в приложении.
- Способы организации данных в приложении.
- Встроенный механизм Context.
- Какую проблему решают state managers?
- Как работает Redux.
- Учимся проектировать слой данных с Redux.
- Подключаем Redux Toolkit в наше приложение.
- Загружаем данные с сервера, подключаем thunk.
- Разбираемся с RTK Query.
Блок 3
Одностраничные приложения и роутинг
- Разбираемся с понятием роутинга в SPA.
- Учимся организовывать статичные роуты, динамичные, вложенные и т.п при помощи React router.
- Учимся выполнять навигацию, редиректить.
- Разбираем работу с состоянием роута - параметры пути, квери параметры.
Блок 4
Оптимизации
- Детально разбираем логику рендеринга в React, погружаемся в работу Fiber.
- Учимся оптимизировать рендеринг в React.
- Рассматриваем различные паттерны и подходы в React.
- Разбор Suspense. lazy/dynamic иморты.
- Оптимизируем получение данных и работу с ними.
Курсовой проект
Сервис выбора ресторана и заказа еды, построенный с помощью React + Redux + React router + Vite
Преподаватель
Более 10 лет занимаюсь программированием, преимущественно frontend-разработкой около 5 лет.
Сейчас разработчик интерфейсов в Кинопоиске – стриминговом сервисе с еженедельной аудиторией в 8M пользователей. Наш основной стек – React, Next, GraphQL, TypeScript. Также являюсь лектором и ментором в Яндексе.
Что говорят о курсе участники?
Мы занимаемся обучением с 2007 года. За это время у нас обучились тысячи разработчиков из разных стран и компаний.
Все отзывы являются честными. Мы не модерируем их.
Курс регулярно обновляется. Все отзывы относятся к последней версии курса.
Гарантия
- Если объяснения будут вам непонятны
- Если курсы не дадут вам новых знаний и умений
- Если вы не сможете подключиться к системе онлайн-обучения
…то вы сможете получить деньги назад.
Для этого достаточно не позже окончания первой недели курса написать, что именно вас не устраивает, и тогда ваше участие будет прекращено, а вы получите деньги обратно.
Для компаний
У нас большой опыт работы с самыми разными компаниями: как маленькими, так и IT-гигантами.
- При записи нужно выбрать способ оплаты "счёт на компанию", и документы будут автоматически сгенерированы: договор, акт и счёт, есть лицензия.
- Для зарубежных компаний выдаём инвойс на английском языке.
Физическим лицам даём справку об оплате, если нужна компании для компенсации расходов и документы для налогового вычета: детали для РФ.
Запись на курс
Если остались вопросы – посмотрите в часто задаваемых, напишите на почту help@javascript.ru (ответ обычно в течение дня), а если срочно — задайте по телефону +7-903-5419441.
Комментарии
<code>, для нескольких строк кода — тег<pre>, если больше 10 строк — ссылку на песочницу (plnkr, JSBin, codepen…)