Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: tutorial ReactJS, lokalizacje plików
Forum PHP.pl > Forum > Po stronie przeglądarki
eFK
Witam serdecznie,

robię tutorial ze strony http://www.merixstudio.pl/blog/nie-boj-sie...awy-biblioteki/ i mam problem jakie powinny być lokalizację plików względem siebie, oraz gdzie, co powinno być doinstalowane. Akurat normalnie pracuję na XAMPPie, ale tutaj to chyba nie ma większego znaczenia. No ale w xampie mam katalog ReacjJSmyTut, gdzie chcę sobie robić tutoriale dotyczące ReackJS. a tam katalog tut1. I teraz podążam za tutorialem z wymienionej strony: iw tut1 tworze nowy projekt o nazwie react-project, gdzie instaluje takie rzeczy jak webpack i babel (loaders). Po zainstalowaniu webpacka trzeba utworzyć plik konfiguracyjny webpacka. Po krótkich poszukiwaniach znalazałm informację że powinien on być w głównym katalogu projekt, ale co tak w sumie mam tu uznać za główny katalog projektu? Czy tut1? Czy mam utworzyć obok node_modules jeszcze jakiś inny katalog gdzie będzie jeszcze folder app z app.js, gdzie będzie index.html i greeting.js? Własnie, gdzie index.html i greeting.js powinny się znajdować.

Patrzyłam na jeszcze kilka tutoriali, między innymi o instalacji na oficjalnej stronie Reacta, o konfiguracji środowiska, ale albo nic mi to nie rozjaśniło, albo nie działo. A ten tutorial na początek wydaje mi się najprostszy, tylko nie wszytko wyjaśnia.
vonski
Plik konfiguracyjny webpack'a dajesz do głównego katalogu projektu, inaczej root czyli jeśli masz projekt w katalogu "tut1" to tutaj będzie też webpack.config.js.
Przyjętą praktyką (chociaż nie przez wszystkich, nie jest to reguła) jest utworzenie katalogu "src" gdzie znajdą się pliki JS pisane przez Ciebie, czyli komponenty, akcje itp. W tym katalogu możesz mieć plik index.js, który będzie punktem wejściowym do aplikacji (nie jest to oczywiście koniecznie; jak się uprzesz to możesz mieć wejście i w "root/cos-innego-niz-src/jeszcze-jeden-podkatalog/wcale-nie-index.js").

Generalnie dla Twojej aplikacji może to być coś w stylu:

  1. /root
  2. - node_modules
  3. - src
  4. - components
  5. - greeting.js
  6. - actions
  7. - reducers
  8. - index.js
  9. - styles
  10. - index.html
  11. - webpack.config.js
  12. - package.json


Tylko ponownie zaznaczam, to nie jest reguła, ale jest moim zdaniem dość fajnie i logicznie uporządkowane.

Rzuć sobie okiem na to repo i zobacz sama na strukturę katalogów, możesz też zbadać co jest w webpack.config.js - myślę, że to rozjaśni trochę sprawę:
https://github.com/StephenGrider/ReduxSimpleStarter
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.