Zenn
💻

【備忘】M1Max Macの環境構築をしてみる

2022/09/16に公開
Homebrew
macOS
macOS
M1
idea

今年の5月頃に、M1MaxチップのMacBookを購入し、7月到着。
環境構築をし使い始めた訳ですが、先日（9月入ったぐらい）突然画面が真っ暗になり、立ち上がらなくなったため、一度修理へ。。
そして修理に出して4日後、無事起動できる状態で戻ってきましたが、なにやらロジックボードという部品取り替えだったようで、購入したとき（完全初期化状態）と全く同じ状態で戻ってきました。
そこで、2回目の環境構築をし、「メモっておけばよかった...」と感じたので、次からの備忘として、自分なりの最低限のセットアップを残していきます。

環境

機体： MacBook Pro（14インチ、2021）
OS： MacOS Monterey 12.0.1
チップ： Apple M1 Max
メモリ： 32 GB

Homebrew をインストールする

まず何より先に、Homebrewをインストールします。
スタンスとしては、Homebrew経由でインストールできるか試して、ダメそうだったら直接インストールしていきます。

以下を打つ。

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

インストールが終わるとNext Step的なちゃんとでて、パスを通すように言われるので、指示に従います。
ルートディレクトリの.zprofileに、以下を追加。

eval "$(/opt/homebrew/bin/brew shellenv)"

パスを通したら、ターミナルを立ち上げ直します。

xcode を App Store からインストールする

今インターンで関わっているプロダクトでsimulatorをよく使うので、インストールします。
xcodeのインストールは時間がかかるので、他のツールより先にインストールを始めておきます。（1~2時間ぐらい?）
xcodeはHomebrew経由ではインストールできないので、App Storeで「xcode」と検索し、通常のアプリ同様インストールを押します。
あとは待ちます。（必要になっても急に使えなかったりするので、時間あるときにインストール）

最低限必要なツールを brew 経由でインストールする

本当に使うツール全てだとキリがないので一旦コードが書けるまで。(となんとなく最初から欲しい物)

  • google-chrome
brew install google-chrome
  • slack
brew install slack
  • iterm2
    後でカスタマイズします。
brew install iterm2
  • visual-studio-code
    後で設定します。
brew install visual-studio-code
  • git
    後でGithub接続します。
brew install git
  • Docker Desktop for Mac
brew install --cask docker
  • android-studio
    android emulatorが欲しいのでインストールしておきます。
brew install android-studio
  • nodebrew
brew install nodebrew
  • yarn
    --ignore-dependenciesをつけないと、すでにインストールしているnodebrewとの依存関係的にエラーが出てしまうようなのでつけます。
brew install yarn --ignore-dependencies

ツールのカスタマイズや設定を行う

  • iterm2
    この辺りの記事を参考にさせていただきました。

  • nodebrew
    公式のReadmeに書いてあるコマンドを使って、お好きなversionをインストール&利用するように設定。

  • vscode

  1. 拡張機能のインストール
  1. Userスペースのsettings.jsonを設定
    めちゃめちゃ拘っている訳ではないので現状のもの。
{
    "editor.bracketPairColorization.enabled": true,
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true,
    "editor.wordWrap": "on", // 端まで行ったら折り返す
    "editor.minimap.enabled": false, // 右側に出るコードマップ
    "editor.renderWhitespace": "boundary", // 半角スペースに点が打たれる
    "editor.renderLineHighlight": "all", // 選択行を行番号含めすべてハイライト
    "window.title": "${activeEditorMedium}${separator}${rootName}", // ファイル名を詳しく表示
    "emmet.triggerExpansionOnTab": true, // tabキーで変換
    "javascript.updateImportsOnFileMove.enabled": "always",
    "typescript.updateImportsOnFileMove.enabled": "always",
    "typescript.preferences.importModuleSpecifier": "non-relative",
    "typescript.inlayHints.parameterNames.enabled": "all",
    "editor.codeActionsOnSave": {
        "source.addMissingImports": true,
        "source.fixAll.eslint": true, // ファイルを保存したときに、エラーを ESlint で検証する
        "source.fixAll.stylelint": true // ファイルを保存したときに、cssを自動整形する
    },
    "[markdown]": {
        "editor.formatOnSave": false
    },
    "search.exclude": {
        "**/node_modules": true,
        "**/yarn.lock": true
    },
    "cSpell.words": ["mathjax", "signup", "Statsig", "Walkthrough"],
    "editor.quickSuggestionsDelay": 300,
    // ESLint & Prettier設定
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        "typescript",
        "typescriptreact"
    ], // ESLint によるコードチェックを、以下の言語について行う
    // 入力中に補完候補をだすかどうか　以下の設定でコメントの中でもどこでも補完候補を出せるようになる
    "editor.quickSuggestions": {
        "other": true,
        "comments": true,
        "strings": true
    },
    // vscode-icons設定
    "workbench.iconTheme": "vscode-icons",
    "vsicons.dontShowNewVersionMessage": true,
    // yaml設定
    "[yaml]": {
        "editor.insertSpaces": true,
        "editor.tabSize": 2,
        "editor.autoIndent": "advanced",
        "editor.quickSuggestions": {
        "other": true,
        "comments": false,
        "strings": true
        }
    },
    "terminal.integrated.env.osx": {
        "FIG_NEW_SESSION": "1"
}
}
  • git
git config --global user.name "Githubのユーザー名"
git config --global user.email "Githubのメアド"

そして、お試しpushする前に、githubのSettings→Developer Settings→Personal Access Tokenを生成しておきます。
pushの際に、パスワードを求められたら、githubのパスワードではなく、生成したAccess Tokenを入力します。
これで成功するはずです。

終わりに

上記の設定で一旦コード書いてpushして...みたいなサイクルは可能かと思います。
どなたかのセットアップに役立てば幸いです。

homebrewだと、前のPCから書き出して、再利用なんてこともできるらしいです。
が、その時々で使っている物が違ったりするので、自分は毎回一からやることにしています。

(ちなみに一例ですが、datagripやpostman、zoom、notion、microsoft-teams、figma...等もろもろHomebrew経由でインストール可能です！)

参考リンク

Discussion