Прокачай свои навыки с тарифом «Самостоятельный» от PurpleSchool!

Продвинутая Frontend архитектура для вашего успеха

Откройте для себя мир передовых практик разработки с нашим курсом по Frontend архитектуре, который идеально подходит для React, Vue, Next, Nuxt, Angular и Svelte приложений.

Чему вы научитесь?

• Создавать удобную и расширяемую структуру вашего проекта
• Писать легкопереиспользуемый код, который сэкономит ваше время
• Разделять ответственность между компонентами для повышения эффективности
• Мигрировать ваши проекты на FSD, чтобы улучшить архитектуру
• Избегать циклические зависимости, которые усложняют развитие
• Применять FSD в проектах на любом фреймворке
• Правильно разбивать проект на слои для лучшей управляемости
• Верно определять доменные области проекта, чтобы избежать путаницы
• Использовать инструменты FSD для поддержки структуры и контроля изменений

Наш курс подходит для frontend разработчиков любого уровня подготовки. Вы получите практические навыки работы с FSD не только на React, но и на Next, Vue, Nuxt, Angular и даже Svelte.

На занятиях мы погрузимся в детали того, что такое FSD и как он помогает лучше структурировать проекты. Мы изучим слои, слайсы и сегменты, а затем применим знания на практике, создавая каркас для крупного проекта.

План курса

Курс организован от простого к сложному, что позволит вам легко усваивать материал. Вот краткий план:

1. Введение
   • Почему FSD
   • Как устроен курс
   • Обзор проекта
2. Настройка окружения
   • Настройка окружения
   • Настройка VSCode
   • Установка Node
   • Работа с NVM
   • Figma компоненты
3. Введение в FSD
   • Что такое FSD
   • Layers
   • Slices
   • Segments
4. Pages и App
   • О слое App
   • Старт проекта
   • Подготовка слоя App
   • Обзор проекта
   • О слое Pages
   • Структура роутинга
   • Выделение slice
   • Создание первой страницы
   • Добавление стилей
   • Layout
5. Shared
   • О слое
   • Константы маршрутов
   • Конфигурации
   • API клиент
   • Библиотека
   • UI компоненты
   • Импорты в Shared
   • Что ниже Shared
6. Инструменты FSD
   • Steiger
   • Path Alias
   • Tree-shaking
   • CLI
   • Расширения
7. Entities
   • О слое
   • Создание slices
   • State management
   • API
   • UI компоненты
   • Упражнение — Выделение entities
   • Кросс-импорты
8. Features
   • О слое
   • Примеры feature
   • Специфичность в CSS
   • Упражнение — Выделение features
   • Упражнение — Разметка страниц
9. Widgets
   • О слое
   • Примеры Widget
   • Processes
   • Упражнение — Выделение виджетов
   • Упражнение — Финал декомпозиции
10. Работа с фреймворками
    • Next
    • Vue
    • Nuxt
    • Angular
    • Svelte
    • Миграция проектов
    • Отзывы о курсе

Не упустите возможность прокачать свои навыки и стать экспертом в области Frontend разработки! Присоединяйтесь к нашему курсу и начните свой путь к успеху уже сегодня!