HaneCa

ここではReactアプリの作成方法について説明します。

Reactアプリの初期作成について

Reactでは、初期プロジェクトを生成する方法として、create-react-appというコマンドが用意されています。ここでは、それを利用してアプリを生成するところまでを説明します。

手順

今回は次のような手順でReactアプリを作成しました。

1. create-react-appのインストール
2. create-react-appでReactアプリの生成
3. Reactアプリの起動

create-react-appのインストール

次のコマンドを実行することでインストールできます。

$ npm i -g create-react-app

Reactアプリの生成

次のコマンドを実行することでアプリを生成することができます。

$ create-react-app react-upload-sample

ここで”react-app-sample”はアプリ名です。

生成したアプリの起動方法

次のコマンドを実行することでアプリを起動することができます。

$ cd react-upload-sample
$ yarn install
$ yarn start

ここでブラウザが起動し、次のような画面が現れれば正しく作成できています。

ここで起動したWebサービスは、開発用のサービスとなります。実際に設置する場合は、”yarn build”と設置用のファイルを生成する必要があります。

また、今回作成したソースコードは、こちらに公開しています。

参考サイト

• react
• github/create-react-app