Aký prístup ste použili pri budovaní architektúry…

Použil som prístup založený na komponentoch, dodržiavajúc princípy atómového dizajnu. Rozdelil som projekt na malé, znovu použiteľné komponenty, ktoré som zoskupil podľa úrovní abstrakcie: atómy, molekuly, organizmy, šablóny a stránky.

Atómy: Základné prvky (tlačidlá, vstupné polia, ikony).
Molekuly: Kombinácie atómov (vstupné pole s tlačidlom).
Organizmy: Skupiny molekúl a/alebo atómov (záhlavie, päta).
Šablóny: Kompozície organizmov a molekúl, ktoré určujú štruktúru stránky (rozloženie stránky).
Stránky: Konkrétne príklady šablón s reálnymi dátami.

Toto umožnilo dosiahnuť:

Vysoké opakovanie kódu
Jednoduchosť údržby a škálovania
Jednoduchosť testovania komponentov
Lepšiu spoluprácu medzi dizajnérmi a vývojármi

Použil som React (alebo Vue.js, v závislosti od frameworku použitom v projekte), riadiac stav pomocou Redux (alebo Vuex).

Štruktúra adresárov je organizovaná podľa komponentov, nie podľa typu súboru, čo zlepšuje dostupnosť a súdržnosť kódu.

// Príklad štruktúry adresárov
src/
  components/
    atoms/
      Button/
        Button.js
        Button.module.css
    molekuly/
      InputWithButton/
        InputWithButton.js
        InputWithButton.module.css
    organizmy/
      Header/
        Header.js
        Header.module.css
  containers/ // Pre komponenty súvisiace s logikou a dátami
    UserList/
      UserList.js
      UserList.module.css
  stránky/
    HomePage/
      HomePage.js
      HomePage.module.css
  redux/ // Ale Vuex
    actions/
    reducers/
    store.js
  utils/ // Pomocné funkcie
  api/ // Práca s API

Aký prístup ste použili pri budovaní architektúry vášho projektu?