🙌

Reactを始める前に環境を整える

2024/06/21に公開

Reactとは

UI実装に特化したJavaScriptライブラリ

やったこと

1. nvmインストール

nvmって？
- Node Version Manager (ノード・バージョン管理ツール) の略
- nvmによって、複数のバージョンを必要に応じて切り替えることができる
やったこと
- curlコマンド
  - curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
- パスを通す(~/.zshrcに以下を追加)
  - export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
  - 魔法の言葉ﾀﾞﾈ！

2. nodeインストール

nodeって？
- JavaScriptの実行環境
やったこと
- インストールコマンド
  - nvm install node

3. viteプロジェクト作成

viteって？
- ビルドツール
- 従来のビルドツールと比較して、高速動作する
- 従来のビルドツール：webpack、Rollup、Parcelなど
  - Laravel Mixの中身はwebpack
やったこと
- プロジェクト作成コマンド
  - npm create vite@latest {プロジェクト名} -- --template react-swc-ts
- npmインストール
  - npm install
  - npm run dev

感想

これを機にフロント実装嫌だ〜〜〜という感情から逃れたい

参考

Discussion