モダンな環境のWebサイト作りたい #01

アプリを作ったのがもう２年前という事実に目を逸らしていましたが、この２年の間に随分とPHPのスキルは上がりつつ……、再度Reactに。
今回は動画教材ではなく書籍を購入しました。

作って学ぶ　Next.js/React　Webサイト構築

書籍開始前の初期準備

GatsbyJSも一通り触ったりしていたので、Mac内に色々と入っているのが気になっていたのと、Cakebrewを入れてみたかったこともあり、一旦綺麗さっぱり整えました。

1. Mac OSをMontereyにアップデート

2. Mac初期化

3. Homebrew入れる

4. Cakebrew入れる

5. Git入れてPATH通す
   色々な記事を見て必要な手順だと思い込んでましたが、一度ターミナルを再起動してバージョンを確認してみたらhomebrewになってました。

6. Visual Studio Code入れて初期設定

余談ですが、Montereyになるとシステム環境設定から「すべてのコンテンツと設定を消去…」できるようになっていて初期化が捗るなぁと思いました。

Mac を消去して工場出荷時の設定にリセットする

環境の準備

この書籍内では環境の準備については触れられておらず「セットアップPDF」を別途ダウンロードして、参考にしながら準備を進める形式。
私の場合は立ち読みもせず電子版を購入しているので、買う前に確認しておいた方がよさそうなメモ。

1. GitHub
   これは省略。アクセストークンの設定が必要そう。

2. microCMS
   ヘッドレスCMS。

3. Vercel
   Webホスティングサービス。私は自分のサーバーを別で契約しているのですが、そこにアップロードするのではないことを読み始めるまで理解していませんでした。ただ、GitHubへのプッシュで更新できるようになるらしいので結果的にOK。アカウント作成。

4. Netlify
   現状では調べても何も理解できていないので追記予定。とりあえずアカウント作成。

5. Figma
   普段はAdobe XD派ですが、いい機会なのでOK。

6. Node.jsのバージョン管理のためにVoltaをインストール
   最近はnodebrewよりもVoltaが人気なのだとか。せっかくCakebrewを入れたので初めはCakebrew経由で入れてみたのですが、“結果的にhomebrewフォルダの配下にならない”、“自動でPATHが.zshrc書き込みされるはずがされない”という理由で、Voltaは直接インストールしました。
   ※完全なhomebrew配下じゃなければアンインストールをCakebrewからしても結局ファイルが残るので管理的に経由する意味が個人的にあんまり感じられないかも。
   ※homebrew経由で入れると/usr/local/binにインストールされるといった記事を見かけましたが、私の環境ではそんなことはなかったです。

7. Git、VSCodeの設定

8. PrettierとESLintの設定のところで出てきた「eslint-config-prettier」
   eslint-config-prettier を Next.js（JavaScript）のプロジェクトにインストールとのことなんだけれど、プロジェクトにインストールとは。
   

思うところ

環境の準備をしていていつも気になるのですが、なぜインストール時に一緒にインストールされたものが、アンインストール時には取り残されるんでしょう……。後片付けもしっかりするようにして欲しい。