エックスサーバーVPSでNode.jsをインストールしてみる【Nginx/Nest.js】

エックスサーバーVPSはVPSなのでNode.jsももちろんインストールして使うことができます。

この記事でNode.jsをエックスサーバーVPSにインストールして使うっていうことをやっていきますよ。

エックスサーバーVPSでNode.jsを使ってプログラムを動かしてみたかったら参考にしてみてください。

エックスサーバーVPSにNode.jsをインストールして使ってみよう。

エックスサーバーVPSでサーバーを立てる

まずはXserver VPSでサーバーを立てます。

自分は既にエックスサーバーVPSを契約しているので、それを使ってNode.jsをインストールしていきます。

今回はUbuntu22.04、メモリ2GBでやっていきます。

エックスサーバーVPSをこれから使ってみようと考えている場合は、以下の記事でどのプランを選んだらいいのか？などを確認しておくといいです。

エックスサーバーVPSのおすすめ料金プラン・契約期間は？

2022.11.27

エックスサーバーVPSどのプラン選んだらいいんだろう？ プランを見てみたときにどのプランにするか迷ってしまうものですよね。この記事ではそんな悩みを解消するために、エックスサーバーVPSのどのプランを使ったらいいのかを書いていきます。 記事の内容 エックスサーバーVPSの料金プラン おすすめ料金プラン...

立てたサーバーに接続する(コンソール or SSH接続)

エックスサーバ-VPSにはコンソールがついているので、それを使って作業してもいいです。

ただコンソールで作業するよりもSSH接続した方が作業しやすいので、SSH接続して作業していきます。

ssh -i 秘密鍵 root@ipアドレス

サーバー作成時にSSH Keyを生成すると秘密鍵をダウンロードできるので、それを使って接続することができます。

IPアドレスは管理画面に書かれているものですね。

SSH接続できたら、後はコマンドでいろいろな作業をしていくことができます。

サーバーにNode.jsをインストールする

SSH接続してサーバーに入れたらNode.jsをインストールしてみます。

// パッケージを更新する
$ apt update
$ apt upgrade

// Node.jsをインストールする
$ apt install nodejs
$ node -v
v12.22.9

これでNode.jsをインストールすることができました。

Node.jsを実行してみる

Node.jsをインストールすることができたので、実際にこれを使って何か実行してみましょう。

Node.jsでhttpサーバーを立ててHello Worldする

ブラウザにアクセスしたらHello Worldが表示されるようにコードを記述しておきます。

$ vi app.js

const http = require('http');

const hostname = 'IPアドレス';
const port = 80;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello World');
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

このプログラムを実行したらブラウザからアクセスするとHello Worldが表示されるんですが、その前にポートがデフォルトで制限されているので、それを解放します。

80番ポートを開ける

エックスサーバーVPSの管理画面から接続許可ポートでWeb(20/21/80/443)をONにします。

これで80番ポートでにアクセスが可能になったので、ブラウザから確認してみます。

ブラウザからIPアドレスを入力して確認する

さっき書いたプログラムを実行してブラウザから確認しましょう。

$ node app.js
Server running at http://xxx.xx.xx.xxx80/

IPアドレスを入力するとちゃんとHello Worldが表示されましたね。

エックスサーバーVPSにNest.js × Nginxをインストールして動かす

あまりnodeのhttpサーバーだけで何かを動かすっていうことは少ないと思うので、WebサーバーのNginxと組み合わせて動かしてみたいと思います。

せっかくなのでNest.jsを使ってみましょう。

Nest.jsをインストール

Nest.jsをインストールしてアプリケーションを作成します。

$ apt install npm
$ npm i -g @nestjs/cli
$ nest new my-nest-app

これでアプリケーションが作成されましたね。

$ cd my-nest-app
$ ls
README.md      node_modules       package.json  test                 tsconfig.json
nest-cli.json  package-lock.json  src           tsconfig.build.json

これでnpm startすると起動するんですが、Nginxを使いたいので、先にNginxの設定を済ませます。

Nginxをインストール

Nginxをインストールします。

$ apt install nginx -y

インストールしたら起動しておきます。

$ systemctl start nginx
// active(runnning)ならOK
$ systemctl status nginx
● nginx.service - A high performance web server and a reverse proxy server
     Loaded: loaded (/lib/systemd/system/nginx.service; enabled; vendor preset: enabled)
     Active: active (running) since Sun 2022-12-25 09:53:19 JST; 5s ago
       Docs: man:nginx(8)

これで一度ブラウザで表示を確かめておきます。

Nginxの初期ページが表示されましたね。

Nginxの設定ファイルを記述する

NginxからNest.jsのサーバーに繋げたいので、その設定ファイルを作成します。

$ vi /etc/nginx/conf.d/app.conf

server {
        listen  80;
        server_name IPアドレス;
        location / {
                proxy_pass http://localhost:3000;
        }
}

本当に最小限だけど、これでlocalhost:3000で起動しているNest.jsのサーバーにアクセスして表示できるはず。

最後にNginxは再起動しておきましょう。

$ sudo service nginx restart

ブラウザから確認する

Nest.jsで作成したアプリケーションのディレクトリに移動してnpm startします。

$ npm start

> my-nest-app@0.0.1 start
> nest start

これでブラウザにアクセスしてみるとちゃんと表示されましたね。

ちなみにこの表示はNest.jsで作成したアプリケーション内src/app.service.tsのgetHello()が表示されています。

$ vim src/app.service.ts

import { Injectable } from '@nestjs/common';

@Injectable()
export class AppService {
  getHello(): string {
    return 'Hello World!';
  }
}

NginxとNest.jsを使って動かすことができました。

まとめ

今回はエックスサーバーVPSでNode.jsをインストールして使ってみるっていうことをやってみました。

やったこととしては以下です。

無事Node.jsを使って動かすことができました。Node.jsを使ってアプリケーションを公開してみたかったらエックスサーバーVPS使ってみるといいでしょう。

【手順解説】エックスサーバーVPSの申し込み方法と始め方を紹介します。

2022.12.21

エックスサーバーVPS使ってみたいんだけどどう始めたらいいんだろう？ そんな疑問を解消するためにこの記事ではエックスサーバーVPSの申し込み方法と始め方を書いていきます。 サーバーの作成までやるので、順番通りにやれば自分のサーバーが立っている状態になります。 記事の内容 エックスサーバーVPSの申し...