こんにちは！プログラミング学習シリーズ第2回へようこそ。
前回はWeb開発の全体像について学びましたね。
今回は、実際にプログラミングを始めるために必要なMac環境の構築について、初心者の方でも迷わないよう丁寧に解説していきます。
この記事を読み終える頃には、プロのエンジニアと同じような開発環境が手に入り、すぐにコードを書き始められるようになりますよ！
なぜMacがプログラミングに最適なのか？
まず、「なぜプログラミング学習にMacを推奨するのか？」について簡単に説明しましょう。
Mac の4つのメリット
1. UNIXベースで開発環境が作りやすい
- MacはUNIXというOSをもとに作られているため、多くのプログラミング言語やツールとの相性が抜群
- Windowsのように面倒な設定作業が少ない
2. 直感的で使いやすい操作性
- iPhoneと同じApple製品なので、操作が分かりやすい
- ソフトのインストールもドラッグ&ドロップで簡単
3. iOSアプリ開発が可能
- iPhoneアプリを作るには、Macが必須
- 将来的にアプリ開発にチャレンジしたい方には必要不可欠
4. 安定性とセキュリティの高さ
- フリーズやクラッシュが少なく、長時間の作業でも安心
- セキュリティ面でも優秀で、ウイルス対策の心配が少ない
プログラミング学習に必要なMacのスペック
「どのくらいのスペックがあれば大丈夫？」という疑問にお答えします。
推奨スペック（2025年版）
| 項目 | 最低ライン | 推奨スペック | 理由 |
|---|---|---|---|
| CPU | M1チップ | M4チップ | 最新のM4は最大23倍高速化、Apple Intelligence対応 |
| メモリ | 16GB | 16GB〜24GB | 現在は16GB標準搭載、Apple Intelligence使用に最適 |
| ストレージ | 256GB | 512GB | 開発ツールやプロジェクトファイルを余裕で保存 |
| 予算 | 14〜16万円 | 17〜22万円 | – |
最新情報（2025年3月）
M4チップ搭載のMacBook Airが発売開始！価格据え置きで16GB標準搭載、新色スカイブルーも登場。Intel製のMacは避けて、最新のM4チップを選びましょう。
必須アプリケーションのインストール
Macが手に入ったら、まず以下のアプリケーションをインストールしましょう。
1. Homebrew（最重要！）
Homebrewとは？ Homebrewは、Macのパッケージ管理システムです。プログラミングに必要なツールを、コマンド一つで簡単にインストールできるようになります。
Homebrewを使う5つのメリット
1. 一元管理で迷わない
- インストールしたソフトウェアをすべて一箇所で管理
- 「あれ？何をインストールしたっけ？」がなくなる
brew listで一覧確認、brew uninstallで簡単削除
2. プログラミング言語の管理が楽
- Python、Node.js、Ruby などの言語を簡単インストール
- バージョン管理も自動で行ってくれる
- 「どのバージョンを入れたか分からない」問題を解決
3. 依存関係を自動解決
- 必要なライブラリも自動でインストール
- 「○○が足りません」エラーが激減
- 初心者でも安心してツールを使える
4. アップデートが超簡単
brew update && brew upgradeで全ツールを最新版に- 一つずつ公式サイトを回る必要なし
- セキュリティアップデートも自動適用
5. 削除・再インストールが安全
- 不要になったらクリーンに削除
- 他のアプリに影響を与えない
- パソコンの中がゴチャゴチャにならない
具体例：Homebrewがない場合の大変さ
Homebrewなしの場合：
- Pythonの公式サイトに行く
- ダウンロード→インストール
- Node.jsの公式サイトに行く
- ダウンロード→インストール
- Gitの公式サイトに行く…
- （以下延々と続く）
Homebrewありの場合：
brew install python node git
（3つまとめて一瞬で完了！）
インストール方法：
1.ターミナルを開く
Launchpad→その他→ターミナル- または
⌘ + スペースで検索窓を開き「ターミナル」と入力
2.Homebrewのインストールコマンドを実行
公式サイト（https://brew.sh/ja/）からコマンドをコピーして実行します：（矢印の部分をコピー）
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
3.パスワードの入力
- コピーしたコマンドを貼り付けてエンターを押す
- Macのログインパスワードを入力（文字は表示されませんが入力されています）
Press RETURN to continueと表示されたらEnterキーを押す
4.パスの設定
インストール完了後、以下のコマンドを実行：
echo 'eval $(/opt/homebrew/bin/brew shellenv)' >> ~/.zprofile eval $(/opt/homebrew/bin/brew shellenv)5.インストール確認
brew --version バージョン情報が表示されればインストール成功！（数字は4.5.3じゃなくてOK）
2. Visual Studio Code（VSCode）
VSCodeとは？ 世界で最も人気のあるコードエディタです。軽量でありながら高機能で、初心者からプロまで愛用されています。
インストール方法（Homebrew使用）：
brew install --cask visual-studio-code
または公式サイトから：
- https://code.visualstudio.com にアクセス
- 「Download for Mac」をクリック
- ダウンロードした.zipファイルを解凍
- Visual Studio Code.appを「アプリケーション」フォルダにドラッグ
※基本的には、Homebrewでのインストールをおすすめします。（一元管理できるため）
3. Google Chrome
プログラミングでは、複数のブラウザでの動作確認が必要です。ChromeはWebエンジニアの必須ツールです。
brew install --cask google-chrome4. Git
バージョン管理システムのGitも必須です。
brew install gitVSCodeの基本設定とおすすめ拡張機能
VSCodeをインストールしたら、使いやすくするための設定を行いましょう。
VSCode拡張機能の設定
まずは日本語化だけ行いましょう。他の拡張機能は、実際にプログラミングを始めてから必要に応じて追加していけば大丈夫です。
日本語化
- VSCodeを起動
- 左サイドバーの拡張機能アイコン（□が4つ）をクリック
- 「Japanese Language Pack」を検索してインストール
- VSCodeを再起動すると、日本語で表示されます
Japanese Language Packのインストール画面
💡 プチアドバイス
最初は日本語化だけで十分です。プログラミングに慣れてきたら、必要な拡張機能を少しずつ追加していきましょう。一度にたくさん入れると、どれが何の機能か分からなくなってしまいます。
基本設定のカスタマイズ
設定画面（⌘ + ,）で以下の設定をおすすめします：
- Font Size: 14px（見やすいサイズに調整）
- Tab Size: 2（インデントサイズ）
- Auto Save: afterDelay（自動保存で作業ロスを防ぐ）
よく使うコマンドライン操作
プログラミングでは、コマンドライン（ターミナル）での操作が頻繁にあります。最初に覚えておくべき基本コマンドをご紹介します。
🔧 基本的なコマンド
# 現在のディレクトリを表示
pwd
# ディレクトリの中身を表示
ls
# ディレクトリの詳細な中身を表示
ls -la
# ディレクトリ移動
cd フォルダ名
# 一つ上のディレクトリに移動
cd ..
# ホームディレクトリに移動
cd ~
# フォルダ作成
mkdir フォルダ名
# ファイル作成
touch ファイル名
# ファイル・フォルダ削除
rm ファイル名
rm -rf フォルダ名🎯 実践例
プログラミング用のフォルダを作成してみましょう：
# ホームディレクトリに移動
cd ~
# プログラミング用フォルダを作成
mkdir programming
# 作成したフォルダに移動
cd programming
# HTMLプロジェクト用フォルダを作成
mkdir my-first-website
# プロジェクトフォルダに移動
cd my-first-website
# HTMLファイルを作成
touch index.html
# VSCodeでプロジェクトを開く
code .
開発環境のテスト
環境構築が完了したら、実際に動作するかテストしてみましょう。
HTMLファイルの作成と確認
1.VSCodeで新しいHTMLファイルを作成
VSCodeでのHTMLファイル作成画面
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>はじめてのWebページ</title>
</head>
<body>
<h1>プログラミング学習環境構築完了！</h1>
<p>これからWeb開発の旅が始まります🚀</p>
</body>
</html>
2.ブラウザでファイルを開く
- Finderでファイルを右クリック → 「このアプリケーションで開く」→ ブラウザを選択
- またはファイルをブラウザにドラッグ&ドロップ
- ページが表示されれば成功！
💡 Live Serverについて
後でLive Server拡張機能を入れると、リアルタイムプレビューができて便利です。でも最初は基本的なブラウザ表示ができれば十分です！
Gitの動作確認
# Gitの設定
git config --global user.name "あなたの名前"
git config --global user.email "your.email@example.com"
# 設定確認
git config --list
まとめ：これで開発環境の準備完了！
お疲れさまでした！今回の作業で、プロのエンジニアと同じような開発環境が整いました。
🎯 今後の学習ステップ
環境が整ったので、次回からは実際にコードを書いていきます！
次回予告：第3回「コマンドライン操作入門」
- ターミナルをもっと使いこなす方法
- ファイル操作の実践
- プロジェクト管理の基本
- ショートカットキーで作業効率アップ
環境が整ったので、次回からは実際にコードを書いていきます！
環境構築は最初の山場ですが、これを乗り越えれば楽しいプログラミングの世界が待っています！
分からないことがあれば、ネットや生成AIで調べてください。
Xでの質問も待ってます！
