Reactの新規環境構築
- 最新の Node.js がインストールされていることを確かめる
Create React App のインストールガイドに従って新しいプロジェクトを作成する。
npx create-react-app my-app
※以下でも同じらしい
npm init react-app プロジェクト名
そのあとでプロジェクト名に入り、npm install
新しく作ったプロジェクトの src/ 内にあるファイルをすべて削除する
補足:src フォルダ自体をまるごと消すのではなく、中にあるソースファイルを削除してください。この次のステップで、デフォルトのソースファイルをこのプロジェクト用の例に置き換えます。
cd my-app
cd src
# If you're using a Mac or Linux:
rm -f *
# Or, if you're on Windows:
del *
# Then, switch back to the project folder
cd
..src/ フォルダ内に index.css という名前のファイルを作り、ここの CSS コードを記入する。
- src/ フォルダ内に index.js という名前のファイルを作り、ここの JS コードを記入する。
- src/ フォルダ内の index.js ファイルの先頭に以下の 3 行のコードを加える。
import React from 'react'; import ReactDOM from 'react-dom'; import './index.css';
これでプロジェクトフォルダ内で npm start を実行し、ブラウザで http://localhost:3000 を開く