add configuration to use react-nginx sample with Docker Dev Environments feature (#269)

Signed-off-by: Guillaume Lours <guillaume.lours@docker.com>
master
Guillaume Lours 2 years ago committed by GitHub
parent e45810975f
commit 20089c790b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -0,0 +1,11 @@
services:
frontend:
build:
context: .
target: dev-envs
container_name: frontend
ports:
- "80:3000"
- "3000:3000"
volumes:
- /var/run/docker.sock:/var/run/docker.sock

@ -1,3 +1,5 @@
# syntax=docker/dockerfile:1.4
# 1. For build React app # 1. For build React app
FROM node:lts AS development FROM node:lts AS development
@ -22,6 +24,22 @@ FROM development AS build
RUN npm run build RUN npm run build
FROM development as dev-envs
RUN <<EOF
apt-get update
apt-get install -y --no-install-recommends git
EOF
RUN <<EOF
useradd -s /bin/bash -m vscode
groupadd docker
usermod -aG docker vscode
EOF
# install Docker tools (cli, buildx, compose)
COPY --from=gloursdocker/docker / /
CMD [ "npm", "start" ]
# 2. For Nginx setup # 2. For Nginx setup
FROM nginx:alpine FROM nginx:alpine

@ -86,3 +86,14 @@ Stopping frontend ... done
Removing frontend ... done Removing frontend ... done
Removing network react-nginx_default Removing network react-nginx_default
``` ```
## Use with Docker Development Environments
You can use this sample with the Dev Environments feature of Docker Desktop.
![Screenshot of creating a Dev Environment in Docker Desktop](../dev-envs.png)
To develop directly on the services inside containers, use the HTTPS Git url of the sample:
```
https://github.com/docker/awesome-compose/tree/master/react-nginx
```

@ -1,4 +1,3 @@
version: "3.7"
services: services:
frontend: frontend:
build: build:

Loading…
Cancel
Save