発行:

環境構築(Node.js)

Next.js や React(Vite)などをスムーズに動かすために、まずは実行環境である「Node.js」を準備しましょう。
このページでは、以下のOSごとにNode.jsの導入方法を解説します。
前章でVSCodeを導入済みなら、当章および以降の章でコマンド入力する場面ではVSCodeから「統合ターミナルを開く」によってTerminal(ターミナル)を開いて実行しましょう。

  • MacOS
  • Windows

MacOS での進め方

MacOSでのNode.jsインストールには、いくつかの方法があります。ご自身の開発スタイルに合わせて選択してください。

[推奨] Homebrew を使う方法

Homebrew は MacOS で広く使われているパッケージマネージャーです。
まだ Homebrew をインストールしていない場合は、Terminal を開いて以下のコマンドを実行してください。

COMMAND
# Homebrew インストール
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Homebrew のセットアップが完了したら、次のコマンドでおすすめのNode.js(最新のLTS版など)をインストールします。

COMMAND
# Node.js をインストール
brew install node

# インストールに成功したら、動作を確認してみましょう
node -v

参考: Node.js インストーラを使う方法

コマンドラインに不慣れな場合は、公式サイトからインストーラを利用するのも手軽です。
Node.js 公式サイト (https://nodejs.org/) にアクセスし、MacOS 用インストーラをダウンロードします。

安定版である「LTS (Long Term Support)」の表記があるボタン(Recommended For Most Users)をクリックしてダウンロードしてください。

Node.js 公式サイト

ダウンロードしたパッケージを開き、画面の指示に従ってインストールを完了させてください。

参考: Volta を使う方法

Volta は、手軽で高速な Node.js 管理ツールです。
プロジェクトごとに異なる Node.js の環境を自動で切り替えることができるため、開発が進むにつれて非常に便利になります。

以下のコマンドで Volta をインストールできます。

COMMAND
# Volta インストール
curl https://get.volta.sh | bash

インストール後、一度ターミナルを再起動してから、Node.js をインストールします。

COMMAND
# 最新のLTSバージョンをインストールする場合
volta install node

# 特定のバージョンを指定してインストールする場合
volta install node@latest

インストール完了確認:

COMMAND
node -v

Windows での進め方

Node.js インストーラを使う方法

最も標準的な方法は、公式サイトのインストーラを利用することです。
Node.js 公式サイトからインストーラをダウンロードしてください。 「LTS (Long Term Support)」 と記載された推奨版を選びましょう。

Node.js 公式サイト

インストーラを実行し、画面の案内に沿って進めればインストールは完了です。

参考: Volta を使う方法

Windows でも Volta を利用可能です。管理が容易になるためおすすめです。
PowerShell を「管理者権限」で開き、以下のコマンドを実行します。

COMMAND
# Volta インストール
Invoke-Expression (Invoke-WebRequest https://get.volta.sh | Select-Object -ExpandProperty Content)

インストールが完了したら PowerShell を再起動し、Volta が使えるか確認します。

COMMAND
volta --version

続いて、Node.js をインストールします。

COMMAND
# 最新のLTSバージョンをインストール
volta install node

バージョン確認:

COMMAND
node --version

参考: WSL (Ubuntu) を使う方法

Windows 上で Linux 環境 (Ubuntuなど) を利用できる「WSL (Windows Subsystem for Linux)」を使う方法です。
Web開発の現場では Linux 環境が使われることが多いため、本格的に開発を行いたい方にお勧めの方法です。 要件: Windows 10 (Build 2004 以降) または Windows 11

管理者権限で PowerShell を開き、以下のコマンドを実行します。

COMMAND
wsl --install

インストール後、PCを再起動すると Ubuntu のセットアップ画面が開きます。ユーザー名とパスワードを設定すれば WSL の準備は完了です。


ここからは、Ubuntu ターミナル上での作業になります。
Node.js のインストールにはいくつか方法がありますが、ここでは NodeSource を利用した手順を紹介します。
(例として、推奨される LTS バージョンをインストールします)

COMMAND
# パッケージリストの更新
sudo apt update && sudo apt upgrade -y

# NodeSource リポジトリのセットアップ
curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash -

# Node.js のインストール
sudo apt install -y nodejs

# 動作確認
node --version
npm --version

まとめ

Webアプリケーションの動作に必要な「Node.js」の準備が整いました。
環境構築は最初のハードルですが、これができればあとは開発を楽しむだけです。

次章では、実際にプロジェクトを作成して動かしてみましょう。