React

[React] React環境を構築する

2023年3月21日

React環境を構築する方法です。

create-react-app コマンドを使うとReact環境を簡単に構築できます。

手順

例としてC:\testフォルダ配下に「myapp」というプロジェクト名でReact環境を作成してみます。

(事前準備)

TypeScript環境にはNode.jsが必要です。 以下記事を参考にNode.jsをインストールしてください。

①C:\testフォルダを作成して、C:\testフォルダに移動する

コマンドプロンプト
C:\>mkdir C:\test C:\>cd C:\test C:\test>

②「npx create-react-app myapp」コマンドを実行する

コマンドプロンプト
C:\test>npx create-react-app myapp

myappは今回の例で使用するプロジェクト名です。 実行中に確認プロンプトが表示されたらy(=YES)で進めてください。

③C:\test\myappフォルダへ移動し、「npm start」を実行する

コマンドプロンプト
C:\test>cd myapp C:\test\myapp>npm start

④ブラウザが起動して以下画面が起動すれば、Reactのサンプル環境が完成です。

React初期画面  

止めたい場合は起動しているコマンドプロンプト画面で[Ctrl] + [c]を押して、yを入力すればOKです。

コマンドプロンプト
webpack compiled successfully バッチ ジョブを終了しますか (Y/N)? y C:\test\myapp>

備考

  • コマンド「npx create-react-app <プロジェクト名>」は、 「npm init react-app <プロジェクト名>」でもOKです。

関連記事

-React
-