React projekti – hakemistorakenne

Yksi suurista kysymyksistä on se, että millainen hakemistorakenne pitää luoda React- projektille. Kysymys on mielenkiintoinen, koska jokaisella projektilla on omanlaisensa rakenne ja se riippuu projektin koosta ja monista muista asioista. Hyvä ohje tähän on se, että pohdi rakennetta mutta älä liiian kauan. 

Kysymys on hyvin mielenkiintoinen, koska jokainen asiantuntija antaa oman mieleisensä ratkaisun. Joku haluaa ryhittää tiedostot toimintojen yms. kautta. Toinen vaikka tiedostotyyppien kautta. Ja joku muu haluamallaan tavalla. Yhtä ja oikeaa ratkaisua ei vain ole tähänkään.

Jos asiaa katsoo nopeasti Reactin omien ohjeiden mukaan, niin sieltä voi löytää kaksi erilaista tapaa luoda tiedostorakenne.

Ryhmittely ominaisuuksien tai reittien mukaan

Yksi yleinen tapa  projekteja on paikantaa CSS, JS ja testit yhdessä kansioissa, jotka on ryhmitelty ominaisuuden tai reitin mukaan.

 

Ominaisuuden määrittely ei ole mitenkään tarkkaa vaan jokaisen pitää löytää itse paras vahtoehto sille. Ominaisuuden mukaan määritellyssä hakemistorakenteessa kaikki samaan ominaisuuteen liittyvät tiedostot ovat samassa paikassa.

Ryhmittely tiedostotyypin mukaan

Toinen suosittu tapa rakentaa kansiorakenne on ryhmitellä samanlaisia tiedostoja yhteen, esimerkiksi:

Jotkut menevät tällä tavalla pidemmälle eli ryhmittelevät vielä tuolla kaikki keskenään toisistaan riippuvat komponentit omiin kansioihinsa.

Vältä syviä hakemistorakenteita

Syvä kansiorakenne voi olla koodaamisen kannalta hyvinkin haastava ja esimerkiksi suhteellisten viittausten tekeminen voi olla aika vaikeaa esim. tilanteessa jossa tiedostoja siirretään. Kannattaa pohtia, että kuinka syvän kansiorakenteen tekee. Yleensä ei ole mitään hyvää syytä mennä yli 3-4 kansion syvyyteen

Älä yliajattele

Projketia aloitaessa ei kannata yliajatella ja käyttää liikaa aikaa kansiorakenteen suunnitteluun. Jotkut sanovat että yli viisi minuuttia on liikaa. Kansiorakennetta voi kehittää koodaamisen ja projektin edistyessä.

Jos tunnet olevasi täysin jumissa, aloita pitämällä kaikki tiedostot yhdessä kansiossa. Ennenmmin tai myöhemmin kansio kasvaa liian suureksi ja silloin kannattaa pohtia kansiorakennetta  ja tietää mitkä tiedostot kuuluu toisiinsa eli mitä kaikkia editoidaan yhdessä. Yleensä on hyvä idea pitää usein yhdessä vaihtuvia tiedostoja lähellä toisiaan.

Projektien kasvaessa laajemmiksi ne käyttävät usein molempien edellä mainittujen lähestymistapojen yhdistelmää käytännössä. Joten oikean rakenteen valitseminen alussa ei ole kovin tärkeää.