ngtokuの日記

主に雑記帳です。SNSではngtokuのID取れなかったんで、別のIDでやってます。

備忘メモ(React.js環 開発境セットアップ)

マシン入れ替えたので備忘録兼作業メモ

作業の流れ

  1. VSCode インストール
  2. Homebrew インストール
  3. anyenv & nodenv インストール
  4. nodenv-default-packages 設定
  5. nodenv 個別バージョンインストール
  6. create-react-app 実行

VSCode インストール

普通にここから。Visual Studio Code – コード エディター | Microsoft Azure

Homebrew インストール

これまんまで。macOS(またはLinux)用パッケージマネージャー — Homebrew

anyenv & nodenv インストール

Big Surなのでzshのはずだけど念のため確認。

$ echo $SHELL
/bin/zsh

確認できたのでインストール。

$ brew install anyenv
$ echo 'eval "$(anyenv init -)"' >> ~/.zshrc
$ anyenv install --init
$ exec $SHELL -l
$ anyenv install nodenv
$ exec $SHELL -l

nodenv-default-packages インストール

$ mkdir -p $(anyenv root)/plugins
$ git clone https://github.com/znz/anyenv-update.git $(anyenv root)/plugins/anyenv-update
$ mkdir -p "$(nodenv root)"/plugins
$ git clone https://github.com/nodenv/nodenv-default-packages.git "$(nodenv root)/plugins/nodenv-default-packages"

nodenvのdefault-packages は以下。

$ vi $(nodenv root)/default-packages
yarn
typescript
ts-node
typesync

nodenv 個別バージョンインストール

14.5で挙動変わるから、初心者は14.4.0入れとけって言われたので今もそれに倣っているが、そろそろ最新版にしてもいい気がする。

$ nodenv install -l
$ nodenv install 14.4.0
$ nodenv global 14.4.0

create-react-app 実行

作業フォルダ作ってテストプロジェクト作成。

$ mkdir -p work/ReactJS
$ cd work/ReactJS
$ npx create-react-app hello-world --template typescript
$ cd hello-world
$ yarn start