SMARTCAMP Engineer Blog

スマートキャンプ株式会社(SMARTCAMP Co., Ltd.)のエンジニアブログです。業務で取り入れた新しい技術や試行錯誤を知見として共有していきます。

dotfiles を使った環境構築の時短術(M1 Mac 向け)

環境構築 dotfiles

挨拶

こんにちは！スマートキャンプエンジニアの石井(トマス)です。現在、Boxil Event Cloudの開発に携わっています。

好きなことは「開発体験の向上」に取り組むことで、プロダクト参画時、開発環境をホストマシンに直接構築している状態で手順書もなく非効率だったのでDocker化し環境構築を簡略化しました。

今回は「開発体験の向上」と関連した、PC移行時に役立つdotfilesについて紹介します。
直近で、Intel MacからM1 Macへ乗り換える機会がありdotfilesを使って素早く環境構築ができたので、セットアップ方法やカスタマイズの仕方について話したいと思います。

おすすめする人

  • PCの乗り換えでこれからM1 Macを使おうとしている
  • M1 Macの環境構築を楽にしたい
  • 直近でPCの乗り換えはないが、乗り換えの際にアプリケーションや設定を忘れがち
  • Time Machineを使った全ファイルの移行は不要。開発環境だけサクッと行いたい場合

皆さんは新しいPCを調達した際に環境構築をするのが面倒だと思ったことはないでしょうか？
プログラミング言語のインストール、アプリケーションのインストール、設定ファイルの移行、、、移行作業って大変ですよね。
移行作業を簡単にするために、dotfilesを使った環境構築について話していきます。

dotfiles とは

「.zshrc」などの(.)からはじまる設定ファイルをGitで管理して、どこにいても自分の環境をサクッと作成しよう！というコンセプトです。
dotfilesについて詳しくない人はようこそ dotfiles の世界へがオススメなのでご覧ください。
本記事では、より簡単に環境構築するために「アプリケーション」「プログラミング言語」を含めて管理する方法について紹介していきます。

dotfiles を使ってみた感想

コマンド1つで環境構築できるようになり、環境構築の時間を短縮できました。

以前は移行元のMacから必要なアプリケーションを検索して、「ブラウザ」「Mac App Store」「Homebrew」など複数の経路からインストールしていました。
すべて手作業だったのでインストールが漏れることもありましたが、コード管理によりそういった心配もなくなりました。

セットアップ方法

実際にセットアップするときの流れになります。
GitやGitHubの操作については省略しているのでご了承ください。

  1. GitHubに「dotfiles」リポジトリを作成。
  2. 後述の「リポジトリ構成」を参考に「dotfiles」リポジトリを更新。
  3. セットアップコマンドを実行。
  4. インストールするアプリケーションによって入力を求められることがあるので対応。
#セットアップコマンド
bash -c "$( curl -fsSL https://raw.github.com/${github-username}/dotfiles/master/setup.sh )"

※セットアップコマンドは「dotfiles」リポジトリを使用する前提です。変更する際は/dotfilesの部分を修正してください。

リポジトリ構成

ここからは、リポジトリで管理するファイルについての説明です。

はじめに、(.)からはじまる設定ファイルを「dotfiles」リポジトリに移行します。
つぎに、「setup.sh」「.Brewfile」「_asdf.sh」「_link.sh」「.gitignore」「README.md」を「dotfiles」リポジトリに作成します。

私の環境だと、このような構成になりました。

# dotfilesリポジトリ
.
├── setup.sh #セットアップ実行ファイル
├── .Brewfile #アプリケーション管理ファイル
├── _asdf.sh #プログラミング言語のインストール実行ファイル
├── _link.sh #設定ファイルのシンボリックリンク作成
├── .gitconfig #設定ファイル
├── .zprofile #設定ファイル
├── .zshrc #設定ファイル
├── .gitignore #dotfilesのgitignore
└── README.md #dotfilesの説明

vimを使っている人であれば.vimrcも管理対象になると思うので、下記のような構成になります。

