[cr6d]

#programowanie #programista15k #react #next #javascript #typescript

Jakiej struktury katalogów i plików używać w projektach React aby było to pro i było akceptowane przez rekruterów / ludzi którzy robią review kodu?

Jako że aplikuję aktywnie na stanowisko Frontend/Backend/Fullstack spotykam się z review mojego kodu i często dostaje info że struktura folderów i plików mogła by być inna. Chciałbym w końcu dopracować swoje umiejętności aby zdobyć pracę i wiedzieć kiedy i gdzie i jak nazwać plik z funkcjami czy handlerami komponentu, jak podzielić aplikacje na osobne pliki.

W większości tutoriali jest po prostu folder components i page/views a jak pokazuje rzeczywistość nie jest to akceptowane i jest to za mało. Myślę że osoby które pokazują jak pisać projekty np na youtube powinni zwracać szczególną uwagę na ten aspekt projektów gdyż jak widać jest to bardzo istotne a często jest to na ich filmach po prostu tak jak napisałem wyżej. Z drugiej strony gdzie bym nie czytał to każdy ma jakiś inny pomysł jak podzielić katalogi i pliki aplikacji, jedni stosują jeden plik do utis, inni nazywają to helpers, czasami każdy komponent ma własny utils/helpers/types, niektorzy stosują w każdym katalogu index.ts gdzie są exporty a czasami wygląda to jeszcze inaczej. Czasem jest stosowane podejście np katalog user i w nim rzeczy odnośnie usera, katalog form w odniesieniu do formularzy itp. Widziałem też podejście gdzie jest zastosowana taka abstrakcja że cięzko to ogarnąć jakieś entities #!$%@? muje dzikie węże. Prosił bym o jakieś konketne przykłady jak to pownno wyglądać, zapraszam do dyskusji na ten temat.

Z uwagi również na to że zacząłem stawiać pierwsze kroki w Next.js chciałem również poruszyć ten sam problem w odniesieniu do tego frameworka i jako że domyślnie jest tam zastosowany Routing w odniesieniu do katalogów to jak tam powinna wyglądać struktura?

[zibizz1]

@cr6d a lepiej spacje czy tabulatury

[nad__czlowiek]

@cr6d: brzmi jak po prostu jakaś głupia wymówka, struktura plików ma być czytelna i przejrzysta, nie ma nic złego w podziale components, page itd.

[cppguy]

@cr6d:

https://github.com/alan2207/bulletproof-react

[E.....o]

często dostaje info że struktura folderów i plików mogła by być inna

@cr6d: typowy dogmatyzm, pewnie reviewer mial inna strukture na kursie udemy z ktorego sie uczyl

[cr6d]

@ElTalento: i jak tu zdobyc prace.. od poltorej roku robilem kilkanascie zadan rekutacyjnych i zawsze wszystkie funkcje ktore mialy byc byly przezmnie zaimplementowane i w 100% wszystko dzialalo ale i tak nie chcą mi dać roboty bo wlasnie np struktura plików albo np interfejs brzydki (a nie daja zadnego projektu graficznego)

[FiranMercury]

@cr6d na figmie jest sporo darmowych design systemów.

jeśli chodzi o katalogowanie komponentów, to polecam atomic design.

Poza tym najważniejsze żeby była konsekwencja.

[zwei]

@cr6d: jak odrzucają przez takie gówno to chyba lepiej tam nie pracować XD przecież dostosowanie się do struktury stosowanej w projekcie to jest 5 minut, patrzysz i robisz analogicznie

[cr6d]

@zwei: mam takie samo zdanie ze to po prostu szczegoły są i już nie mam pomysłu jak zdobyć pierwszą pracę

[Kresse]

@cr6d: Zależy jaki projekt. Do małych podział typu components/pages będzie ok. W większych natomiast z reguły lepiej wrzucić jeszcze jedną warstwę katalogów per feature (np. reports/components/report-list). Generalnie struktura plików jest dobra, jeśli ktoś świeży w projekcie może szybko znaleźć rzeczy ( ͡° ͜ʖ ͡°) Często to też kwestia gustu i nie ma tutaj jedynego właściwego rozwiązania.