Shion のもくログ(旧: Shion の技術メモ)

使った技術のメモや、うまくいかなかった事とかを綴ります

PR

[2024年版] macOS に自分好みのモバイルアプリ開発環境を整えてみた

今回の発端

[2019年版] macOS に自分好みのモバイルアプリ開発環境を整えてみた を書いてから、早いもので約4年経ちました。

その間にあった大きな変化といえば、2020年後期に登場したApple シリコン ではないでしょうか。 Intel プロセッサと比べて消費電力あたりのパフォーマンスが優れており、 発熱が抑えられたり、バッテリーの持ちが長くなったと言われております。 しかし発売当初は、色々なソフトウェアの対応が追いついておらず、購入すべきか迷っておりました。

そんな中、私事ではありますが2022年頃に転職をし、 業務用のPC としてApple シリコンのMacBook をお借りすることになりました。 そして約1.5年ほど使ってみたところ、ソフトウェア面の対応も充実してきており、 私用PC を変えても問題なさそうという印象を持つようになりました。

そこで今回、私用PC も新しいものに変えることにしました。 いつもながら設定内容をよく忘れてしまうので、備忘を兼ねて記録を残していこうと思います。

参考: Apple、M1チップを発表 - Apple (日本)

状況の整理

マシンスペックの変化

比較項目 2019年版 2024年版
モデル名 MacBook Pro(13-inch, 2019, Four Thunderbolt 3ports) MacBook Pro(14インチ、11月 2023)
OS macOS Mojave(10.14.5)
↓
macOS Ventura(13.6.1)		 macOS Sonoma(14.1)
↓
macOS Sonoma(14.2.1)
CPU 2.4 GHz Intel Core i5 Apple M3
メモリ 16GB 2133 MHz LPDDR3 16GB
シェルコマンド(※) bash zsh

※シェルコマンドのデフォルト値は、macOS バージョンによって違うので、参考のため記載します。

2023年頃の開発スタイル

  • メインスキル: Android アプリの開発
    • 補足: CI/CD でJava バージョンを揃えたりするので、jenv を導入したい
    • 補足: Android WebView のデバッグにChrome を利用するので、Chrome を普段使いから外したい
      • 以前デバッグ中にChrome がクラッシュし、色々開いていたものもいっぺんに消えてしまい、面倒だと思ったため
  • サブスキル
    • .NET を利用した開発
      • 補足: Visual Studio for Mac は開発終了になったので、インストールしない
    • iOS アプリの開発
      • 補足: CocoaPods を利用する場合、Ruby のbundler でセットアップすることが多いので、直にインストールしない
      • 補足: iOS WebView のデバッグにSafari を利用するので、Safari を普段使いから外したい
      • 補足: 普段使いのXcode はApp Store 経由でインストールしたい
        • 以前はApple Developer から直接インストールしていたが、Xcode 設定を都度適用しないといけなかったので、運用を変更することにした
    • Node.js + TypeScript を利用した開発
      • 補足: Web フロントエンドの変化は激しいですが、それに追従出来るほどの時間を確保できていないので、最低限のセットアップに留めたい
  • ソース管理: GitHub(Git)
    • 補足: Git クライアントとしてVSCode を利用したい
      • Android Studio やXcode などは立ち上がりがどうしても遅いので、比較的軽量なVSCode をサブエディターとして運用しているため

導入したいもの

開発スタイルを受けて、下記のように整理しました。 今回のマシンに導入した結果、約75GB ほどのストレージを消費したので、ご注意ください。

構築手順

まずはオフラインで作業できることをやっていきます。 その後ネット接続をし、セキュリティ対策を施してから、各種セットアップをしていきます。

