Node.js dla początkujących - Część 18: Wdrażanie projektu VPS, Vercel

Cześć! W poprzednich wpisach naszego kursu JavaScript poznaliśmy podstawy języka, a także framework Express.js, który pozwala nam tworzyć serwery i aplikacje webowe. Teraz nadszedł czas, aby pójść o krok dalej i nauczyć się, jak umieścić nasze dzieło w Internecie, aby każdy mógł z niego korzystać. W tym artykule omówimy różne sposoby wdrażania aplikacji Node.js na serwerze. W tej części skupimy się na dwóch popularnych platformach: Heroku i AWS (Amazon Web Services).

Dlaczego w ogóle wdrażać aplikacje?

Zanim przejdziemy do konkretów, zastanówmy się, dlaczego w ogóle potrzebujemy wdrażać aplikacje na serwerze. Otóż, uruchamiając aplikację lokalnie na swoim komputerze, tylko Ty masz do niej dostęp. Aby udostępnić ją światu, potrzebujemy serwera – specjalnego komputera, który jest stale podłączony do Internetu i udostępnia nasze pliki i kod. Wdrażanie to proces przenoszenia naszej aplikacji z lokalnego środowiska na taki serwer.

Heroku – idealny start dla początkujących

Heroku to platforma typu PaaS (Platform as a Service), która upraszcza proces wdrażania aplikacji. Oferuje darmowy plan dla małych projektów, co czyni ją idealnym wyborem dla początkujących.

Krok po kroku: Wdrażanie aplikacji Node.js na Heroku

1. Przygotowanie aplikacji: Upewnij się, że Twój projekt Node.js ma plik package.json zdefiniowany, a w nim skrypt startowy. Najczęściej wygląda to tak:

{
  "name": "moja-aplikacja",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "node index.js"
  },
  "dependencies": {
    "express": "^4.18.2"
  }
}

Jeśli używasz Express.js, Twój plik index.js (lub inny plik startowy) powinien wyglądać podobnie:

const express = require('express');
const app = express();
const port = process.env.PORT || 3000;

app.get('/', (req, res) => {
  res.send('Witaj świecie z Heroku!');
});

app.listen(port, () => {
  console.log(`Aplikacja nasłuchuje na porcie ${port}`);
});

Kluczowe jest użycie process.env.PORT. Heroku dynamicznie przypisuje port, dlatego musimy pobrać go z zmiennej środowiskowej. Jeśli nie jest zdefiniowana (np. lokalnie), używamy portu 3000.

2. Utworzenie konta na Heroku: Wejdź na stronę Heroku i załóż darmowe konto.

3. Instalacja Heroku CLI: Zainstaluj Heroku CLI (Command Line Interface), czyli narzędzie do zarządzania Heroku z linii poleceń. Instrukcje instalacji znajdziesz na stronie Heroku.

4. Logowanie do Heroku: W terminalu wpisz heroku login i zaloguj się do swojego konta.

5. Utworzenie nowej aplikacji Heroku: W katalogu z Twoim projektem wpisz heroku create. Heroku nada Twojej aplikacji losową nazwę (np. gentle-mountain-12345). Możesz też podać własną nazwę: heroku create moja-wlasna-nazwa.

6. Wdrożenie aplikacji: Użyj komendy git push heroku main (lub git push heroku master, w zależności od nazwy Twojej gałęzi). To polecenie wyśle Twój kod na serwery Heroku.

7. Otwarcie aplikacji: Po udanym wdrożeniu, Heroku wyświetli adres URL Twojej aplikacji. Możesz też otworzyć ją za pomocą komendy heroku open.

AWS – potężne narzędzie dla zaawansowanych

AWS (Amazon Web Services) to rozbudowana platforma chmurowa oferująca szeroki zakres usług. Jest bardziej skomplikowana niż Heroku, ale daje znacznie większą kontrolę i elastyczność. Skupimy się na usłudze Elastic Beanstalk, która ułatwia wdrażanie aplikacji webowych.

Krok po kroku: Wdrażanie aplikacji Node.js na AWS Elastic Beanstalk

1. Utworzenie konta AWS: Jeśli jeszcze go nie masz, załóż konto na AWS. Będziesz potrzebować karty kredytowej, ale dla małych projektów w ramach darmowego tieru (Free Tier) wiele usług jest bezpłatnych.

