Skip to content

Commit a35322a

Browse files
karl-cardenas-codingkarl-cardenas-coding
authored
Merge pull request #3 from spectrocloud/caddy
Reverse-Proxy
2 parents 5992e46 + a26f4fd commit a35322a

File tree

14 files changed

+369
-50
lines changed

14 files changed

+369
-50
lines changed

‎.dockerignore‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
node_modules/
22
static/
3-
build/
3+
build/
4+
*log

‎.github/workflows/release.yaml‎

Lines changed: 75 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -64,12 +64,81 @@ jobs:
6464
push: true
6565
tags: ghcr.io/${{ github.repository }}:${{steps.version.outputs.VERSION}}
6666

67+
docker-reverse-proxy:
68+
name: "Docker w/Proxy image"
69+
runs-on: ubuntu-latest
70+
outputs:
71+
VERSION: ${{ steps.version.outputs.version }}
72+
steps:
73+
- id: checkout
74+
name: Checkout Repository
75+
uses: actions/checkout@v3
76+
77+
- name: Setup Nodejs
78+
uses: actions/setup-node@v3
79+
with:
80+
node-version: 18
81+
82+
- name: Install dependencies
83+
run: npm ci
84+
85+
- id: version
86+
name: Determine Release Version
87+
run: |
88+
npm install @semantic-release/exec -D
89+
npm install @semantic-release/changelog -D
90+
npm install @semantic-release/git -D
91+
npx semantic-release --dry-run
92+
cat VERSION.env
93+
source VERSION.env
94+
echo "::set-output name=version::$VERSION"
95+
96+
97+
- name: Set up QEMU
98+
if: ${{ steps.version.outputs.VERSION != ''}}
99+
uses: docker/setup-qemu-action@v2
100+
101+
- name: Set up Docker Buildx
102+
if: ${{ steps.version.outputs.VERSION != ''}}
103+
uses: docker/setup-buildx-action@v2
104+
105+
106+
- name: Login to GHCR
107+
if: ${{ steps.version.outputs.VERSION != ''}}
108+
uses: docker/login-action@v1
109+
with:
110+
registry: ghcr.io
111+
username: ${{ github.repository_owner }}
112+
password: ${{ secrets.GITHUB_TOKEN }}
113+
114+
- name: Build and Push Docker Image
115+
if: ${{ steps.version.outputs.VERSION != ''}}
116+
uses: docker/build-push-action@v2
117+
with:
118+
context: .
119+
file: Dockerfile.Caddy
120+
platforms: linux/amd64,linux/arm64
121+
push: true
122+
tags: ghcr.io/${{ github.repository }}:${{steps.version.outputs.VERSION}}-proxy
123+
124+
release:
125+
name: "Release"
126+
needs: [docker,docker-reverse-proxy]
127+
runs-on: ubuntu-latest
128+
steps:
129+
- id: checkout
130+
name: Checkout Repository
131+
uses: actions/checkout@v3
132+
133+
- name: Setup Nodejs
134+
uses: actions/setup-node@v3
135+
with:
136+
node-version: 18
137+
138+
- name: Install dependencies
139+
run: npm ci
140+
67141
- name: "release"
68142
env:
69143
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
70-
run: |
71-
npm install @semantic-release/exec -D
72-
npm install @semantic-release/changelog -D
73-
npm install @semantic-release/github -D
74-
npm install @semantic-release/git -D
75-
npx semantic-release
144+
run: npx semantic-release

‎.github/workflows/test.yaml‎

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
name: Test
2+
3+
on:
4+
pull_request:
5+
types: ['synchronize', 'opened', 'reopened', 'ready_for_review']
6+
branches:
7+
- main
8+
9+
env:
10+
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
11+
12+
concurrency:
13+
group: ci-${{ github.ref }}
14+
cancel-in-progress: true
15+
16+
jobs:
17+
docker:
18+
name: "Docker Dev image"
19+
runs-on: ubuntu-latest
20+
steps:
21+
- id: checkout
22+
name: Checkout Repository
23+
uses: actions/checkout@v3
24+
25+
- name: Setup Nodejs
26+
uses: actions/setup-node@v3
27+
with:
28+
node-version: 18
29+
30+
- name: Install dependencies
31+
run: npm ci
32+
33+
34+
- name: Set up QEMU
35+
uses: docker/setup-qemu-action@v2
36+
37+
- name: Set up Docker Buildx
38+
uses: docker/setup-buildx-action@v2
39+
40+
41+
- name: Login to GHCR
42+
uses: docker/login-action@v1
43+
with:
44+
registry: ghcr.io
45+
username: ${{ github.repository_owner }}
46+
password: ${{ secrets.GITHUB_TOKEN }}
47+
48+
- name: Build and Push Docker Image
49+
uses: docker/build-push-action@v2
50+
with:
51+
context: .
52+
platforms: linux/amd64,linux/arm64
53+
push: true
54+
tags: ghcr.io/${{ github.repository }}:dev
55+
56+
docker-reverse-proxy:
57+
name: "Docker Dev w/Proxy image"
58+
runs-on: ubuntu-latest
59+
steps:
60+
- id: checkout
61+
name: Checkout Repository
62+
uses: actions/checkout@v3
63+
64+
- name: Setup Nodejs
65+
uses: actions/setup-node@v3
66+
with:
67+
node-version: 18
68+
69+
- name: Install dependencies
70+
run: npm ci
71+
72+
73+
- name: Set up QEMU
74+
uses: docker/setup-qemu-action@v2
75+
76+
- name: Set up Docker Buildx
77+
uses: docker/setup-buildx-action@v2
78+
79+
80+
- name: Login to GHCR
81+
uses: docker/login-action@v1
82+
with:
83+
registry: ghcr.io
84+
username: ${{ github.repository_owner }}
85+
password: ${{ secrets.GITHUB_TOKEN }}
86+
87+
- name: Build and Push Docker Image
88+
uses: docker/build-push-action@v2
89+
with:
90+
context: .
91+
file: Dockerfile.Caddy
92+
platforms: linux/amd64,linux/arm64
93+
push: true
94+
tags: ghcr.io/${{ github.repository }}:dev-proxy