1. OS 設定の調整

  1. "システム設定" の調整
    1. "デスクトップとDock" の調整
      • "アプリの提案と最近使用したアプリをDock に表示" のチェックを外す
    2. "トラックパッド" の調整
      • "ページ間をスワイプ" を"３本指でスワイプ" に変更
      • "フルスクリーンアプリケーション間をスワイプ" を"４本指で左右にスワイプ" に変更
      • "Mission Control" を"４本指で上にスワイプ" に変更
    3. "コントロールセンター" の調整
      • "Bluetooth" 設定を"メニューバーに表示" にする
      • "サウンド" 設定を"メニューバーに表示" にする
      • "バッテリー" 設定で"割合(%) を表示" を有効にする
    4. "サウンド" > "起動時にサウンドを再生" を無効にする
    5. "一般" > "共有" の調整
      • ローカルホスト名を編集し、わかりやすくする
    6. "キーボード"
      • "テキスト入力" > "入力ソース" の調整
        • 予測変換に関連する項目のチェックを外す
      • "キーボードショートカット" > "ファンクションキー" の調整
        • "F1、F2などのキーを標準のファンクションキーとして使用" を有効にする
  2. "Finder" の調整
    1. Finder を開き"場所" に表示されている自身のPC をクリックして、"Macintosh HD" を"よく使う項目" にドラッグアンドドロップする
    2. "Finder > 設定" の調整
      • デスクトップに表示する項目のチェックをすべて外す
      • "新規Finder ウインドウで次を表示" を"Macintosh HD" に設定する
      • "フォルダを新規ウィンドウではなくタブで開く" のチェックを外す
  3. 隠しファイルを表示するために下記コマンドを実行する
    • 隠しファイルを表示する
      defaults write com.apple.finder AppleShowAllFiles TRUE
    • Finder を再起動して設定を反映する
      killall Finder

2. アンチウイルスソフトのセットアップ

各自で持っているものが違うと思うので、手順を省略します。

3. OS のアップデート

セキュリティ関連の更新がないかを確認し、もしあればアップデートします。

4. 各WEB ブラウザのセットアップ

あとでIDE をインストールした時に、自動でパスが拾ってもらうことを期待して、先に設定します。

  1. Google Chrome をインストールし、その後起動してみる
  2. Microsoft Edge をインストールし、その後起動してみる
  3. Firefox Developer Edition をインストールし、その後起動してみる

5. 開発＆便利アプリのセットアップ

自分好みのツールを入れていきます。

  • App Cleaner → アプリをドラッグアンドドロップすると、関連ファイルを検索してまとめてゴミ箱に入れてくれるアプリ
  • Docker Desktop for Mac
    • "Preference" を下記設定すると良いかも
      • ”General" の"Start Docker Desktop when you log in" のチェックを外す
      • "Advanced" のメモリ割り当てを任意の値に設定する
  • GIMP → 画像加工、お絵かきアプリ
  • Slack → チャットアプリ

6. Xcode (+ Git, Homebrew) のセットアップ

Xcode をインストールすることでgit が使えるようになるはずなので、これ以降git 関連の操作ができるようになります。

  1. App Store からXcode をインストールする
  2. Xcode を起動し、初期セットアップを行う
  3. デスクトップ上部のメニューバーから"Xcode" > "Settings" を起動し、下記の設定をする
    • "Accounts" でApple アカウントを設定し、証明書情報を紐づけられるようにする
    • "Source Control" > "Git" で下記の作業者情報を入力する
      • Author Name
        • ターミナルでgit config --global user.name を実行し、Xcode で設定した値と一致することを確認する
      • Author Email
        • ターミナルでgit config --global user.email を実行し、Xcode で設定した値と一致することを確認する
  4. ターミナルでxcodebuild --help を実行し、パス設定が上手く出来ているかを確認する
  5. Homebrew のサイトに記載されているインストールコマンドを、ターミナルで実行する
  6. 前述のコマンド実行後に、パスの追記に関するメッセージが表示されるので、それを実行する
  7. ターミナルでbrew doctor を実行し、セットアップが完了しているかを確認する

7. anyenv 関連のセットアップ

この作業で、 ~/.zshrc と~/.zprofile が作成されるので、以降の手順でパスの追記がやりやすくなります。

  1. anyenv のセットアップ
    1. ターミナルでbrew install anyenv を実行する
    2. ターミナルでanyenv init を実行し、表示された記述を ~/.zshrc に記述する
      • 例) echo 'eval "$(anyenv init -)"' >> ~/.zshrc
    3. ターミナルを再起動し、設定を反映する
    4. ターミナルでanyenv install --init を実行する
  2. anyenv-update のセットアップ
    1. Web サイトに記載されているコマンドを実行する
    2. ターミナルでanyenv update を実行し、設定できているかを確認する
  3. 各env のセットアップ
    1. ターミナルでanyenv install jenv を実行する
    2. ターミナルでanyenv install nodenv を実行する
    3. ターミナルでanyenv install rbenv を実行する
    4. ターミナルを再起動し、設定を反映する
    5. ターミナルでanyenv versions を実行し、設定できているかを確認する

※各env に対象の言語・ツールのインストールする作業が残っていますが、必要になった段階でやることにして、このあたりで次のステップに移ります