# dotfilesリポジトリ
.
├── setup.sh #セットアップ実行ファイル
├── .Brewfile #アプリケーション管理ファイル
├── _asdf.sh #プログラミング言語のインストール実行ファイル
├── _link.sh #設定ファイルのシンボリックリンク作成
├── .gitconfig #設定ファイル
├── .zprofile #設定ファイル
├── .zshrc #設定ファイル
├── .vimrc #設定ファイル
├── .gitignore #dotfilesのgitignore
└── README.md #dotfilesの説明

必要な設定ファイルは人それぞれだと思うので、自分の環境に合わせて追加/削除してください。

それでは、作成した「setup.sh」「.Brewfile」「_asdf.sh」「_link.sh」「.gitignore」「README.md」について説明していきます。

自動セットアップ

「setup.sh」はセットアップの実行ファイルです。
Xcodeのインストール、rosettaのインストール、Homebrewのインストール、管理しているアプリケーションのインストール、プログラミング言語のインストール、設定ファイルのシンボリックリンクの作成の順に処理が流れていきます。

#!/bin/bash

echo "Xcodeをインストールします..."
xcode-select --install

# rosettaのインストール。不要であれば下記1行削除してください
sudo softwareupdate --install-rosetta --agree-to-licensesudo softwareupdate --install-rosetta --agree-to-license

#------------------------------------------
# homebrew(arm64)
#------------------------------------------
echo "homebrewをインストールします..."
which /opt/homebrew/bin/brew >/dev/null 2>&1 || /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

echo "brew doctorを実行します..."
which /opt/homebrew/bin/brew >/dev/null 2>&1 && brew doctor

echo "brew updateを実行します..."
which /opt/homebrew/bin/brew >/dev/null 2>&1 && brew update --verbose

echo "brew upgradeを実行します..."
which /opt/homebrew/bin/brew >/dev/null 2>&1 && brew upgrade --verbose

echo ".Brewfileで管理しているアプリケーションをインストールします..."
which /opt/homebrew/bin/brew >/dev/null 2>&1 && brew bundle --file ./.Brewfile --verbose

echo "brew cleanupを実行します..."
which brew >/dev/null 2>&1 && brew cleanup --verbose

### プログラミング言語のインストール
echo "プログラミング言語をインストールします..."
./_asdf.sh

### シンボリックリンクの作成
echo "シンボリックリンクを作成します..."
./_link.sh

exec $SHELL -l

アプリケーションの管理

「.Brewfile」はHomebrewやMac App Storeのアプリを管理します。
「brew install ~」や「brew install cask ~」を打ち込んでいたアプリケーションをここで管理するイメージです。

「.Brewfile」のベース。
cask_argsコマンドなど、Brewfileについてはこちらの記事が参考になります。
cask "..."などの部分は後のパートで解説します。

# インストール先の指定
cask_args appdir: "/Applications"

# 外部ライブラリをインストール
tap "homebrew/core"
tap "homebrew/cask"

# デスクトップアプリケーションの管理
cask "..."

# CLIアプリケーションの管理
brew "..."

# Mac App Storeのアプリケーションを管理
mas "...", id: xxxxxxxx

私が使っている.Brewfileを例にカスタマイズしていきます。

カスタマイズ

デスクトップアプリケーション

cask (package name)で設定。
brew install cask (package name)でインストールするアプリを記述。

# デスクトップアプリケーションの管理
cask "visual-studio-code"
cask "google-chrome"
cask "docker"
cask "postman"
cask "alfred" #ランチャーアプリ
cask "drawio" #ダイアグラム作成アプリ
cask "warp" #ターミナルアプリ。iTermから乗り換えました
CLI アプリケーション

brew (package name)で設定。
brew install (package name)でインストールするアプリを記述。

brew "asdf"
brew "mas"
brew "yarn"
brew "tree"
brew "git"
brew "git-lfs"
brew "docker"
brew "awscli"
brew "jq"
brew "ag"
brew "jump"
brew "fzf"
brew "bat"
brew "gpg"
brew "hstr"

asdfとmasライブラリは、「プログラミング言語」「Mac App Storeのアプリケーション」のインストールで必要なため最低限入れておいてください。

Mac App Store のアプリケーション

mas (package ID)で設定。

Mac App Storeのアプリケーションをインストールするためにmas-cliを使用します。

