Mac

m2Macで開発環境構築（Homebrewを使ってパッケージを管理する）

  /

今回は新調したMacBook AIr M2 MacOSに開発環境を構築していきます。時が経つと自分がどんなものを利用していたか忘れるので備忘の目的が大きいです。。

Next.js（React）を使用してWebアプリを作成することを目標に想定しています。
DBにはPostgreSQLを使います。

新環境：
OS – M2 MacOS（zshシェル使用）
Node.js, npm
DB – PostgreSQL15

見出し
  1. Homebrewのインストール
  2. Gitのインストール
  3. Node.js・npmのインストール
  4. PostgreSQLのインストール
  5. まとめ

Homebrewのインストール

まずはパッケージを管理するためのHomebrewをインストールします。

Homebrewとは、Mac(またはLinux）のOS上であらかじめ用意されていないパッケージをインストールし管理するためのパッケージ管理システムです。
※公式ページはこちら

それではHomebrewをインストールしていきます。

まず、公式ページを開き、「インストール」用に用意されているコマンドを自分のPCのTerminalで実行します。
https://brew.sh

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

インストールが完了したら、以下のコマンドで入っているか確認します。

brew -v


※「Hombrew x.x.x」のように表示されればOK（x.x.xの部分はバージョン情報）

もし上記のコマンドでbrewが見つかりませんなどのエラーが出る場合はPATHが通っていない可能性があります。

※PATHはHomebrewインストール時のコマンド実行中のメッセージの中で表示されていればそのコマンドを自分で叩いて設定

==> Next steps:

Add Homebrew to your PATH in /Users/hoge/.zprofile:
echo 'eval $(/opt/homebrew/bin/brew shellenv)' >> /Users/hoge/.zprofile
eval $(/opt/homebrew/bin/brew shellenv)

※「hoge」の部分は自分のユーザに合わせて変更

ここ以降はそれぞれのパッケージをインストールしていきます。

Gitのインストール

初めにGitをインストールします。

Gitはソースコードなどの変更履歴などを管理するためのバージョン管理システムです。

以下のコマンドをTerminalで実行します。

brew install git

入っているか確認(バージョン情報が確認できればOK）

git -v

次にNext.jsを開発するためのパッケージをインストールしていきます。

Node.js・npmのインストール

次に、Next.jsを使って開発を行なっていく上で必要なNode.js（npm）のインストールを行います。

Next.jsとは、「Reactをベースにした、JavaScriptのフレームワーク」です。

※JavaScriptとReactとNext.jsの概念的な関係を大雑把に記載すると、
JavaScript：プログラミング言語
React：JavaScriptをもとに作られたUI面に特化したライブラリ
Next.js：そのReactをもとに作られたフレームワーク
→ 個人の認識にはなるが、ライブラリは「あらかじめ特定の目的（ReactはUI特化）のために用意された機能だが、”その利用の仕方やどこまで採用するか”までは使う側が決められる」ことで、フレームワークは「あらかじめ用意された開発の仕組み（Next.jsの場合は大規模や高速なページ遷移などを目的としたWebアプリの開発のための仕組み）に沿って使う」ことになります。

Node.jsはJavaScriptの実行環境です。そのNode.jsのパッケージを管理するのが、npmになります。
この２つが何者なのかは以下のページがとても（抜群に）わかりやすく記載してくれています。

https://qiita.com/non_cal/items/a8fee0b7ad96e67713eb

それでは、以下のコマンドを実行して、まずNode.jsのバージョンを管理するためのNodebrewをインストールします。

brew install nodebrew

※Nodebrew：Nodeのパッケージマネージャー

次に上記のコマンドを実行中にメッセージに表示されたPATH情報を.zshrcに追記します。

echo 'export PATH=$HOME/.nodebrew/current/bin:$PATH' >> ~/.zshrc

※自分のPCでは.zshrcファイルが作られていなかったため、上記のコマンドを実行する前にファイル自体を作成しました。

.zshrcファイルがあるか確認

ls ~/.zshrc

.zshrcファイル作成

touch .~/.zshrc

PATH情報を追記したら、以下のコマンドで変更を反映します。

source ~/.zshrc

そして以下のコマンドを使用してNodebrewのセットアップを行います。

nodebrew setup

Nodebrewが使える状態になったので、以下のコマンドでインストール可能なNode.jsのリストを表示します。

nodebrew ls-remote

それでは今回はNode.jsの安定版をインストールします。

nodebrew install stable

インストールが完了したことを確認するために、インストール済みのリストを表示します。

nodebrew ls

表示されたバージョン（今回はv22.12.0が安定版としてインストールされた）を有効化します。

nodebrew use v22.12.0

ここまでで、Node.jsとnpmが使用できるようになったので、以下のコマンドでそれぞれが使えるようになっているか確認します。

node -v
vpm -v

バージョン情報が表示されれば構築完了になります。

アンインストール時のメモ

以下のコマンドを実行していきます。

brew ls
brew uninstall --force nodebrew
npm ls -g node
npm uninstall -g npm

最後にPostgreSQLを使用できるようにしていきます。

PostgreSQLのインストール

PostgreSQLもHomebrewを使用してインストールします。

※将来的にはDockerとかで管理したい。

まずは以下のコマンドで、Homebrewを使用してインストールできるPostgreSQLのバージョンリストを確認します。

brew search postgresql

今回はバージョン15を使用したいと思いますので、以下のコマンドを実行します。

brew install postgresql@15

インストールが完了したら、以下がバージョンの確認方法になります。

psql --version

※バージョンが確認できない場合はPATHが通っているか確認して、必要であれば設定します。

PATH情報の設定方法は以下になります。

echo 'export PATH="/opt/homebrew/opt/postgresql@15/bin:$PATH"' >> ~/.zshrc

設定内容の反映は以下になります。

source ~/.zshrc

ここまででPostgreSQLが使えるようになりました。

PostgreSQLを使用する

もしPostgreSQLを試したい場合は以下の手順になります。

まずPostgreSQLをHomebrewで起動するコマンドは以下になります。

brew services start postgresql@15

上記が完了したら、以下のコマンドでシステムでのサービスの実行状態を確認します。

brew services list

起動が確認できたら、PostgreSQLを実行できる環境に入ります。

psql -d postgres

ここで行いたい作業などを実行する（データベース作成など）ことができるようになります。

create database my_first_db;

まとめ

以上で、M2 Mac0Sでの開発環境構築が完了しました。