k01ken’s b10g

He110 W0r1d!

Reactを使う

開発環境は、Windows 7 Professional(32bit) + Node.js v8.11.1。


※Node.jsがすでにインストールされていることが条件です。

1.コマンドプロンプトを実行し、以下のコマンドを実行する

npm install -g create-react-app

2.次にカレントディレクトリを移動し、ディレクトリを作成する

cd /
mkdir react-sample
cd react-sample

3.Reactの雛形をインストールする。インストールが完了するまでにちょっと時間がかかります。

create-react-app sample-app


4.インストールが完了したら、インストールしたディレクトリへカレントディレクトリを移動させます。

cd sample-app

5.サーバーを起動し実行します(起動するまでにちょっと時間がかかります)。以下のコマンドを入力してから、http://localhost:3000/へアクセスしてください。
何もしなくても、サーバーが起動すれば、自動的に、http://localhost:3000/へアクセスします。

npm start

f:id:k01ken:20180711001307p:plain

6./sample-app/src/App.jsを起動して、ちょっと修正してみる。

        <p className="App-intro">
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>

の下に

        <p>Hello React</p>

を追加してみると、ブラウザをリロードすることなくすぐにページが修正されます。
f:id:k01ken:20180720170308p:plain

参考リンク
React.jsで社内システムを作る(React.js基礎編) |DODA Creator's Blog