8. Android Studio 関連のセットアップ

  1. JetBrains Toolbox App をセットアップする
    1. サイトかインストールする
    2. アプリ起動後、右上の六角形アイコン > "設定" をクリックし、"システム起動時に Toolbox App を開始する" を無効にする
  2. Android Studio をセットアップする
    1. JetBrains Toolbox App を起動し、Android Studio をインストールする
    2. Android Studio を起動し、初期設定する
    3. Android エミュレータをセットアップする

９. Visual Studio Code 関連のセットアップ

まずは本体をセットアップしていきます。

  1. Visual Studio Code をインストールする
  2. アプリを起動し、Cmd + Shift + P を押して"Shell Command: Install 'code' command in PATH" を実行し、コマンド経由で起動できるようにする
  3. (もしアカウントがあれば) 画面左下の歯車アイコン > "Backup and Sync Settings..." をクリックして、サインインをする

上記の最後の手順で、他の環境で設定した内容を移植出来たりします。 移植内容に問題がなければ、下記の拡張機能周りの設定は省略できます。

  1. エディターの表示調整
  2. Git クライアントとして利用するための設定
    • Git History
      • ブランチをUI 表示してくれます
    • GitHub Actions
      • GitHub アカウントと紐付けることで環境変数などを利用できるようになります
    • GitHub Pull Requests
      • GitHub アカウントと紐付けることでPull Request やIssue を確認できるようになります
    • gitignore
      • .gitignore を作成する時に便利です
    • GitLens — Git supercharged
      • エディター上でLine History などを確認できるようになります
      • 多機能すぎて、実は使いこなせていません
  3. 開発作業向けの設定
    • C# Dev Kit
      • C# 記述時に色々と恩恵があります
      • .NET のセットアップは表示されるガイドに従ってください
    • Docker
      • Docker コンテナの起動などをVSCode 上から出来るようになります
    • EditorConfig for VS Code
      • .editorconfig で記述されたルールに沿うことが出来るようになります
    • PlantUML
      • .plantuml のプレビュー等が出来るようになります
      • プレビューはレンダリングサーバーが必要となるので、拡張機能の設定を確認すると良いかもです
    • Remote Development
      • 色々なリモート環境への接続をVSCode 上から出来るようになります
    • Ruby LSP
    • Swift
      • Swift 記述時に色々と恩恵があります
    • YAML
      • YAML 記述時に色々と恩恵があります

今後新しいアプリ等を設定したくなったら

下記の順で試してみて、なるべく散らばらないようにすると良いかもです。

  • CUI
    1. anyenv 関連のツールで設定できないか試す
    2. Homebrew で設定できないか試す
    3. 直に設定する
  • GUI
    1. JetBrains Toolbox App で設定できないか試す
    2. App Store で設定できないか試す
    3. (気が向いたら) Homebrew のCask で設定できないか試す
    4. 直に設定する

付録

  • JDK のインストール
    • Android Studio に梱包されているJDK を利用することも出来ますが、今回の環境では更新があるたびに書き換える手間が生じます
      • JetBrains Toolbox App 経由でインストールすると、配置パスにバージョン情報が含まれるためです
    • Homebrew でインストールし、jenv にそのパスを設定すると良いかもです
      • OpenJDK のformulae を登録する雰囲気
        1. brew install openjdk@17 を実行し、インストールする
        2. brew info openjdk@17 を実行し、大まかな配置パスを確認する
        3. jenv に登録する (※下記はあくまで例となります)
          # パスは設定によって異なることがあるので、適宜読み替えてください
jenv add /opt/homebrew/Cellar/openjdk@17/17.0.9/libexec/openjdk.jdk/Contents/Home
        4. jenv versions を実行し、対象になっているかを確認する
        5. (必要に応じてjenv がデフォルトで利用するJDK を設定し、) java を実行し、パスが通っているかを確認する
  • Ruby をインストールする際、追加で環境整備が必要な場合があり、その際は最新の情報を参照し、セットアップしてください
    • 例) yaml.h の依存関係の不足
      conftest.c:3:10: fatal error: 'yaml.h' file not found
#include <yaml.h>
         ^~~~~~~~
1 error generated.
  • Zoom のインストール
    • いくつか権限設定が必要なので、利用する前に一通り設定できているかを確認すると安心です
      • 設定「ビデオ」と「背景とエフェクト」のチェック
      • 設定「オーディオ」のチェック
      • 画面共有出来るかどうかのチェック
  • 過去のmacOS バージョンをインストールしたい
    • App Store でOS 名を検索することで、インストールできる場合があります
    • 例: macOS Ventura
PR