インストールと環境設定

ボブは、あるテック企業に就職したばかりのフロントエンド開発者です。初日、メンターからプロジェクトのリポジトリURLを渡されました。リポジトリをクローンした後、npm installを実行したところ、多数のエラーが発生しました。調べてみると、会社のプロジェクトではNode.js 22 LTSが使用されていたのに対し、彼のローカルマシンではまだ古いバージョン18が動作していたことが判明しました。直接アップグレードすると他のレガシープロジェクトに影響が出るのではないかと心配したボブは、ジレンマに陥りました。幸いなことに、メンターがnvmを勧めてくれたおかげで、彼は異なるNode.jsバージョンを自由に切り替えることができるようになり、各プロジェクトが互いに干渉することなく、それぞれ互換性のあるバージョンを使用できるようになりました。それ以来、ボブはバージョン間の競合について心配する必要がなくなりました。

学習内容

• nvm を使用した Node.js のインストールとバージョンの切り替え
• Node.js と npm が正常にインストールされていることを確認してください
• REPL対話型環境でJavaScriptコードを実行する
• 初めてのNode.jsスクリプトを作成して実行する
• npm init を使用して、package.json プロジェクト設定ファイルを作成します

1. nvm のインストールと使用方法

(1) なぜnvmが必要なのでしょうか？

Node.js は頻繁に更新されており、プロジェクトによって依存するバージョンが異なる場合があります。nvm（Node Version Manager）を使用すると、同じマシンに複数のバージョンの Node.js をインストールし、必要に応じて切り替えることができるため、バージョンの競合を回避できます。

(2) nvm をインストールする

macOS / Linux:

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

インストールが完了したら、ターミナルを再起動するか、次のコマンドを実行してください：

source ~/.bashrc

Windows：

Windows ユーザーは nvm-windows を利用できます。インストーラーをダウンロードしたら、ウィザードの指示に従ってインストールを完了してください。

(3) Node.js のバージョンのインストールと切り替え

nvm install 22
nvm use 22
nvm alias default 22

▶ 例：Node.js 22 LTS のインストールと切り替え

$ nvm install 22
Downloading and installing node v22.11.0...
Now using node v22.11.0 (npm v10.9.0)

$ nvm use 22
Now using node v22.11.0 (npm v10.9.0)

$ nvm current
v22.11.0

(4) Node.js のインストール方法の比較

2. Node.js のインストールを確認する

(1) Node.js のバージョンを確認する

インストールが完了したら、ターミナルを開き、次のコマンドを入力してください：

node --version

出力が v22.11.0 のようであれば、Node.js が正しくインストールされていることを意味します。

(2) npmのバージョンを確認する

npm は Node.js とともにインストールされます。これを確認するには：

npm --version

出力が 10.9.0 のような形式であれば、npm が利用可能であることを意味します。

▶ 例：検証プロセスの全手順

$ node --version
v22.11.0

$ npm --version
10.9.0

$ node -e "console.log('Node.js is working!')"
Node.js is working!

ヒント：node -e を使用すると、JavaScript コードを 1 行だけ直接実行できます。これは、手っ取り早くテストを行う際に便利です。

3. REPL 対話型環境

(1) REPL の起動と終了

ターミナルで node と入力して、REPL（Read-Eval-Print Loop）対話型環境に入ります：

node

終了するには：.exit と入力するか、Ctrl + C を 2 回押してください。

(2) 一般的なREPLコマンド

(3) 複数行入力

REPLは、閉じられていない丸括弧や中括弧を自動的に検出し、複数行入力モードに入ります：

> function add(a, b) {
...   return a + b;
... }
undefined
> add(3, 5)
8

▶ 例：REPLでのコードの素早いテスト

> const prices = [9.99, 24.5, 3.75, 18.0]
undefined
> prices.filter(p => p > 10).reduce((sum, p) => sum + p, 0)
42.5
> const total = prices.reduce((sum, p) => sum + p, 0)
undefined
> total
56.24

4. 最初のスクリプトを実行する

(1) JavaScript ファイルを作成する

hello.js という名前の新しいファイルを作成します：

const greeting = 'Hello, Node.js!';
console.log(greeting);

const version = process.version;
console.log(`Running on ${version}`);

(2) node コマンドを使用して実行する

node hello.js

▶ 例：スクリプトの実行とパラメータの渡し方

作成者：greet.js：

const name = process.argv[2] || 'World';
console.log(`Hello, ${name}!`);
console.log(`Node version: ${process.version}`);
console.log(`Current directory: ${process.cwd()}`);

実行：

$ node greet.js Bob
Hello, Bob!
Node version: v22.11.0
Current directory: /home/bob/projects/demo

(3) process オブジェクトの概要

process は、Node.js のグローバルオブジェクトであり、require なしでも使用できます。共通のプロパティ：

5. package.json の作成

