Чему вы научитесь
- Строить SPA на React с маршрутизацией, layout-структурой и защитой приватных страниц
- Работать с серверным API через axios и TanStack Query
- Реализовывать регистрацию, вход, выход и хранение сессии пользователя.
- Создавать каталог товаров с пагинацией, карточками, страницей товара и загрузкой изображений
- Делать поиск и фильтрацию товаров по тексту, категории и цене
- Собрать личный кабинет пользователя со сменой пароля и историей действий
- Проектировать интерфейс для поддержки: список обращений, переписку, создание новых тикетов, отметку прочитанного и закрытие диалогов
- Реализовывать админские сценарии: управление пользователями, товарами и обращениями
- Использовать формы, валидацию и модальные окна для удобных пользовательских сценариев
- Организовывать код по сущностям, фичам, виджетам и страницам, чтобы проект было проще масштабировать
О курсе
Практический курс по созданию клиентского приложения для маркетплейса на React, TypeScript и Vite: от авторизации и каталога товаров до личного кабинета, админ-панели и переписки пользователей
Для кого этот курс
- Для начинающих и продолжающих frontend-разработчиков, которые хотят собрать сложное приложение на React не только по учебным примерам, но и на основе реального продуктового сценария
- Для тех, кто уже знает основы JavaScript или TypeScript, но хочет научиться работать с API, формами, роутингом, кэшем запросов и ролями пользователей
- Для студентов и junior-разработчиков, которым нужен сильный проект в портфолио
- Для тех, кто делает личные кабинеты, каталоги, маркетплейсы, CRM-подобные интерфейсы или административные панели
- Для разработчиков, которым важно понять, как строится клиентская часть сервиса с разными сценариями для пользователя и администратора
Начальные требования
- Базовое понимание JavaScript/TypeScript или основ программирования на любом ЯП
- Знакомство с HTML и CSS
- Желательно уметь читать TypeScript-код, но глубокая экспертиза не требуется
- Полезно знать основы React: компоненты, props, state, hooks
- Желательно понимать, что такое REST API и запросы
Преподаватели курса
1 621
Как проходит обучение
Курс построен по практическому принципу: сначала вы смотрите скринкаст с пошаговой реализацией, затем читает текстовую лекцию по этому же блоку, после чего закрепляет материал тестом и пишете код
Внутри курса:
- поэтапная сборка проекта;
- реализация экранов и компонентов;
- работа с формами, запросами и состоянием;
- настройка роутинга и защиты маршрутов;
- обработка загрузки, ошибок и пустых состояний;
- самостоятельные задания с отдельным техническим заданием;
- сдача задания на персональную проверку через code review.
Что вы получите
- Практический опыт разработки современного frontend-приложения.
- Навык работы с реальными пользовательскими сценариями: каталог, профиль, поддержка, админ-панель.
- Понимание, как связывать React-приложение с API и организовывать клиентскую архитектуру.
- Опыт разработки форм, фильтров, модальных окон, списков, деталей и CRUD-сценариев.
- Проект, который можно доработать и добавить в портфолио.
- Проверку самостоятельной работы и обратную связь в формате код-ревью.
- Материал, который закрепляет теорию практикой и помогает перейти от отдельных компонентов к цельному продукту.
- В курсе вы поработаете с React, TypeScript и Vite, научитесь использовать React Router для маршрутизации, TanStack Query для работы с серверным состоянием, Axios для HTTP-запросов, React Hook Form и Zod для форм и валидации, а также Bootstrap и React-Bootstrap для интерфейса. Дополнительно в проекте используется react-hot-toast для уведомлений, поэтому курс охватывает и прикладную работу с пользовательским UX на уровне готового продукта.