How do you serve your Angular app? Learn to build a web server for your Angular app in 6 lines of code. Throw in 8 more lines and you have a multi stage Docker build for your web server along with it.
Angular Web Server in 6 Lines
6 lines of code, that's all it takes for a simple Angular WebServer powered by Caddy:
:4200 {
root * /usr/share/caddy
encode gzip
try_files {path} /index.html
file_server
}
Multi Stage Docker Build in 8 Lines
Now let's throw in another 8 lines of code to get a multi stage Docker build for our Angular frontend.
As a result you'll get a Caddy powered container of your Angular app.
# 1. Frontend Builder
FROM node:18 as builder
WORKDIR /app
ADD . /app
RUN npm ci && npm run build
# 2. Frontend Container
FROM caddy:2.6.4-alpine
EXPOSE 4200
COPY Caddyfile /etc/caddy/Caddyfile
COPY --from=builder /app/dist/frontend/* /usr/share/caddy
Check it out live and working in our Github repo below (folder frontend). Have fun and enjoy!!
Top comments (0)