Продвинутая Frontend архитектура для React, Vue, Next, Nuxt, Angular и Svelte приложений Чему вы научитесь? После прохождения курса вы сможете: Создавать удобную и расширяемую структуру проекта Писать легкопереиспользуемый код Разделять ответственность между компонентами Мигрировать проекты на FSD Избегать циклические зависимости Применять FSD в проектах на любом фреймворке Правильно разбивать проект на слои Верно определять доменные области проекта Использовать инструменты FSD для поддержки структуры Минимальные требования: Знание любого frontend фреймворка Курс подойдёт frontend разработчикам любого уровня подготовки. При этом мы на практике разберём как можно работать с FSD не только с React, но и Next, Vue, Nuxt, Angular и даже Svelte. Мы начнём изучение разбора того, что такое FSD и как он помогает лучше структурировать наши проекты, что такое слои, слайсы и сегменты. Далее мы будем разбирать каждый слой, применяя на практике знания и создавая скелет для большого проекта. Мы разберём инструменты, которые позволят вам удобнее и быстрее структурировать ваши проекты по FSD и контролировать изменения. Мы напрямую на макетах будем размечать различные слои, чтобы потренироваться в декомпозиции. А уже под конец курса мы посмотрим как можно использовать FSD с различными фреймворками, как Next, Vue, Nuxt, Angular и Svelte. Курс будет максимально практическим, так как изучив каждый из слоев или сегментов мы сразу же будем применять их практике, создавая приложение. План курса Курс построен таким образом, чтобы доносить материал от простого к сложному. Ниже вы можете ознакомиться с планом курса и посмотреть часть открытых лекций по кнопке проигрывателя. 1. Введение 1.1 Почему FSD 1.2 Как устроен курс 1.3 Обзор проекта 2. Настройка окружения 2.1 Настройка окружения 2.2 Настройка VSCode 2.3 Установка Node 2.4 О работе NVM 2.5 Figma компоненты 3. Введение в FDS 3.1 Что такое FSD 3.2 Layers 3.3 Slices 3.4 Segments 4. Pages и App 4.1 О слое App 4.2 Старт проекта 4.3 Подготовка слоя App 4.4 Обзор проекта 4.5 О слое Pages 4.6 Структура роутинга 4.7 Выделение slice 4.8 Создание первой страницы 4.9 Добавление стилей 4.10 Layout 5. Shared 5.1 О слое 5.2 Константы маршрутов 5.3 Конфигурации 5.4 API клиент 5.5 Библиотека 5.6 UI компоненты 5.7 Импорты в Shared 5.8 Что ниже Shared 6. Инструменты FSD 6.1 Steiger 6.2 Path Alias 6.3 Tree-shaking 6.4 CLI 6.5 Расширения 7. Entities 7.1 О слое 7.2 Создание slices 7.3 State managment 7.4 API 7.5 UI компоненты 7.6 Упражнение - Выделение entities 7.7 Кросс-импорты 8. Features 8.1 О слое 8.2 Примеры feature 8.3 Специфичность в СSS 8.4 Упражнение - Выделение features 8.5 Упражнение - Разметка страниц 9. Widgets 9.1 О слое 9.2 Примеры Widget 9.3 Processes 9.4 Упражнение - Выделение виджетов 9.5 Упражнение - Финал декомпозиции 10. Работа с фреймворками 10.1 Next 10.2 Vue 10.3 Nuxt 10.4 Angular 10.5 Sveltkit 10.6 Миграция проектов 10.8 Отзыв о курсе Автор курса: Антон Ларичев Основатель PurpleSchool Занимаюсь разработкой уже более 14 лет и имею большой опыт: JavaScript, TypeScript, Php, Go, C#, Swift и Python. Активно внедряю гибкие методологии разработки в компании и внутренние обучения для команд. Тариф Самостоятельный Уроки и упражнения Обратите внимание: Домашние задания, Ai-тренажеры, Поддержка наставника, Практика в студии - в данный тариф не входят.
