Ta strona zawiera rzeczy, z których ja się uczyłem systemu nodowego. Poznasz tutaj bleeding-edge technologies z 2020.
Javascript jest bazą wszystkiego. Na razie znalazłem ten tutorial, który wygląda jakby był naprawdę nowy: Tutorial
Jest niestety niezwykle rozległy, ale to dla mnie plus - warto go przejść najpierw po łebkach, a później używać jak słowniczek.
Node jest standalone interpretatorem javascriptu, który można odpalić sobie lokalnie na komputerze.
Nie potrzebujemy do jego wykonania przeglądarki, ponieważ uruchamia kod na swoim własnym silniku.
Zawiera też swoje własne klasy, które pozwalają pisać aplikacje działające bezpośrednio na systemie.
By dowiedzieć się więcej, to warto pobieżnie przejrzeć ten tutorial.
Nie warto w niego poważnie wchodzić, ponieważ jest zrobione dużo nakładek do omawianych tam technologii, które są po prostu lepsze.
Npm to node package manager. Pozwala nam on instalować biblioteki do użycia z nodem.
By zrozumieć jak działa i po co nam on, to warto przeczytać ten ustęp.
Jeżeli chcemy poznać możliwe wykorzystania npma poza paczkami, to warto zacząć od używania npm, a potem przejść dalej do dokumentacji cli, by na koniec przeczytać resztę dokumentacji, która nie jest już taka interesująca.
Typescript jest rozszerzeniem JavaScriptu, który dodaje typowanie.
Ułatwia to bardzo pisanie kodu, bo nie popełnimy głupich błędów z typami.
Warto przeczytać te linki dopiero po zapoznaniu się z JavaScriptem.
`typescript` jest też dependencją npma, która dodaje nam komendę `tsc`.
Za jej pomocą możemy kompilować kod `.ts` do `.js`, który można normalnie odpalić node.
W normalnym użytkowaniu kodu możemy zainstalować depkę `ts-node` i odpalać pliki typescriptu za pomocą `npx ts-node <plik.ts>`.
Warto pamiętać o pliku tsconfig.json, który można skonfigurować, by kompilator wiedział:
- jak kompilować
- gdzie wypluwać pliki
- i inne…
Bo zrozumieć po co warto go używać
By zrozumieć jak go używać
By zrozumieć go w pełni
Jest służy do pisania testów do javascriptu. By lepiej zrozumieć istotę pisania testów dla programistów, to warto sobie przeczytać TDD Kenta Becka.
Według mnie to podejście jest o wiele lepsze niż pisanie cały czas printów w swoim kodzie i jeszcze nasz kod jest przetestowany :D.
Jest ma bardzo fajne funkcyjne vibesy i poza tym warto sobie skonfigurować webstorma, by go obsługiwał out of the box.
By zacząć używać jesta przeczytaj to.
By skonfigurować go z typescriptem (bez babela), zerknij na to.
Reszta dokumentacji jest tutaj.
Ecosystem node jest bardzo przyjemny do pisania. Wystarczy tylko zainstalować bibliotekę i ją zaimportować.
Gdzie na naszym komputerze wszystko trzymamy na dysku i mamy zainstalowane całe środowisko developerskie,
to kiedy ktoś chciałby użyć naszej aplikacji w przeglądarce, czy nawet u siebie na komputerze, to musiałby mieć wszystkie te zależności.
Webpack jest bundlerem, co oznacza, że ze wszystkich plików, na których polegamy, może nam stworzyć jeden,
który zawiera wszystko, co jest potrzebne do jego odpalenia.
Dzięki temu możemy pisać nasz kod jakbyśmy pisali go w środowisku nodowym,
a później cały projekt nibymagicznie zmienia się w jeden plik jsa.
Webpack jest tak dużym projektem, że zawiera mnóstwo funkcjonalności, które można znaleźć w project managerach (np w javie "maven") i jest ogromnym ecosystemem samym w sobie, który pozwala integrować ze sobą różne funkcjonalności:
Między innymi potrafi optymalizować nasz kod, używać CSSów w Reactie, zajmuje się integracją z preprocesorami CSS itd…
Za pomocą webpacka i expressa będziemy mogli stworzyć nasz własny zamiennik do create-react-app,
który jest bardziej zrozumiały, konfigurowalny i pozwoli nam postawić backend razem z frontendem.
Zerknij tutaj, by zacząć przygodę z WebPackiem.
Express.js jest prostym, ale potężnym serwerem www dla node.
Jest łatwo rozszerzalny, prosty i intuicyjny.
Kiedy już się opanuje webpacka, to można go zintegrować z express.js,
by zmiany w kodzie frontendowym były automatycznie propagowane do przeglądarki.
(Poczytaj o dev-server, a potem oHot-Module-Reload)
Na początek przeczytaj quickstart, a potem: guide
(Przypis Redaktora: Jak Ja kocham express.js.
Przy expressie annotacyjne opisywanie funkcji we Flasku, czy Django można sobie wsadzić między żarty xD.
Nienawiść do pythona tak zostałem wychowany…)
Przed Reactem było jQuery, które pozwalało na interaktywną manipulację zawartości strony internetowej.
Niestety utrzymywanie pożądanego stanu strony, przy wielu interakcjach użytkownika często graniczyło z cudem i było bardzo męczące.
Dlatego powstał React, który pozwolił nam nie martwić się jak mamy osiągnąć pożądany stan, odbierając od nas tę odpowiedzialność.
Reactowi podajemy tylko model, który chcemy, by nasza strona przedstawiała a on już w miare wydajnie doda, zmodyfikuje i usunie odpowiednie elementy.
Jeżeli chcesz skorzystać z poprzedniej wiedzy do złożenia Reacta, to przeczytaj tego guida.
Jeżeli nie czujesz się na siłach być ultrahackerem, to zacznij od getting started.
Nie ważne, którą drogę wybierzesz… i tak musisz przejść przez tutorial.
Tutaj znajdziesz fajne proste zadanka, które możesz wykonać, by poznać świat jsa.
Tutaj będę dodawać wszystkie pytania, które pojawiały się do tego poradnika.