w Praktyce
10 godz. 44 min · Node.js · Full-stack i Programowanie
Piotr PalarzWeb DeveloperW kursie tym poznasz platformę Node.js od podstaw, aż po bardziej zaawansowane koncepcje. Zaczniemy od omówienia czym jest Node, a także jakie może być zastosowanie tej technologii. Następnie przejdziemy przez proces instalacji i napisanie swojego pierwszego skryptu. Już na samym początku dokładnie omówimy tworzenie własnych modułów, gdyż jest to wiedza niezbędna, by dobrze zrozumieć funkcjonowanie Node. Następnie dowiesz się czym są zdarzenia, jak działa model “publish / subscribe”, a także czym jest “event-driven development”. Chwilę później omówimy pracę z buforami, stream’ami, a także ze standardowym wejściem i wyjściem. Ta wiedza pozwoli Ci zrozumieć jak tworzone aplikacje mogą otrzymywać od użytkownika dane oraz jak je wyświetlają.
Niezwykle ważnym rozdziałem będzie ten, poświęcony pracy z systemem plików. Szczególnie dla dewelopera, pracującego dotychczas z językiem JavaScript wyłącznie w środowisku przeglądarki internetowej. Node pozwala bowiem tworzyć nowe pliki, zapisywać w nich dane oraz odczytywać i usuwać pliki i katalogi. Przy wszystkich tych operacjach, niezwykle ważna jest jednak asynchroniczna natura Node. Dowiesz się jak działa, a także jakie są jej zalety. Na tym etapie nie zabraknie oczywiście praktycznego projektu, którym będzie aplikacja typu CLI (Command Line Interface). Pozwoli nam ona grupowo zmienić nazwy wielu plików, według podanego wzorca.
W kolejnym rozdziale poruszymy fundamentalną dla Node kwestię, mianowicie tworzenie serwerów sieciowych. Zaczniemy od najniższego poziomu, tworząc prosty serwer bazujący na protokole TCP/IP. Wiedza w jaki sposób Node radzi sobie z takim zadaniem, pozwoli później lepiej zrozumieć wyższe warstwy, takie jak np. HTTP czy WebSockets. Chwilę później stworzymy swój pierwszy serwer HTTP, do którego będzie można wysyłać zapytania wprost z przeglądarki internetowej. Omówimy również jak w Node wykorzystać bezpieczne szyfrowanie HTTPS.Na tym etapie będziesz już miał solidną wiedzę jak pracować z Node, jednak zanim przejdziemy dalej, zatrzymamy się, by omówić jak dokładnie działa Node.js, a także jak ta platforma została zbudowana. Dwie dość obszerne lekcje, będą być może jednymi z najważniejszych w tym kursie. Dowiesz się w nich czym jest, a także jak działa jednowątkowa pętla zdarzeń, czym jest proces i wątek, a także zobaczysz kod źródłowy Node.js i wszystkie bloki budulcowe, z jakich Node się składa. To naszym zdaniem niezwykle ważny temat, często jednak pomijany w wielu materiałach. Dzięki dogłębnemu zrozumieniu jednowątkowej natury języka JavaScript i asynchroniczności Node, będziesz mógł tworzyć dużo lepsze aplikacje.
Node.js posiada kilkanaście wbudowanych modułów, z których w dowolnej chwili można skorzystać. Wszystkie jednak dają nam dużą, niskopoziomową kontrolę, ale czasami sporo kodu należy napisać, by zrealizować jakieś zadanie. Jest to jednak świadomy wybór twórców Node, gdyż całą resztę świetnych rozwiązań, dopisuje nieustannie ogólnoświatowa społeczność deweloperów. Zdecydowana większość z modułów ląduje w rejestrze npm. Jest to genialny package manager, który pozwoli nam wyszukiwać, pobierać i aktualizować niezliczoną ilość modułów. Dowiesz się zatem jak korzystać z npm, a chwilę później zaczniemy wykorzystywać zgromadzone tam moduły w dalszej pracy.Jednym z najpopularniejszych modułów jest express.js, który pozwala w bardzo prosty sposób tworzyć serwery HTTP. Grzechem byłoby zatem z niego nie skorzystać. Dowiesz się wszystkiego co niezbędne, by zacząć tworzyć własne aplikacje bazujące na protokole HTTP z użyciem express.js, a także kilku dodatków do tego systemu. Zobaczysz jak routować zapytania, jak korzystać z middleware czy serwować statyczne pliki. Następnie omówimy współpracę z bazą danych MongoDB i z jej wykorzystaniem stworzymy API typu REST. Stworzona aplikacja pozwoli odczytywać dane z bazy i przesyłać je do klienta w formacie JSON, a także dodawać nowe dane, aktualizować i usuwać je. Wszystko to zgodnie z dobrymi praktykami pracy z REST.
Chwilę później czeka Cię kolejny praktyczny projekt - skracacz linków. Stworzymy wspólnie aplikację, która pozwoli skrócić dowolny adres URL do krótkiej formy. Oczywiście będzie działać również w drugą stronę! Kiedy przejdziemy pod skrócony adres, przekieruje nas do odpowiedniej witryny. Node.js to platforma wręcz stworzona do tworzenia aplikacji typu real-time, dlatego w kolejnym rodziale podejmiemy temat technologii WebSockets. Dowiesz się jakie są jej zalety, a także jak pracować z nią po stronie serwera i klienta. Tutaj czeka nas kolejny praktyczny, niezwykle ciekawy projekt. Wykonamy bowiem czat grupowy. Aplikacja ta pozwoli dowolnej ilości użytkowników podłączyć się do czatu podając swój nick, a następnie wysyłać widoczne dla wszystkich wiadomości. Zaimplementujemy nawet takie rozwiązania jak wyświetlanie statusów o dołączeniu kogoś do czatu, a także o jego opuszczeniu.W przedostatnim rodziale tego kursu podejmiemy tematykę dobrych praktyk pracy z Node.js. Na początku omówimy najważniejsze konstrukcje nowej specyfikacji EcmaScript 2015, które są znakomicie wspierane w Node. Chwilę później omówimy jak korzystanie z Promises uprości, a także ulepszy nasz kod. Wśród dobrych praktyk nie zabraknie również informacji o debugowaniu aplikacji. Zobaczysz sprawdzone sposoby, by znaleźć błędy lub lepiej, krok po kroku, zrozumieć jak działa napisany wcześniej kod. Dowiesz się również jak pracować z błędami, by Twoje aplikacje działały w sposób przewidywalny.
Ostatni rozdział w całości został poświęcony temu, co zwykle jest pomijane w innych materiałach, mianowicie wdrażaniu aplikacji do produkcji. Przez cały ten kurs pracować będziemy lokalnie, lecz kiedy aplikacje są już gotowe, wypadałoby udostępnić je światu. Wdrażanie aplikacji napisanych z użyciem Node.js nie jest jednak tak oczywiste, jak np. wgrywanie WordPress’a u wybranego hostingodawcy. Ty będziesz miał jednak możliwość zobaczyć, jak wdrożyć napisany przez nas grupowy czat na platformie Heroku. Jest to bardzo popularny serwis działający jako PaaS (Platform as a Service). Za darmo będziesz mógł w ciągu kilku chwil uruchomić swoją aplikację.Zobaczysz o co należy zadbać, by wszystko poszło gładko. Serwisy typu PaaS dbają o bardzo wiele aspektów wdrażania i serwowania naszych aplikacji, takich jak bezpieczeństwo oraz nieustanną dostępność. Mają jednak pewne ograniczenia. Z tego powodu, dowiesz się również jak wdrożyć swoją aplikację na serwerze wirtualnym VPS z systemem Ubuntu Server. Takie rozwiązanie daje nam całkowitą kontrolę, ale także obarczone jest większą odpowiedzialnością. Zaczniemy od instalacji na serwerze platformy Node.js, systemu kontroli wersji GIT, a także innych niezbędnych modułów
Następnie zobaczysz jak skonfigurować swoje lokalne środowisko tak, by za pomocą GIT’a wysyłać kod do zdalnego serwera, a potem jednym poleceniem wdrażać go do produkcji. Dowiesz się również jak jednocześnie serwować wersję produkcyjną oraz developmencką. W rodziale tym poruszymy również inne kwestie, takie jak procesy potomne czy tworzenie klastrów. Dzięki tej wiedzy, będziesz mógł maksymalnie wykorzystać dostępne zasoby serwera. Na sam koniec tego kursu rzucimy okiem również na inne, nie przedstawione wcześniej zastosowania Node, a także nakreślimy dalszą drogę nauki w tym zakresie.
Kurs ten jest dla wszystkich osób, które dobrze czują się w technologiach frontendowych, tj. HTML, CSS i JavaScript, a teraz chcą rozpocząć swoją przygodę z back-endem. Im zatem lepiej znasz język JavaScript, tym więcej wyciśniesz z Node, natomiast nie jest wymagana bardzo zaawansowana wiedza z zakresu tego języka.
W tej lekcji pokażę ci, jak dziecinnie proste jest serwowanie statycznych plików z użyciem Expressa.
Jeżeli pamiętasz, w jaki sposób my musieliśmy to robić, to zobaczysz, jaka jest tutaj różnica. Jeżeli
nie pamiętasz, to koniecznie zajrzyj sobie do tego przykładu, który mieliśmy wcześniej.
Pomijam oczywiście fakt, że to, co za moment zrobimy jedną linijką kodu, jest dużo, dużo lepsze niż to, co
musieliśmy zrobić wieloma linijkami kodu wcześniej, bo nasz przykład tylko pokazywał, w jakim kierunku iść,
a nie pokazywał gotowego rozwiązania.
Jesteśmy w katalogu 28, gdzie w package.json mamy już wpisany Express, ale musimy go zainstalować, więc
u siebie,
jeżeli pracujesz razem ze mną, wpisz npm install. Poczekajmy chwilę, Express zostanie pobrany.
Tutaj już go inkluduję. I mamy prosty serwer, więc nodemonem najlepiej aby nam się restartował.
Uruchomię go. Kiedy odświeżę w przeglądarce, wszystko działa.
Mamy Hello world!
No właśnie. Ale teraz pokażę ci, że stworzyłem katalog public, w którym mamy m.in. plik css z bootstrapem, jak
i plik index.html.
No i ten plik index.html chciałbym zaserwować.
A kiedy przeglądarka jego będzie wczytywać i wyśle zapytanie pod css/bootstrap.css, aby pobrać ten plik.
Oczywiście nie będziemy tego robić w ten sposób, że tutaj napiszę css/bootstrap.css itd,
tylko skorzystamy z express_static. Przejdziemy na stronę Expressa. Wpiszę tutaj static, aby pokazać ci, gdzie
to jest. Dokładnie to jest w tym miejscu.
Express_static. I są tutaj opcje, z których ja nie będę korzystał,
ale przyjrzyj im się, gdyby one kiedyś mogły dla ciebie być przydatne. Aby serwować statyczne pliki,
wystarczy, że zrobimy coś takiego. Napiszemy app.use i za pomocą use stworzymy middleware, o którym będzie jeszcze
w jednej z kolejnych lekcji.
To oznacza tylko tyle, że funkcja, którą za moment tutaj wstawimy, będzie wykonywana dla każdego zapytania
najpierw zanim takie zapytanie będzie wykonane. Czyli kiedy ktoś wyśle zapytanie pod get, to najpierw
i tak wykona się ta funkcja, którą tutaj z użyciem use przypiszemy.
Ja nie będę tutaj wpisywał żadnej funkcji, ale będę chciał wstawić tutaj funkcję, którą zwróci mi Express.
Zauważ, że właśnie dlatego pokazałam ci, kiedy robiliśmy pierwszy przykład z Expressem, że nie wywołuję
przy app od razu Expressa, bo mógłbym tak zrobić i tutaj wpisać app,
ale potrzebowałem dostępu mieć do Expressa.
tutaj. Dlatego wpisuję express.static.
I tutaj musimy podać katalog, w którym mamy statyczne pliki.
U nas jest to po prostu public.
Nie musimy się tutaj martwić o path,
join i o to wszystko. Podajemy po prostu w ten sposób katalog i Express zadba o resztę.
Tyle wystarczy.
Zatem express.static zwróci jakąś funkcję. Bo mówiłem ci, że tutaj trzeba podstawić funkcję do app.use, czyli
to zwróci jakąś funkcję.
Tyle wystarczy. Nodemon nam to zrestartował. Odświeżmy teraz sobie serwer i zauważ, że Hello World! nas powitał
w trochę innej formie. Mianowicie res.send, który mieliśmy tutaj, nie jest już wysyłany, bo najpierw
jest brane pod uwagę właśnie to, co jest w katalogu public. I jest tam m.in. coś takiego jak plik index.html,
który jest przez Expressa brany pod uwagę, kiedy wchodzimy na stronę główną.
Gdyby on się nazywał inaczej, to by nie został zaserwowany.
Jednak tak się nazywa, więc został zaserwowany.
I w tym przypadku akurat response send tutaj zostało już pominięte.
Ten plik kiedy się wczytywał, to wysłał zapytanie pod css/bootstrap.css i również zostało to poprawnie wczytane,
bo widzimy tutaj odpowiednie style.
W ten zatem prosty sposób możemy sobie serwować statyczne pliki, a działa to w ten sposób, że za każdym
razem, gdy jest wysyłane zapytanie do serwera, to Express sobie sprawdzi, czy taki get jak tutaj gdzieś
został przypisany do takiej ścieżki.
Jeżeli nie, to sprawdzi, czy
być może w tym katalogu public znajduje się plik o takiej ścieżce jaką podaliśmy.
Jeżeli tak, to go po prostu zwróci.
Na koniec jeszcze pokażę ci jedną rzecz, która jest genialna, o której być może w ogóle nie pomyślałeś.
Kiedy serwowaliśmy np. plik index.html tutaj, w panelu Networks sobie odświeżymy, to zauważ, że Express
zwrócił poprawne nagłówki takie jak np. content type,
dodał jeszcze content length, którego nie mieliśmy w przypadku naszego serwera HTTP, który tworzyliśmy sami,
a w przypadku bootstrapa zwrócił przeglądarce również odpowiedni content type, taki jak
text/css.
Jak zatem widzisz, jedną linijką kodu zaserwowaliśmy pliki statyczne i Express będzie dbał o to, aby serwować
je również z odpowiednim typem mime.