В подборке 12 материалов. Цены — от 99 до 1992 ₽. Фильмотека на React стоит 236 ₽, курс по Zustand — 500 ₽, программа Александра Ламкова — 1992 ₽. Материал о сайте с несколькими продавцами на Next.js стоит 99 ₽. Начинайте с компонентов и состояния, затем выбирайте учебный проект. В курсах с обозначенной версией, например Next.js 14, ориентируйтесь на среду из программы.
Компоненты, состояние и первые приложения
Общую программу выбирайте по своему опыту. У Александра Ламкова 22 урока: JSX, props, state, события, формы, хуки, API и итоговый проект. Курс Vassilyi Gudomarov обозначен как React 19; в заявленных результатах есть Redux Toolkit, маршрутизация и анимации, но точное оглавление не опубликовано. Интенсив Дмитрия Лаврика адресован программистам и сосредоточен на компонентном подходе и задачах фронтенда. Для него карточка тоже не даёт подробного расписания, поэтому число занятий не следует предполагать.
Александр Ламков проводит через 22 урока: от JSX, props и state до форм, API, хуков и итогового проекта. Есть React Router, Context API, оптимизация производительности и развёртывание приложения.
Версия React 19 обозначена в названии курса Vassilyi Gudomarov. Среди заявленных навыков — Redux Toolkit, маршрутизация, анимации и адаптация интерфейсов; подробное оглавление в карточке не приведено.
Интенсив Дмитрия Лаврика предназначен для программистов, осваивающих React. Заявлены компонентный подход, создание фронтенд-приложений и прикладные задачи JavaScript-разработки; точного расписания занятий нет.
Практика хуков, событий и запросов к API
Следующий материал удобно выбирать по небольшому результату. В курсе Anton Golosnichenko по хукам создаётся собственная библиотека, в том числе useInput, useTabs и useNetwork, с публикацией в NPM. У Oleksandr Kocherhin учебный проект — Quiz: компоненты, состояние, пользовательские события, API и развёртывание. Фильмотека Anton Golosnichenko знакомит с Axios, React Router и публикацией на GitHub Pages. Для практики достаточно одного проекта, а курс по хукам можно добавить, когда потребуется повторно использовать логику.
На практике создаётся библиотека собственных хуков: useInput, useTabs, useTitle, useNetwork и другие. Anton Golosnichenko включает работу с DOM и сетевыми событиями, а также публикацию библиотеки в NPM.
Учебный Quiz у Oleksandr Kocherhin помогает разобрать компоненты, состояние и пользовательские события на одном приложении. Далее идут взаимодействие с API, оптимизация перерисовки и развёртывание на сервере.
Фильмотека Anton Golosnichenko строится с получением данных через Axios и переходами через React Router. В программе встречаются функциональные и классовые компоненты; готовый проект публикуется на GitHub Pages.
Управление состоянием и архитектура SPA
Здесь собраны материалы с разной глубиной работы. Курс Антона Ларичева по Zustand охватывает создание хранилища, асинхронные запросы, сохранение состояния и предотвращение лишних перерисовок. Михаил Непомнящий разбирает Redux, react-redux, thunk и Redux Toolkit, включая asyncThunk. В React Level 2 Дмитрия Лаврика задачи шире: сервисы, HTTP-ошибки, TypeScript, MobX, авторизация, SSR и тестирование. Выбирайте Zustand или Redux по используемому хранилищу, а продвинутый курс — для пересмотра устройства целого приложения.
Антон Ларичев разбирает Zustand на примерах списка задач и запросов к API. В программе есть persist, сброс состояния, Slice-паттерн, собственные хранилища и предотвращение лишних перерисовок.
Михаил Непомнящий сопоставляет базовый Redux с Redux Toolkit. Есть хуки react-redux, прежний способ подключения через connect, асинхронные действия с thunk и asyncThunk, варианты структуры приложения.
React Level 2 Дмитрия Лаврика посвящён развитию готового SPA. Разбираются HTTP-ошибки, сервисы, TypeScript, MobX, авторизация, SSR на Node.js и Express, а также тесты с Vitest и Testing Library.
Типизация, серверный рендеринг и крупные проекты
Программа «React. Разработка сложных клиентских приложений» объединяет TypeScript, Vite, приватные маршруты, Redux Toolkit, Axios и тесты компонентов. Курс Антона Ларичева по Next.js 14 строится вокруг приложения с рейтингами: App Router, SSR, статическая генерация, формы, CSS Grid и настройка проекта. У Mohamed Hajji другая практика — сайт с несколькими продавцами, товарными страницами, корзиной и оформлением заказа. Выбирайте по нужному устройству приложения и сверяйте версии библиотек с конкретным материалом.
Девять разделов соединяют TypeScript, React, маршрутизацию и архитектуру приложения. В программе указаны Vite, Redux Toolkit, запросы через Axios и unit-тестирование компонентов; имя автора в карточке не приведено.
Антон Ларичев использует Next.js 14 для разработки приложения с рейтингами. Восемь модулей охватывают React Hooks, App Router, SSR, статическую генерацию, TypeScript, формы и вёрстку на CSS Grid.
На сайте с несколькими продавцами Mohamed Hajji показывает товарные страницы, панели администратора и продавца, корзину и оформление заказа. Программа на Next.js включает расчёт доставки и развёртывание.
Как составить маршрут занятий
- Если React ещё не использовали, начните с 22 уроков Александра Ламкова. Разберите JSX, передачу props и локальное состояние, затем выполните задания с событиями и формами. Для знакомства с библиотекой при опыте программирования можно выбрать интенсив Дмитрия Лаврика.
- Соберите один небольшой проект: Quiz или фильмотеку. Проверьте, что понимаете, где хранится состояние, как компонент получает данные и что происходит после пользовательского события. Повторите этапы взаимодействия с API и развёртывания, указанные в выбранной программе.
- Когда появляется повторяющаяся логика, изучите хуки на практике. Для общего состояния нескольких компонентов выберите Zustand или Redux. Сначала реализуйте небольшой пример с данными, затем добавляйте асинхронные действия и сохранение состояния.
- Для типизации и тестирования переходите к разработке сложных клиентских приложений. Если хотите подробнее разобрать сервисы, обработку HTTP-ошибок, MobX и собственный SSR, выбирайте React Level 2 после базовых тем.
- Для практики Next.js возьмите курс с Next.js 14 и TypeScript и соберите приложение с рейтингами. Если нужен пример электронной торговли, используйте сайт с несколькими продавцами: последовательно разберите товар, корзину, оформление заказа и развёртывание.
