create-react-appで環境構築をする
create-react-appに必要なもの
* node 8.10以上
* npm 5.6以上
これらをインストールするために
まず、homebrewをインストールし、次に homebrewを使用しnodebrewをインストールする。
その後、nodebrewを使用しnodeをインストールするみたい。
ややこしや〜
参考にさせていただいた記事
https://qiita.com/sugasaki/items/ad4d5d88965057840a04
以下、やったこと
homebrew、nodebrew、node、npmのインストール
homebrewのインストール
https://brew.sh/index_jaのトップページのコマンドをコピペ
bash
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
インストールされたかの確認
bash
brew -v
nodebrewのインストール
brew install nodebrew
インストールされたか確認する
bash
nodebrew -v
nodebrew で nodeをインストールする
stable は安定バージョンをインストールするらしい。安定バージョンは8.1以上みたいなのでOK
bash
nodebrew install stable
ここでエラーが出た。Fetching: https://nodejs.org/dist/v14.15.5/node-v14.15.5-darwin-x64.tar.gz
Warning: Failed to create the file
Warning: /Users/aaa/.nodebrew/src/v14.15.5/node-v14.15.5-darwin-x64.tar.gz:
Warning: No such file or director
調べたところフォルダがないよってエラーだったので
ディレクトリ作成してみたところnodeのインストール成功した。
- インストールしたnodeをカレントにする。
多分インストールしたnodeを使用できる状態にすることかなと思っている
nodebrew ls
v14.15.5
current: none
nodebrew use 14.15.5
nodebrew ls
v14.15.5
current: v14.15.5
nodeを使用できるようにpathを通す
bash
echo 'export PATH=$HOME/.nodebrew/current/bin:$PATH' >> ~/.bash_profile
viで~/.bash_profileを編集
以下の形式にする、、らしいが正直何やってるかわからん。なんでパスを通すのにif文がいるん
bash
export PATH=$HOME/.nodebrew/current/bin:$PATH
if [ -f ~/.bashrc ] ; then
. ~/.bashrc
fi
source ~/.bash_profile
node -v
ifのところが本当に分かってないがとりあえずnodeを認識するようになった。
今度要調査！npmがインストールされている確認する
nodeをインストールするとnpmも自動でインストールされる
npm -v
create-react-appをようやく使用する
インストールしたいディレクトリに移動してnpxでインストール
npx create-react-app firstReact
エラー出た。
Cannot create a project named
firstReactbecause of npm naming restrictions:
*name can no longer contain capital letters
Please choose a different project name.
翻訳したらディレクトリ名に大文字使えないよって書いてあったので小文字にした。
vscodeでworkディレクトリを開く
下記コマンドでbuildディレクトリを作成する。
これはsrcとpublic内のファイルをまとめてbuildディレクトリに出力するやつ
npm run build
下記、コマンドでローカル環境を実行できる
ブラウザが立ち上がる
npm start
手動で環境を作るのはかなり難しい
*→create-react-appなら簡単に環境作れる! *