💻 macOS / Windows ツールセットアップガイド
目的: Node.js LTS・Firebase CLI・GitHub CLI を導入して、Firebase Hosting × GitHub Actions 環境をすぐに構築できるようにします。
🍎 macOS のセットアップ
1. Homebrew のインストール(未導入の場合)
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
2. nvm 経由で Node.js LTS を導入
brew install nvm
mkdir -p ~/.nvm
echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.zshrc
echo '[ -s "/opt/homebrew/opt/nvm/nvm.sh" ] && \\. "/opt/homebrew/opt/nvm/nvm.sh"' >> ~/.zshrc
source ~/.zshrc
nvm install --lts
nvm use --lts
node -v
npm -v
3. Firebase CLI のインストール
npm install -g firebase-tools
firebase --version
firebase login
4. GitHub CLI のインストール
brew install gh
gh --version
gh auth login
5. Git 初期設定
git config --global user.name "Your Name"
git config --global user.email "you@example.com"
git config --global core.autocrlf input
🪟 Windows のセットアップ
1. Node.js(LTS)
方法A: 公式サイト から LTS をダウンロードし、npm を含めてインストールします。
方法B: nvm-windows を利用する場合:
winget install CoreyButler.NVMforWindows
# 再起動後
nvm install 20
nvm use 20
node -v
npm -v
2. Firebase CLI
npm install -g firebase-tools
firebase --version
firebase login
3. GitHub CLI
winget install GitHub.cli
gh --version
gh auth login
4. Git 初期設定
git config --global user.name "Your Name"
git config --global user.email "you@example.com"
git config --global core.autocrlf true
✅ 動作確認(共通)
firebase --version→ バージョンが表示されればOKfirebase login→ ブラウザが開きログインできればOKgh auth status→ GitHub ログイン済みであればOK
🧭 トラブルシュート
- firebase: command not found
npm PATH を確認。npm config get prefixのbinを PATH に追加。 - gh: command not found
CLI 未導入。mac はbrew install gh、Windows はwinget install GitHub.cli - Node バージョン不一致
nvm useで統一。
🧩 次のステップ
-
リポを clone して作業ブランチを作成
# リポをクローン git clone https://github.com/myamagat/cxps_mail_link_starter.git cd cxps_mail_link_starter # ブランチ作成 # 例: 新しい記事を追加する場合 git switch -c feat/add-new-article # 作業後コミット git add . git commit -m "feat: 新しい記事を追加" git push -u origin feat/add-new-article -
ローカルでエミュレータ起動し表示確認
# Firebase プロジェクトを選択(初回のみ) firebase use staging # Hosting エミュレータを起動 firebase emulators:start --only hosting # ブラウザで確認 # http://127.0.0.1:5000 にアクセス