React初心者さん集まれ！
「Reactのテンプレートファイルを作って、軽く編集できるまで」を解説します！
「環境構築」ができている人向けです！
Reactのテンプレートファイルの作り方
やることは簡単です！
ターミナルでコマンドを打って、実行するだけ！
すると、必要なファイルを自動で作ってくれます。
詳しく解説します。
ターミナルを開く
まずはターミナルを開きましょう。
そしたら、
ファイルを保存したいディレクトリに移動します！
cd ○○○○の部分は適宜変えてください！！
移動できたら、
ファイルを作成します！
以下のコマンドを実行すれば、Reactのテンプレートファイルが生成できます。
npx create-react-app ○○○○には、好きなフォルダ名をつけます。
アプリの名前にすればいいです！
これだけです！！
Reactのファイルが作成できました！
不安なあなた！
わかりますよ。ちゃんとアプリができているか確認してみましょう！
ローカルサーバーを立ち上げて、Reactアプリを確認する！
ファイルが作成できたら、うまくできているか、確認してみましょう！
エディタを開き、先ほど作ったフォルダを開きます。
エディタのターミナルを開いて。
コマンド
npm start→ブラウザが立ち上がります。
ブラウザにReactの初期画面が出ればうまくできています！
あとは好きなように編集していきます！
アプリを止める方法
npm startでスタートしたアプリを止めるに。
コマンド
control ＋ c
でＯＫです。
アプリを本番環境にうつす
作ったアプリを本番環境に移すには、ファイルの書き換えが必要です。
とはいっても簡単です。
ターミナルのコマンド
npm run buildとすると。
→buildフォルダが生成されます。
生成された「build」フォルダをサーバーにアップロードすればアプリの完成です！
Reactの各種ファイルについて
Reactの各種ファイルについて説明します。
フォルダ名とその中身。
srcフォルダ
開発用のソースが格納されます。
publicフォルダ
静的ファイル（htmlファイルや画像など）が格納されます。
buildフォルダ
本番用のファイルが格納されます。
npm run buildで生成します。
おつかれさまでした。
Reactデビューおめでとうございます！！
記事を読んでくださりありがとうございました。
この記事が参考になった、おもしろかったという方、広告をクリックしていただけると励みになります。
これからもよろしくお願い致します。