2. Instalacja AWS CLI: Zainstaluj AWS CLI. Instrukcje znajdziesz na stronie AWS.

3. Konfiguracja AWS CLI: Skonfiguruj AWS CLI za pomocą komendy aws configure. Będziesz potrzebować klucza dostępu (Access Key ID) i klucza tajnego (Secret Access Key), które znajdziesz w konsoli AWS w sekcji “Security credentials”.

4. Utworzenie aplikacji Elastic Beanstalk: W konsoli AWS przejdź do usługi Elastic Beanstalk i utwórz nową aplikację. Wybierz platformę “Node.js”.

5. Utworzenie środowiska Elastic Beanstalk: W ramach aplikacji utwórz nowe środowisko. Wybierz typ środowiska “Web server environment”.

6. Wdrożenie aplikacji: Istnieje kilka sposobów wdrażania na Elastic Beanstalk. Najprostszy to użycie pliku ZIP. Spakuj cały swój projekt (wraz z plikiem package.json) do archiwum ZIP.

7. Przesłanie archiwum ZIP: W konsoli Elastic Beanstalk wybierz swoje środowisko i wgraj spakowane archiwum ZIP.

8. Konfiguracja: Po wdrożeniu możesz konfigurować różne ustawienia środowiska, takie jak liczba instancji serwerów, typ instancji, itp.

Różnice między Heroku a AWS

• Prostota vs. Elastyczność: Heroku jest znacznie prostsze w użyciu, idealne dla szybkich prototypów i małych projektów. AWS oferuje znacznie większą elastyczność i kontrolę, ale wymaga więcej konfiguracji.
• Cena: Heroku oferuje darmowy plan dla małych projektów, ale w miarę wzrostu zapotrzebowania koszty mogą być wyższe niż w AWS. AWS oferuje model płatności za użycie, co może być bardziej opłacalne dla większych projektów.
• Skalowalność: Obie platformy oferują skalowalność, ale AWS daje większe możliwości w tym zakresie.

Vercel – idealny wybór dla frontendowców i aplikacji serverless

Vercel to platforma, która specjalizuje się we wdrażaniu aplikacji frontendowych (np. React, Vue, Angular) i funkcji serverless. Oferuje prosty proces wdrażania z integracją z Gitem, co czyni ją bardzo popularną wśród programistów frontendowych. Chociaż skupia się na front-endzie, Vercel doskonale radzi sobie również z aplikacjami Node.js, zwłaszcza tymi, które korzystają z podejścia serverless.

Krok po kroku: Wdrażanie aplikacji Node.js na Vercel

1. Przygotowanie aplikacji: Podobnie jak w przypadku Heroku, upewnij się, że Twój projekt ma plik package.json ze skryptem startowym. Vercel automatycznie wykryje, że to aplikacja Node.js.

2. Repozytorium Git: Umieść swój projekt w repozytorium Git (np. na GitHubie, GitLabie lub Bitbucket).

3. Utworzenie konta na Vercel: Wejdź na stronę Vercel i załóż konto. Możesz zalogować się za pomocą swojego konta Git.

4. Import projektu: Po zalogowaniu, Vercel poprosi Cię o import projektu z Twojego repozytorium Git. Wybierz odpowiednie repozytorium.

5. Konfiguracja (opcjonalnie): Vercel zazwyczaj automatycznie konfiguruje projekt. Jeśli jednak potrzebujesz dostosować ustawienia (np. zmienne środowiskowe), możesz to zrobić w panelu konfiguracyjnym projektu.

6. Wdrożenie: Po imporcie projektu, Vercel automatycznie wdroży Twoją aplikację. Każdy push do repozytorium Git spowoduje automatyczne ponowne wdrożenie.

Własny VPS – pełna kontrola, ale i odpowiedzialność

Własny VPS (Virtual Private Server) to wirtualny serwer, który wynajmujesz od dostawcy usług hostingowych. Daje Ci pełną kontrolę nad środowiskiem serwera, ale wiąże się również z większą odpowiedzialnością za jego konfigurację i utrzymanie. Wybierając tą opcję zakładam iż masz już jakie kolwiek pojecie co to jest Linux i jak go używać.

