Для любителей FSD описание проекта на Vue на нем (тудушка)

В качестве выводов - констатация факта, что по FSD все сделать нельзя, даже такой маленький проект, и надо искать компромисс между FSD методами и не FSD методами в одном проекте.

#fsd #architecture

Очень люблю я FSD-эшников, особенно, их призвание мессионерствовать везде и всегда, коим они даже накстоводов далеко позади оставили.

Вот человек написал большую статью о том, какую архитектуру для React проектов они подобрали, и всего пару раз обмолвился, что FSD им не подошла.

Ну и что в комментариях? Естественно, грандиозные баталии поклонников FSD, причем, преимущественно, между собой, а не с его противниками. Выяснение, кто правильней толкует их Библию. Что в статье написано - никого не интересует.

#fsd

Options API - это FSD
Composition API с composables - модульная архитектура.
(аналогия)

FSD в основу иерархичного разбиения ставит программный функционал. Модульная - доменные сущности

Можно провести аналогию c физиологией человека

Можно изучать человека разбивая его на руки, ноги, тело, голову и внутри уже по органам, тканям и т.д.

FSD же на верхнем уровне разбивает сперва по органам и тканям - кровеносная система, ЖКТ, мышечные ткани, и внутри уже разбивает по доменам - рот и кишечник внутри ЖКТ

Так же и с переходом от Options API к Composition API. Было разбиение по фичам (options), стало - по бизнес / доменным сущностям (композициям).

Так лучше.

#fsd #architecture

Получил очень интересный и полезный опыт:

1. Выделив UI часть проекта Lissa Health в отдельный модуль (привет, #fsd)
2. Добавив дизайн систему на CSS свойствах и оформив всё как UI kit
3. Выделив в отдельный репозиторий, который ставится как Git submodule и подключается через npm локально (для быстрых правок)
4. Создав документацию
5. Добавив темизацию и кастомизацию компонентов
6. Переиспользовав его в других проектах

На npmjs.org не публиковал, на универсальность, полноту (не собираюсь выпускать ее как общую библиотеку) и актуальность документации не претендую, но можно просто посмотреть как работать с Ark-UI.

Alt-UI

#arkui #altui #ui