Kokį požiūrį naudojote kurdami savo projekto…

Naudojau komponentų pagrįstą požiūrį, laikydamasi atominio dizaino principų. Projektą padalijau į mažus, pakartotinai naudojamus komponentus, juos sugrupavau pagal abstrakcijos lygius: atomus, molekules, organizmus, šablonus ir puslapius.

Atomai: Pagrindiniai elementai (mygtukai, įvesties laukai, piktogramos).
Molekulės: Atomų kombinacijos (įvesties laukas su mygtuku).
Organizmai: Molekulių ir/arba atomų grupės (antraštė, poraštė).
Šablonai: Organizmo ir molekulių komponavimas, apibrėžiantis puslapio struktūrą (puslapio išdėstymas).
Puslapiai: Konkretūs šablonų pavyzdžiai su realiais duomenimis.

Tai leido pasiekti:

Aukštą kodo pakartotinį naudojimą
Patogų palaikymą ir mastelį
Paprastą komponentų testavimą
Geresnį dizainerių ir kūrėjų bendradarbiavimą

Naudojau React (arba Vue.js, priklausomai nuo projekto frameworko), valdyti būseną per Redux (arba Vuex).

Katalogų struktūra organizuota pagal komponentus, ne pagal failo tipą, tai gerina kodo suradimą ir ryšį.

// Pavyzdys katalogų struktūros
src/
  components/
    atoms/
      Button/
        Button.js
        Button.module.css
    molekulės/
      InputWithButton/
        InputWithButton.js
        InputWithButton.module.css
    organizmai/
      Header/
        Header.js
        Header.module.css
  containers/ // Komponentai, susiję su logika ir duomenimis
    UserList/
      UserList.js
      UserList.module.css
  puslapiai/
    HomePage/
      HomePage.js
      HomePage.module.css
  redux/ // Arba Vuex
    actions/
    reducers/
    store.js
  utils/ // Pagelbinės funkcijos
  api/ // Darbas su API

Kokį požiūrį naudojote kurdami savo projekto architektūrą?