mas "RunCat", id: 1429033973 #システム状態監視ツール
mas "Display Menu", id: 549083868 #ディスプレイ解像度変更ツール
mas "Magnet マグネット", id: 441258766  #画面分割ツール

idは「mas search」コマンドで検索します。

# Display Menuを検索する場合
mas search "Display Menu"
  549083868  Display Menu (2.2.4)
完成系
# インストール先の指定
cask_args appdir: "/Applications"

# 外部ライブラリをインストール
tap "homebrew/core"
tap "homebrew/cask"

# デスクトップアプリケーションの管理
cask "visual-studio-code"
cask "google-chrome"
cask "docker"
cask "postman"
cask "alfred"
cask "drawio"
cask "warp"

# CLIアプリケーションの管理
brew "asdf"
brew "yarn"
brew "tree"
brew "git"
brew "git-lfs"
brew "docker"
brew "awscli"
brew "jq"
brew "ag"
brew "jump"
brew "mas"
brew "fzf"
brew "bat"
brew "gpg"
brew "hstr"

# Mac App Storeのアプリケーションを管理
mas "RunCat", id: 1429033973
mas "Display Menu", id: 549083868
mas "Magnet マグネット", id: 441258766

プログラミング言語の管理

「_asdf.sh」はプログラミング言語のインストール実行ファイルです。
バージョン管理ツールにasdfを使ってますが、他で気に入っているツールがあればそちらで代替いただいて大丈夫です。
以前使っていたanyenvより軽いのでasdfに乗り換えました。

#!/bin/sh

#install programming language
which asdf >/dev/null 2>&1 && asdf plugin add ruby && asdf install ruby latest && asdf global ruby latest
which asdf >/dev/null 2>&1 && asdf plugin add nodejs && asdf install nodejs latest && asdf global nodejs latest

カスタム例

「python」を新しく追加したい場合はこのように書きます。

which asdf >/dev/null 2>&1 && asdf plugin add python && asdf install python latest && asdf global python latest

ここにない言語のインストールやコマンドの詳細についてはasdf の公式サイトをご覧ください。

設定ファイルのシンボリックリンク作成

「_link.sh」は設定ファイルのシンボリックリンク作成の実行ファイルです。
(.)からはじまる設定ファイルを「dotfiles」リポジトリに移行したので、シンボリックリンク作成がないと設定を読み取ってもらえません。

#!/bin/sh

# シンボリックリンクの作成
DOT_FILES=".gitconfig .zshrc .zprofile"
for file in $DOT_FILES
do
    ln -sf `pwd`/$file ~
done

カスタム例

.vimrcを追加したい場合、DOT_FILES="~"を修正します。

DOT_FILES=".gitconfig .zshrc .zprofile .vimrc"

DOT_FILES="~"に追加されたものは、ホームディレクトリ直下にシンボリックリンクが作成されます。
ホームディレクトリ直下以外に作成したい場合は直接ln -sfで指定するなど「_link.sh」を書き直してください。

.gitignore および README.md

「dotfiles」リポジトリを管理するためのファイルです。
書き方に決まりはないので、私の設定を紹介したいと思います。

.gitignore

管理対象を設定します。
ignore allですべて管理対象外にしてから、not ignoreで必要なファイルを指定しています。

### ignore all ###
/*
/.**

### not ignore ###
!/.Brewfile
!/.gitconfig
!/setup.sh
!/.zshrc
!/.zprofile
!/_link.sh
!/_asdf.sh
!/_anyenv.sh

!/README.md
!/LICENCE
!.gitignore

README.md

自動セットアップのコマンドと「Homebrew」や「Mac App Store」でインストールできないアプリを記載しています。

# Dotfiles

## スクリプトの実行
ターミナル起動 & スクリプト実行

bash -c "$( curl -fsSL https://raw.github.com/${github-username}/dotfiles/master/setup.sh )"

## その他
### 手動インストール
- Google日本語入力
- Karabiner-Elements
- Karabiner-ElementViewer
- BetterTouchTool
- DisplayLink Manager

さいごに

紹介したアプリケーションやプログラミング言語はほんの一例です。
自身に必要なものを追加したり削除したりしてカスタマイズを楽しんでください。
本記事が快適な環境構築に少しでもお役に立てれば幸いです。