‎.gitignore‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,4 +106,6 @@ dist
106106

107107
build/
108108

109-
*.DS_Store
109+
*.DS_Store
110+
111+
*log

‎Caddyfile‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
:8080 {
2+
root * /app/build/
3+
encode gzip
4+
try_files {path} /index.html
5+
file_server
6+
log {
7+
output file /var/log/caddy/caddy.log {
8+
roll_size 1gb
9+
roll_keep 2
10+
roll_keep_for 720h
11+
}
12+
format json {
13+
time_format wall
14+
}
15+
}
16+
}
17+
18+
:3000 {
19+
reverse_proxy {$API_URI}
20+
}
21+

‎Dockerfile‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,20 +13,20 @@ WORKDIR /app
1313
ENV NODE_ENV production
1414
ENV NEXT_TELEMETRY_DISABLED 1
1515
ENV PORT 8080
16-
ENV API_URI ""
16+
ENV API_URI ""
1717
ENV API_VERSION 1
18+
ENV REVERSE_PROXY false
1819

1920
COPY --from=modules /etc/passwd /etc/passwd
2021
COPY --from=modules /etc/group /etc/group
2122
COPY --from=modules --chown=appuser:appuser /home/appuser/ /home/appuser/
2223
COPY --from=modules --chown=appuser:appuser /app/node_modules ./node_modules
2324
COPY --from=modules --chown=appuser:appuser /app/build ./build
2425
COPY --from=modules --chown=appuser:appuser /app/package.json ./package.json
25-
COPY --from=modules --chown=appuser:appuser /app/start.sh /usr/bin/
26-
RUN apk update && apk upgrade && apk add --no-cache bash && \
27-
chmod +x /usr/bin/start.sh
26+
RUN apk update && apk upgrade && apk add --no-cache curl ca-certificates bash
2827

2928
USER appuser
3029
EXPOSE 8080
3130

