====== 28 Docker React ======
DockerでReact環境を用意してみる。
===== 1 ファイル用意 =====
mkdir /app/react
cd /app/react
FROM node:18.12.1-alpine
WORKDIR /usr/src/app
version: '3'
services:
node:
container_name: "react"
build: .
volumes:
- .:/usr/src/app
command: sh -c 'cd [my-app] && yarn start'
ports:
- '3000:3000'
environment:
- CHOKIDAR_USEPOLLING=true
※[my-app]は、アプリ作成で作るアプリ名を入れる
※CHOKIDAR_USEPOLLING=Trueを入れておくと、編集するとホットリロードしてくれる。
===== 2 build =====
docker-compose build
===== 3 react アプリ作成 =====
※[my-app] は好きなアプリ名を入れる。
docker-compose run --rm node sh -c 'npx create-react-app [my-app] --template typescript'
===== 4 起動 =====
docker-compose up -d
===== 5 確認 =====
ブラウザで http://[IP]:3000 をアクセス
{{:06_virtualization:05_container:pasted:20231207-053734.png}}
{{tag>Docker React}}