Reactの開発環境を構築する-Docker

前提条件

・Docker Composeがインストールされている。
・Reactプロジェクトを作成している。

1. 必要なファイルを作成する

以下の内容で「Dockerfile」と「docker-compose.yml」を作成し、Reactプロジェクトと同じフォルダ階層に配置してください。
※Reactプロジェクトのフォルダ名は「react-app」とします

Dockerfile

FROM node:18.12.1-alpine
WORKDIR /usr/src/app

docker-compose.yml

version: '3.9'

services:
  react-app:
    build:
      context: .
      dockerfile: Dockerfile
    volumes:
      - ./react-app:/usr/src/app
    command: sh -c "cd react-app && npm start"
    ports:
      - "3000:3000"

2. 開発環境を起動する

$ docker-compose up

3. 動作確認

以下のURLにアクセスして、Reactプロジェクトのページが表示されることを確認する。
http://localhost:3000/