32-
CMD [ "sh", "-c", "/usr/bin/start.sh" ]
31+
CMD ["/bin/bash", "-c", "REACT_APP_API_URI=$API_URI REACT_APP_API_VERSION=$API_VERSION REACT_APP_REVERSE_PROXY=$REVERSE_PROXY npx react-inject-env set && \
32+
npm run server-prod"]

‎Dockerfile.Caddy‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
FROM node:18-alpine AS modules
2+
WORKDIR /app
3+
COPY . .
4+
RUN npm ci && npm run build && \
5+
adduser -u 1002 -D appuser appuser
6+
7+
FROM caddy:2.6.2-alpine as caddy
8+
9+
FROM node:18-alpine AS production
10+
LABEL org.opencontainers.image.source="https://github.com/spectrocloud/hello-universe"
11+
LABEL org.opencontainers.image.description "A Spectro Cloud demo application intended for learning and showcasing products. This image contains a reverse proxy."
12+
13+
WORKDIR /app
14+
ENV NODE_ENV production
15+
ENV NEXT_TELEMETRY_DISABLED 1
16+
ENV PORT 8080
17+
ENV API_URI ""
18+
ENV API_VERSION 1
19+
ENV REVERSE_PROXY true
20+
21+
COPY --from=modules /etc/passwd /etc/passwd
22+
COPY --from=modules /etc/group /etc/group
23+
COPY --from=modules --chown=appuser:appuser /home/appuser/ /home/appuser/
24+
COPY --from=modules --chown=appuser:appuser /app/node_modules ./node_modules
25+
COPY --from=modules --chown=appuser:appuser /app/build ./build
26+
COPY --from=modules --chown=appuser:appuser /app/package.json ./package.json
27+
COPY --from=caddy --chown=appuser:appuser /usr/bin/caddy /usr/bin/caddy
28+
COPY --from=modules --chown=appuser:appuser /app/Caddyfile /etc/caddy/Caddyfile
29+
30+
RUN apk update && apk upgrade && apk add --no-cache curl ca-certificates bash && \
31+
mkdir -p /var/log/caddy/ && chown -R appuser:appuser /var/log/caddy/ && \
32+
chmod -R 700 /var/log/caddy/
33+
34+
USER appuser
35+
EXPOSE 8080 3000
36+
CMD ["/bin/bash", "-c", "REACT_APP_API_URI=$API_URI REACT_APP_API_VERSION=$API_VERSION REACT_APP_REVERSE_PROXY=$REVERSE_PROXY npx react-inject-env set && \
37+
caddy run --config /etc/caddy/Caddyfile --adapter caddyfile"]

‎Makefile‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
.PHONY: build
2+
3+
build: clean
4+
@echo "Building..."
5+
npm run build
6+
7+
start:
8+
@echo "Starting..."
9+
npm run start
10+
11+
start-prod: clean build
12+
@echo "Starting production server"
13+
npm run server-prod
14+
15+
clean:
16+
@echo "Cleaning..."
17+
rm -rf build
18+
19+
start-proxy: clean build
20+
@echo "Starting reverse proxy..."
21+
caddy run --config local-caddyfile --adapter caddyfile

‎README.md‎

Lines changed: 42 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@ Hello Universe is available as a Docker image.
1616
To run Hello Universe issue the following commands:
1717

1818
```shell
19-
docker pull ghcr.io/spectrocloud/hello-universe:1.0.3
20-
docker run -p 8080:8080 ghcr.io/spectrocloud/hello-universe:1.0.3
19+
docker pull ghcr.io/spectrocloud/hello-universe:1.0.4
20+
docker run -p 8080:8080 ghcr.io/spectrocloud/hello-universe:1.0.4
2121
```
2222

2323
## Non-Docker
@@ -37,6 +37,7 @@ Hello Universe accepts the following environment variables:
3737
|-------------|----------------------------------------------------|-----------|
3838
| API_URI | The fully qualified hostname and port of the API server, such as `http://localhost:3000` | "" |
3939
| API_VERSION | The API version number | `1` |
40+
| REVERSE_PROXY| Enable to use the reverse proxy. This value is set to `true` in the proxy container image. |`false`|
4041

4142

4243
## Connecting to API Server
@@ -45,17 +46,55 @@ Hello Universe's capabilities can be expanded if connected to the [Hello Univers
4546
To connect Hello Universe to the API server, provide the API server's fully qualified hostname and port as an environment variable value.
4647
Be aware that the API server requires an available Postgres database. Checkout [Hello Universe DB](https://github.com/spectrocloud/hello-universe-db) for a dockerized Postgres instance ready for integration with the Hello Universe API.
4748

49+
4850
```shell
4951
API_URI=http://localhost:3000
5052
```
5153

5254
If you are using the Docker image then use the `-e` flag parameter.
5355

5456
```shell
55-
docker run -p 8080:8080 -e API_URI=http://localhost:3000 ghcr.io/spectrocloud/hello-universe:1.0.3
57+
docker run -p 8080:8080 -e API_URI=http://localhost:3000 ghcr.io/spectrocloud/hello-universe:1.0.4
5658
```
5759

60+
### Reverse Proxy
61+
62+
A Docker container with a reverse proxy for `http://0.0.0.0:3000` is available. The reverse proxy is usefull for scenarios when you need to deploy the
63+
hello universe application into a Kubernetes cluster or similar architectures and need the UI to route requests internal to the hosting platform
64+
to reach the API. **The reverse proxy expects the API to be listening on port `3000`.**
65+
66+
```shell
67+
docker run -p 8080:8080 -e API_URI="http://myprivate.api.address.example:3000" ghcr.io/spectrocloud/hello-universe:1.0.5-proxy
68+
```
69+
70+
# Development
71+
72+
Create an environment file `.env` file and add the following values:
73+
74+
```
75+
REACT_APP_API_URI=http://localhost:3000
76+
REACT_APP_API_VERSION=1
77+
```
78+
79+
The `.env` file is how you point to the local development API server. Otherwise, you will use the global API counter.
80+
81+
82+
## Clean
83+
To remove the build folder use the command `make clean`
84+
85+
## Build
86+
To build the hosting assets use the command `make build`
87+
### Development Server
88+
To start the local development server without a proxy use the command `make start`.
89+
90+
### Server w/o Reverse Proxy
91+
To start the Caddy server without a reverse proxy use the command `make start-prod`.
92+
93+
### Server w/o Reverse Proxy
94+
To start the Caddy server with a reverse proxy use the command `make start-proxy`.
95+
5896
## Dependencies
5997

98+
- [Caddy](https://caddyserver.com/docs/)
6099
- [Count API](https://countapi.xyz/) is used to keep a global count of clicks.
61100
- [React Spring](https://github.com/pmndrs/react-spring) is used to animate the logo.

0 commit comments

Comments
 (0)