show

29

Структура фронтенд проекта

В прошлой статье мы разбирали важность чистой архитектуры фронтенда. Сегодня предлагаю пройтись по ее структуре.

Архитектурных подходов сейчас множество. Однако цель у всех одна — спроектировать гибкую архитектуру проекта, которую будет легко масштабировать и поддерживать.

Мне очень понравилась методология Feature Sliced Design (далее FSD). Она помогает сделать проект понятным и структурированным. Поэтому отлично подходит для средних и крупных проектов.

Большой плюс FSD — она не привязана к конкретному языку программирования. Поначалу она может показаться сложноватой, но зато потом оправдывает все ожидания. Фичи выходят быстрее, в проекте легче ориентироваться.

Три уровня абстракции помогают FSD быть такой классной.
 1. Слои. Чем выше слой расположен, тем выше уровень его ответственности и знания о других слоях. По убыванию слои становятся более абстрактными. Вместе с тем возрастает опасность при внесении изменений.
 2. Слайсы. Это папки, которые группируют файлы для конкретного модуля.
 3. Сегменты. Каждый сегмент отвечает за свою часть технической реализации модуля.

Важно: один модуль не должен использовать другой модуль вне зависимости от слоя, на котором они расположены. Так теряется их устойчивость к новым требованиям.

Использование FSD предполагает слаженную командную работу. Все участники должны обязательно изучить документацию о методологии. И лучше на начальном этапе договориться об уровне декомпозиции. Так как использовать FSD можно как на полную мощность, так в пол силы. Это зависит от сложности проекта.

Даже в общих чертах FSD является хорошим инструментом, достойным внимания. Подробнее об этой методологии можно почитать, например, на habr.com

Есть вопросы?

Хотите обсудить проект?

Напишите нам!