Skip to Content
ドキュメントはじめに環境構築Mac

環境構築（Mac）

このページで学ぶこと

  • 開発に必要なツールをMacにインストールできる
  • ターミナルを使った基本操作ができる
  • Node.jsをnvmで管理する理由がわかる

インストールするもの一覧

ツール用途
HomebrewMacのパッケージ管理ツール
VS Codeコードエディタ
Gitバージョン管理（macOSに標準搭載されていますが更新します）
nvmNode.jsのバージョン管理ツール
Node.jsJavaScriptの実行環境

やってみよう

ステップ1: ターミナルを開く

Command + スペース で Spotlight を開き、「ターミナル」と検索して起動しましょう。 以降の手順はすべてターミナルで実行してください。

ステップ2: Homebrew をインストールする

Homebrew は Mac のパッケージ管理ツールで、様々なソフトウェアを簡単にインストールできます。

以下のコマンドをターミナルに貼り付けて実行しましょう。

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
bash

途中でパスワードを求められたら、Mac のログインパスワードを入力します（入力中は何も表示されませんが正常です）。

また、以下のようなメッセージが表示されたら Enter キーを押してインストールを続行してください。

Press RETURN/ENTER to continue or any other key to abort:
bash

インストール完了後、ターミナルの指示に従って PATH の設定をします。
以下のような表示が出たら、表示されたコマンドをそのまま実行しましょう。

==> Next steps:
- Run these commands in your terminal to add Homebrew to your PATH:
    echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> ~/.zprofile
    eval "$(/opt/homebrew/bin/brew shellenv)"
plaintext

M1/M2/M3 Mac（Apple Silicon）と Intel Mac で PATH が異なります。
表示されたコマンドをそのままコピーして実行してください。

Homebrew が使えるようになったか確認してみましょう。

brew --version
bash

Homebrew 5.x.x のように表示されれば成功です。(x には数字が入ります。)

ステップ3: VS Code をインストールする

brew install --cask visual-studio-code
bash

インストール後、VS Code を起動して画面が表示されればOKです。

日本語化する

VS Code の左サイドバーにある拡張機能アイコン (4つの四角形が並んでいるアイコン) をクリックし、Japanese Language Pack を検索してインストールしましょう。 インストール後、右下に「Restart」ボタンが出るので押すと日本語になります。

code コマンドを使えるようにする

code コマンドが使えるようになると、ターミナルから VS Code を起動できるようになります。
開発者はターミナルで様々な操作を行うため、同じ画面で VS Code も起動できるようにしておくと便利です。

VS Code 上で Command + Shift + P を押してコマンドパレットを開き、
Shell Command: Install 'code' command in PATH を検索して実行します。

使えるようになったか確認してみます。

code --version
bash

バージョンが表示されればOKです。

ステップ4: Git をインストールする

macOS には Git が標準搭載されていますが、古い場合があるので Homebrew で最新版を入れます。

brew install git
bash

インストールされたか確認してみます。

git --version
bash

git version 2.xx.x のように表示されれば成功です。

ステップ5: nvm をインストールする

なぜ nvm を使うのか？
Node.js は直接インストールもできますが、プロジェクトごとにバージョンが違うことがよくあります。
nvm を使うと、バージョンを簡単に切り替えられるので、将来プロジェクトに参加するときに役立ちます。

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

インストール後、ターミナルを一度閉じて再度開きます。

nvm がインストールされたか確認してみましょう。

nvm --version
bash

バージョン番号が表示されれば成功です。

表示されない場合
以下をターミナルで実行して、設定ファイルに nvm の読み込みを追加してみてください。

echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.zshrc
echo '[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"' >> ~/.zshrc
source ~/.zshrc
bash

ステップ6: Node.js をインストールする

nvm を使って Node.js をインストールしましょう。

nvm install 24
nvm use 24
bash

Node.js がインストールされたか確認してみましょう。

node --version
npm --version
bash
v24.xx.x
11.x.x
bash

のように表示されれば成功です。

ステップ7: VS Code でターミナルを開く

VS Code を開き、Control + ` ）でターミナルを開きます。
以下を実行して、VS Code 内でも Node.js が使えることを確認します。

node --version
bash

同じバージョンが表示されればOKです。

確認しよう

  • brew --version でバージョンが表示される
  • git --version でバージョンが表示される
  • nvm --version でバージョンが表示される
  • node --version で v24.xx.x が表示される
  • npm --version でバージョンが表示される
  • VS Code のターミナルでも node --version が動く

よくあるエラー

brew: command not found
→ Homebrew インストール後の PATH 設定が済んでいません。
　ターミナルを閉じて再度開き、もう一度 brew --version を試してみてください。
　それでも出る場合は、インストール時に表示された PATH 設定コマンドを再実行してみてください。

nvm: command not found
→ ターミナルを一度閉じて再度開いてみてください。それでも出る場合は上記の .zshrc への追記を試してみてください。

node --version が古いバージョンを返す
→ nvm 以外でインストールした Node.js が残っている可能性があります。
　which node を実行して、/Users/xxx/.nvm/... のパスが返ってくるか確認してください。
　返ってこない場合は nvm use 24 を再実行してみましょう。

AIに聞いてみよう

プロンプト例:
「Mac で nvm をインストールしたのに nvm コマンドが認識されません。原因と対処法を教えてください」

エラーメッセージが出たら、そのまま AI に貼り付けて聞いてみましょう。

次のステップ

→ とんペディアへようこそ
→ AIとの付き合い方

Last updated on
WindowsAIとの付き合い方