Next.js と Node.js を使ってリアルタイムチャットアプリを開発しようと思い、成り行きで環境構築作業を行ったので備忘録としてメモしておきます。今回は OS（ubuntu）を再インストールして、まっさらの状態から作業を行います。

まずは Express 用のユーザーを作成。

sudo adduser node

作成したユーザーに sudo 権限を付与。

sudo gpasswd -a node sudo

node ユーザーに切り替え。

sudo su node

公式ドキュメントを参考に nvm をインストール。

// 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

最新の Node（LTS 版）をインストール。

nvm install --lts

Node の確認。

node -v // 出力結果：v22.14.0

Express を常駐化させたいので pm2 というパッケージをインストール。

npm install pm2 -g

簡単な Express アプリの作成。

const express = require('express')
const app = express()

app.get('/', function (req, res) {
  res.send('Hello World')
})

app.get('/foobar', function (req, res) {
  res.send('foobar')
})

app.listen(3000)

pm2 を使って実行。

pm2 start server.js

試しに curl でリクエスを投げてみる。

curl http://localhost:3000/foobar // 出力結果：foobar

元々は Express をリクエストの受け口にしようと思っていたのですが、色々調べてみたところ nginx をリバプロにしてローカルの Exprees にリクエストするのがお勧めだそうです。まぁ、そちらの方が運用が楽ですよね。（特に証明書の更新作業...）なので急遽 nginx をインストールします。

sudo apt install -y nginx

次にバーチャルホストの設定です。とりあえず海外のテックブログの内容を参考に設定しました。正直完璧には理解できていません...。今後作業を進めていくうちに分かってくるでしょう。

server {
    listen 80;
    server_name xxx.com; // VPS プロバイダーから付与されたドメインを設定

    location / {
        proxy_pass http://localhost:3000; // ここでローカルの Express と紐づける
        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;
    }
}

設定後は念の為シンタックスチェック。

nginx -t

// nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
// nginx: configuration file /etc/nginx/nginx.conf test is successful

バーチャルホストの有効化。sites_enabled にシンボリックリンクを作成。

sudo ln -s /etc/nginx/sites-available/xxx.com.conf /etc/nginx/sites-enabled/

nginx の再起動と確認。

sudo systemctl restart nginx
sudo systemctl status nginx

node@t:/home/ubuntu$ sudo systemctl status nginx
     Loaded: loaded (/usr/lib/systemd/system/nginx.service; enabled; preset: enabled)
     Active: active (running) since Sat 2025-03-08 21:40:25 JST; 10s ago
       Docs: man:nginx(8)
       .....

この時点で 80 ポート（HTTP）でのアクセスは可能になります。スクショはないですが、ちゃんとレスポンスが返ってきました。つまり、リバプロ（nginx）経由で Express にアクセスできたということです。レスポンスが返ってこなかった場合はポートが開いているか確認してみてください。また、VPS 側にパケットフィルタが設定されている場合があるので両方チェックすることをお勧めします。

続いて certbot を使って SSL 対応をします。まずはインストール。※ python3-certbot-nginx というパッケージもインストールしないと動きませんでした。

sudo apt install -y certbot python3-certbot-nginx

証明書の取得 & 設定。たったこの1行だけで全てやってくれます。ありがとう Let's Encrypt。

sudo certbot --nginx -d xxx.com

証明書の発行 & 設定に成功すると SSL が有効化され HTTPS でのアクセスが可能になります。とりあえずコレにて作業は完了です。ちなみに、Let's Encrypt で発行した証明書の有効期間は 90 日なので更新頻度が高めです。サーバを長く運用する場合は cron を使って自動更新するのがお勧めです。今回は保留。証明書の更新コマンドはこちら。

sudo certbot renew

久しぶりのインフラ周りの環境構築だったのでかなり調べながら作業を行いました。最近は Vercel なんかの無料ホスティング・デプロイメントサービスばかり使用するので完全に知識が薄れていっていますね〜。

#nginx