Windows10にReact.jsをインストールする方法

2022年8月28日

環境
Windows 10 Home 64bit
node v16.17.0
npm 8.15.0

React.jsをインストールする手順
1.create-react-appのインストール

> npm install -g create-react-app

2.demoprojectという名前でプロジェクトを作成します

>create-react-app demoproject

3.プロジェクトに移動します
>cd demoproject

npmを実行します

>npm start
略
You can now view demoproject in the browser.

  Local:            http://localhost:3000
  On Your Network:  http://192.168.16.1:3000

Note that the development build is not optimized.
To create a production build, use npm run build.

webpack compiled successfully

4.動作確認
ブラウザよりhttp://localhost:3000にアクセスします
「Edit src/App.js and save to reload」が表示されます。

「src/App.js」を編集します

import logo from './logo.svg';
import './App.css';

function App() {
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Hello Wolrd Study react.js
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

export default App;