React 入門
JavaScript コメント掲示板アプリの開発
プロジェクトの作成
ここでは React プロジェクトを作成するところから始めます．プロジェクト名は react-comment-app とします．次の通り npx コマンドを使いプロジェクトを作成します．このとき，多くのファイルがダウンロードされるのでインストールには数分かかる可能性があります．
% npx create-react-app react-comment-app ⏎ Creating a new React app in /Users/rinsaka/Documents/work/react/comment-app-API/react-comment-app. Installing packages. This might take a couple of minutes. Installing react, react-dom, and react-scripts with cra-template... ．．．（中略）．．． Run `npm audit` for details. Created git commit. Success! Created react-comment-app at /Users/rinsaka/Documents/work/react/comment-app-API/react-comment-app Inside that directory, you can run several commands: npm start Starts the development server. npm run build Bundles the app into static files for production. npm test Starts the test runner. npm run eject Removes this tool and copies build dependencies, configuration files and scripts into the app directory. If you do this, you can’t go back! We suggest that you begin by typing: cd react-comment-app npm start Happy hacking!
プロジェクトの作成が完了すれば「Happy hacking!」と表示されます．その直前に次に必要なコマンドが記されているので，そのとおり実行します．
% cd react-comment-app ⏎ % npm start ⏎
Google Chrome が起動して，次の画面がされるはずです．
もしも自動的にブラウザが起動しなかったり，他のブラウザが起動した場合は，Google Chrome のアドレスバーに http://localhost:3000/ （あるいは npm start コマンドのあとに表示されたアドレス）を入力してください．
プロジェクトのフォルダから次のコマンドを実行すると，フォルダを開いた状態で Visual Studio Code を起動することができます．
% code . ⏎
また，Git のインストールと初期設定が終わっている状態で React のアプリケーションを生成すると，生成が完了した段階で最初のコミットが自動的に作成されています．以降ではキリの良いところでコミットを重ねていくとよいでしょう．