Flux: Разделяем ответственность.

Всем привет! Часто в различных проектах я вижу очень большие компоненты с большим количеством логики по работе с сервером, хранилищами и.т.п. Недавно узнал о таком подходе как Flux.

Flux — это архитектурный паттерн, разработанный Facebook для управления состоянием в веб-приложениях, особенно в сочетании с React. Он основывается на однонаправленном потоке данных, что обеспечивает предсказуемость и упрощает отладку.

Основная идея Flux заключается в разделении ответственности между составляющими приложения. Хороший пример: мы подключаем библиотеку для управления состоянием(Mobx, Redux и.т.д) и доверяем ей бОльшую часть логики приложения(хранение глобального состояния, взаимодействие с сервером), а компоненты лишь подписываются и реагируют на изменения.

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

Основные компоненты Flux: • Диспетчер (Dispatcher): центральный элемент, который управляет потоком данных и получает действия от различных источников.

• Действия (Actions): объекты, описывающие изменения, которые должны произойти в состоянии приложения.

• Хранилища (Stores): хранят состояние приложения и реагируют на действия, обновляя свое состояние.

• Представления (Views): компоненты, которые отображают данные из хранилищ и обновляются при изменении состояния.

Прикрепляю полезные ссылки по этой технологии: https://habr.com/ru/articles/246959 https://metanit.com/web/react/5.1.php

Кстати, я нахожусь в поиске работы фронтенд-разработчиком. Если вам интересно, то напишите в личные сообщения:)

#flux #frontend #фронтенд #react #vue #angular #svelte #mobx #redux #архитектура #паттерн #веб

Flux: Разделяем ответственность. | Сетка — социальная сеть от hh.ru