(1) npm init を使用して対話形式で作成する

npm init

npm は、プロジェクト名、バージョン、説明などの情報を順次入力するよう促し、最終的に package.json を生成します。

(2) npm init -y を使ってプロジェクトをすばやく作成する

npm init -y

-y はすべての質問をスキップし、デフォルト値を使用して package.json を生成するため、すぐに使い始めるのに最適です。

▶ 例：npm init -yによって生成された package.json

$ mkdir my-app && cd my-app
$ npm init -y

{
  "name": "my-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

(3) package.json 内の主要なフィールドの説明

(4) セマンティックバージョンの範囲表記

6. 一般的な開発ツール

(1) VS Code のインストールと設定

VS Codeは、Node.js開発において最も人気のあるエディタであり、ターミナルとデバッガーが組み込まれています。

(2) おすすめの Node.js 拡張機能

(3) VS Code の組み込みターミナル

キーボードショートカット Ctrl + を使って組み込みのターミナルを開けば、エディタとターミナルを切り替える必要がなくなります。

▶ 例：Node.js をデバッグするために VS Code を設定する

プロジェクトのルートディレクトリに .vscode/launch.json を作成します：

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "skipFiles": ["<node_internals>/**"],
      "program": "${workspaceFolder}/index.js"
    }
  ]
}

F5 を押して、デバッグを開始してください。

7. nvm を使った Node.js の複数バージョンの管理手順

flowchart TD
    A[Installation nvm] --> B[nvm install 22]
    B --> C[nvm install 18]
    C --> D[nvm use 22]
    D --> E{Project Switching?}
    E -->|Enter the Project A| F[nvm use 22]
    E -->|Enter the Project B| G[nvm use 18]
    F --> H[node --version Verification]
    G --> H
    H --> I[Run Project]
    I --> E

flowchart TD
    A[Installation nvm] --> B[nvm install 22]
    B --> C[nvm install 18]
    C --> D[nvm use 22]
    D --> E{Project Switching?}
    E -->|Enter the Project A| F[nvm use 22]
    E -->|Enter the Project B| G[nvm use 18]
    F --> H[node --version Verification]
    G --> H
    H --> I[Run Project]
    I --> E

8. 総合的な例：Node.js プロジェクトをゼロから作成する

以下の手順では、Node.js のインストールから最初のスクリプトの実行に至るまでの全プロセスを解説します：

# 1. Install and switch to Node.js 22 LTS
nvm install 22
nvm use 22

# 2. Verify the Installation
node --version
npm --version

v22.11.0
10.9.0

# 3. Create a project directory and initialize it
mkdir bob-project
cd bob-project
npm init -y

作成者：index.js：

const projectName = require('./package.json').name;
const version = process.version;

console.log(`Project: ${projectName}`);
console.log(`Node.js: ${version}`);
console.log(`Directory: ${process.cwd()}`);

const items = ['setup', 'config', 'deploy'];
items.forEach((item, index) => {
  console.log(`Step ${index + 1}: ${item}`);
});

進行中のプロジェクト：

node index.js

Project: bob-project
Node.js: v22.11.0
Directory: /home/bob/bob-project
Step 1: setup
Step 2: config
Step 3: deploy

❓ よくある質問

📖 まとめ

• nvm は、Node.js の複数のバージョンを管理するのに最適なツールです。バージョンのインストール、切り替え、およびデフォルトバージョンの設定をサポートしています。
• node --version および npm --version は、インストールが正常に完了したかどうかを確認するために使用されます
• REPLは対話型の実行環境を提供しており、コードスニペットを素早くテストするのに最適です
• node <file> を使用して JavaScript スクリプトを実行し、process.argv を使用してコマンドライン引数を取得します
• npm init -y package.json ファイルを素早く作成します。これがプロジェクトの初期化における最初のステップです。
• VS Code と Node.js の拡張機能は、開発ツールの中で最も人気のある組み合わせです

📝 練習問題

1. nvm を使用して Node.js 22 LTS をインストールし、デフォルトのバージョンとして設定する
2. REPL に入り、配列内のすべての偶数の和を計算する関数を定義し、結果を確認する
3. プロジェクトディレクトリを作成し、npm init -y を使用して初期化した後、package.json 内の name および description フィールドを変更します。
4. 現在の Node.js のバージョン、オペレーティングシステムのプラットフォーム (process.platform)、およびランタイム (process.uptime()) を出力するスクリプト info.js を作成してください。
5. VS Code に Node.js Extension Pack をインストールし、launch.json を設定して、スクリプトのデバッグと実行に成功する

Web-Tutorial 技術チーム

複数の開発者によって共同維持されているプログラミングチュートリアルプラットフォーム。各チュートリアルは専門分野の開発者が執筆・レビューしています。正確で信頼性の高いコンテンツを目指しています — 問題を見つけた場合はお知らせください。

私たちについて