Krok po kroku: Wdrażanie aplikacji Node.js na własnym VPS (z użyciem PM2 i Nginx)

1. Wybór dostawcy VPS: Wybierz dostawcę VPS (np. DigitalOcean, Linode, Vultr, OVH, Oracle…). Utwórz instancję serwera z systemem Linux (np. Ubuntu).

2. Logowanie do serwera: Zaloguj się do serwera za pomocą SSH.

3. Instalacja Node.js i npm: W tym miejscu mamy 2 rozwiązania albo instalacja Node.js z repozytorium systemu np. za pomocą apt na Ubuntu:

sudo apt update
sudo apt install nodejs

lub instalacja nvm (Node Version Manager), który pozwala na zarządzanie różnymi wersjami Node.js. Dokładna instrukcja instalacji znajduje się tutaj. Ale wystarczy uruchomić następujące komendy (pochodzą one z oficjalnego poradnika instalacji nvm):

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash

export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm

nvm install lts

4. Przeniesienie projektu na serwer: Przenieś swój projekt na serwer. Możesz to zrobić za pomocą git clone (jeśli Twój projekt jest w repozytorium Git) lub scp (jeśli chcesz skopiować pliki lokalnie).

5. Instalacja zależności: W katalogu z projektem uruchom npm install, aby zainstalować wszystkie zależności zdefiniowane w pliku package.json.

6. Instalacja i konfiguracja PM2: PM2 to menedżer procesów dla Node.js, który zapewnia, że Twoja aplikacja będzie działać nieprzerwanie. Zainstaluj go globalnie:

npm install -g pm2

Uruchom aplikację za pomocą PM2:

pm2 start index.js

PM2 będzie monitorować aplikację i automatycznie ją restartować w przypadku awarii.

7. Instalacja i konfiguracja Nginx (opcjonalnie, ale zalecane): Nginx to popularny serwer HTTP i reverse proxy. Pozwala na obsługę wielu aplikacji na jednym serwerze i poprawia wydajność. Zainstaluj Nginx:

sudo apt install nginx

Skonfiguruj Nginx, aby przekierowywał ruch na port, na którym działa Twoja aplikacja Node.js. Utwórz plik konfiguracyjny dla swojej aplikacji w /etc/nginx/sites-available/:

server {
    listen 80;
    server_name twoja-domena.pl; # Zastąp swoją domeną

    location / {
        proxy_pass http://localhost:3000; # Zastąp portem, na którym działa Twoja aplikacja
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

Utwórz link symboliczny do pliku konfiguracyjnego w /etc/nginx/sites-enabled/:

sudo ln -s /etc/nginx/sites-available/twoja-domena.pl /etc/nginx/sites-enabled/

Zrestartuj Nginx:

sudo systemctl restart nginx

Podsumowanie

Omówiliśmy cztery główne sposoby wdrażania aplikacji Node.js:

• Heroku: Prosty i szybki start, idealny dla początkujących i małych projektów.
• AWS: Potężna platforma z szerokim zakresem usług, dająca dużą elastyczność i kontrolę.
• Vercel: Doskonały wybór dla aplikacji frontendowych i serverless.
• Własny VPS: Pełna kontrola, ale wymaga więcej konfiguracji i odpowiedzialności.

Praca domowa

1. Wybierz jedną z platform (Heroku, Vercel lub AWS) i wdróż na niej swoją prostą aplikację Node.js. Może to być aplikacja “Hello World” z Express.js.
2. Jeśli masz dostęp do serwera VPS, spróbuj wdrożyć na nim aplikację, korzystając z PM2 i Nginx. To świetne ćwiczenie, które pozwoli Ci lepiej zrozumieć proces wdrażania.
3. Porównaj różne platformy pod kątem ceny, łatwości użycia i funkcjonalności. Zastanów się, która platforma będzie najlepsza dla różnych typów projektów.

Zachęcam do eksperymentowania i zadawania pytań! Pamiętaj, że praktyka czyni mistrza. Im więcej będziesz ćwiczyć, tym lepiej zrozumiesz proces wdrażania aplikacji. Zapraszam również do lektury pozostałych wpisów na naszym blogu, gdzie znajdziesz więcej informacji na temat programowania w JavaScript i Node.js.