■はじめに
ReactとDockerの環境構築は完了している前提で記載します。
まだの方は、それぞれの環境構築を行ってからご覧ください。
■手順
以下のコマンドを実行し、Reactプロジェクトを作成します。
create-react-app dockersample以下のコマンドを実行し、reactアプリが正常に動作することを確認します。
cd dockersample
yarn start以下のコマンドで、Dockerfileを生成します。
vi Dockerfile「Dockerfile」に以下を記載します。
# ベースイメージの作成
FROM node:12.16.1
# コンテナ内で作業するディレクトリを指定
WORKDIR /usr/src/app
# package.jsonとyarn.lockを/usr/src/appにコピー
COPY ["package.json", "yarn.lock", "./"]
# パッケージをインストール
RUN yarn install
# ファイルを全部作業用ディレクトリにコピー
COPY . .
# コンテナを起動する際に実行されるコマンド
ENTRYPOINT [ "yarn", "start" ]以下のコマンドで、イメージを生成する（ビルドする）
docker build -t sample .以下のコマンドでdockerを起動する
docker run -it --name sample -p 3000:3000 -v $PWD:/usr/src/app sampleブラウザで「http://localhost:3000/」にアクセスして、Reactの画面が表示されればOK！