Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Полный курс Front-end 2025. С 0 до результата. React TS RTK
Rating: 4.7 out of 5(6 ratings)
55 students

Полный курс Front-end 2025. С 0 до результата. React TS RTK

Научитесь фронтенд-разработке для реальных продакшен проектов. Осовите современный стек. React Redux TS RTK Query Antd
Created byArtur Kyu
Last updated 12/2024
Russian

What you'll learn

  • Научитесь фронтенд-разработке для реальных продакшен проектов
  • Освоение управления состоянием приложения с помощью Redux
  • Применение TypeScript для написания безопасного и типизированного кодаПрименение TypeScript для написания безопасного и типизированного кода
  • Реализация современных подходов к разработке Создание реального проекта
  • Изучение React и создание многостраничных пользовательских интерфейсов

Course content

1 section89 lectures36h 42m total length
  • Введение9:42
  • Vscode5:54
  • css37:53
  • Node.js13:37
  • Переменные17:56
  • Логические операторы16:35
  • Условия9:15
  • Объекты20:55
  • Объекты - 216:23
  • Функции18:49
  • Функции - 214:26
  • Функции - 322:35
  • Массивы - 119:15
  • Массивы - 222:14
  • Event. События10:34
  • React23:15
  • React. Рендер списка23:31
  • Props. Свойства компонентов17:17
  • Props -29:04
  • State. Состояние компонента20:01
  • Условный рендер17:14
  • Todo. Делаем список задач20:13
  • Добавление задачи20:36
  • Удаление задачи18:49
  • Уникальный идентификатор13:19
  • Чекбокс33:29
  • Редактирование туду32:32
  • Key32:05
  • Создаем магазин - 137:18
  • Фильтр31:35
  • Навбар35:01
  • Поиск по категории25:18
  • Добавление в избранное30:55
  • Добавление в избранное 220:22
  • Страница избранного(Router)37:29
  • Промисы26:58
  • Промисы - 2. SetIinterval26:58
  • Запросы на сервер. Fetch22:49
  • React hooks. useEffect25:40
  • fetch. loader17:48
  • Json Server19:14
  • Поиск на бэкенде16:33
  • Избранное на бэк24:57
  • Изранное - 221:03
  • Избранное - 332:39
  • Архитектура. Слои. UI BLL14:06
  • REDUX37:24
  • Redux Slice (counter)24:32
  • Redux Post slice14:05
  • Redux Async thunk31:47
  • Product slice29:17
  • Избранное через redux28:19
  • Рефакторинг19:40
  • Сортировка29:30
  • Иконка корзины26:29
  • Добавление в корзину34:54
  • Страница карзины товаров32:12
  • Корзина. Кол - во товаров28:48
  • Страница товара28:00
  • Рефактор. Избранное30:36
  • SCSS31:54
  • Комментарии товару. FORM. Ant Design.26:40
  • Комментарии. POST22:49
  • Списк комментариев20:43
  • Фильтр по цене24:29
  • Пагинация15:32
  • Search Params36:33
  • SearchParams - 237:19
  • React memo UseCallback. Оптимизация23:44
  • Lodash. Debounce21:43
  • Active Filters icon34:52
  • Лоадер Sceleton Antd12:41
  • TYPE SCRIPT34:27
  • Типизируем компоненты25:02
  • TS Redux25:47
  • TS Корзина товаров38:39
  • TS Избранное10:26
  • Modal Login39:23
  • Регистрация25:29
  • Регистрация - 219:15
  • Регистрация - 332:28
  • Регистрация - 439:28
  • Форма создания товара после логина34:50
  • Рефактор + селект брэнды19:31
  • Список брэндов20:39
  • RTK Query. Рефактор getBrands34:38
  • RTK Query Tags (Тэги)29:31
  • Git Github28:38
  • Git. Merge Request35:41

Requirements

  • ноутбук или компьютер

Description

Этот курс создан для тех, кто хочет освоить современные технологии фронтенд-разработки и научиться применять их на практике. Вы получите комплексные знания о React, Redux, TypeScript, SCSS, REST API и Ant Design, а также научитесь строить динамичные веб-приложения с нуля.


Чему вы научитесь на курсе:


  1. Основы и продвинутый Javascript:

    • Понимать синтаксис JavaScript: переменные, операторы, функции и циклы.

    • Различать и применять типы данных: строки, числа, массивы, объекты.

    • Создавать функции: объявленные, анонимные и стрелочные.

    • Применять spread и rest операторы для работы с объектами и массивами.

    • Понимать и использовать Promise, async/await.

    • Работать с методами fetch для взаимодействия с REST API.

  2. Основы и продвинутые возможности React:

    • Создавать компоненты и управлять их состоянием.

    • Работать с JSX и декларативным подходом к разработке.

    • Использовать хуки (useState, useEffect, useCallback и другие) для улучшения функциональности приложений.

    • Оптимизировать приложения с помощью React.memo и useCallback .

  3. Управление состоянием приложения с помощью Redux и Redux Toolkit:

    • Понимать концепции Redux: Store, Reducers, Actions.

    • Применять Redux Toolkit для упрощения работы с состоянием.

    • Использовать RTK Query для управления запросами к серверу и кэшированием данных.

  4. Использование TypeScript в фронтенд-разработке:

    • Описывать типы компонентов и их свойств.

    • Избегать ошибок благодаря статической типизации кода.

    • Интегрировать TypeScript в существующие проекты на React.

  5. Работа с REST API:

    • Отправлять HTTP-запросы для получения, создания, обновления и удаления данных.

    • Обрабатывать ответы сервера и обрабатывать ошибки.

    • Реализовывать пагинацию, фильтрацию и сортировку данных.

    • Использовать  Fetch API для взаимодействия с сервером.

  6. Стилизация приложений с помощью SCSS:

    • Создавать сложные и адаптивные стили с использованием вложений и миксинов.

    • Организовывать файлы стилей для крупных проектов.

    • Работать с переменными SCSS для унификации дизайна.

    • Оптимизировать стили с помощью функций и extend.

  7. Создание пользовательских интерфейсов с Ant Design:

    • Применять готовые компоненты для построения интерфейсов (кнопки, таблицы, модальные окна и т.д.).

    • Кастомизировать внешний вид компонентов Ant Design.

    • Интегрировать Ant Design с другими технологиями, такими как Redux и RTK Query.

  8. Реализация авторизации и защиты данных:

    • Создавать формы регистрации и входа с валидаторами.

    • Использовать API для аутентификации и управления пользователями.

  9. Организация архитектуры проектов:

    • Структурировать код и компоненты для масштабируемости.

    • Применять подходы "Container-Presenter" и "Feature Slices".

    • Использовать линтеры и форматирование для повышения качества кода.

  10. Разработка реальных проектов:

    • Разрабатывать сложные SPA-приложения с использованием всех изученных технологий.

    • Создавать проекты, которые можно включить в портфолио.

    • Решать практические задачи, которые часто встречаются в рабочей среде.

  11. Научитесь работать с Git и Github

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


Почему этот курс уникален:

  • Практическая направленность: каждый модуль включает проект или задачу.

  • Современные технологии и подходы, востребованные на рынке.

  • Простое объяснение сложных концепций.


Множество практических заданий и проектов позволят вам почувствовать себя настоящим разработчиком и подготовят к реальным рабочим задачамю

Who this course is for:

  • люди которые хотят изучать frontend/вэб разработку
  • начинающие разработчики