Make it easy to build docker image.

Dockerfile

@@ -0,0 +1,27 @@
+# ---------- Build stage ----------
+FROM node:20-alpine AS builder
+
+WORKDIR /app
+
+# Install pnpm (repo uses pnpm in its scripts)
+RUN npm install -g pnpm
+
+# Install deps
+COPY package.json pnpm-lock.yaml ./
+RUN pnpm install --frozen-lockfile
+
+# Build static-browser-server outputs
+COPY . .
+RUN npm run build      # this runs build-relay and friends, generating out/preview
+
+# ---------- Runtime stage ----------
+FROM nginx:alpine
+
+# This is crucial: serve the *preview* directory as web root
+COPY --from=builder /app/out/preview /usr/share/nginx/html
+
+# Nginx already listens on 0.0.0.0:80
+EXPOSE 80
+
+CMD ["nginx", "-g", "daemon off;"]
+

README.md

@@ -1,3 +1,23 @@
 # Static browser server
 
 A simple service worker used for the static template in sandpack, allowing users to develop websites like they would locally in the browser.
+
+# Docker Build
+
+Build docker image using the follow build command
+
+```
+docker buildx build --platform linux/amd64 -t static-browser-server:0.1.0 .
+```
+
+Run the docker image as follows
+```
+docker run --rm -p 8080:80 static-browser-server:0.1.0
+```
+
+Test by visiting the following address, you should see some HTML.
+```
+curl http://localhost:8080
+```
+
+In production you need to put this service behind a wildcard DNS record so dynamic URLs can be generated, that is beyond the scope of this doc.

servers/demo-server.ts

@@ -5,6 +5,7 @@ import fastifyStatic from "@fastify/static";
 import path from "path";
 
 const PORT = +(process.env.PORT || "4000");
+const HOST = process.env.HOST || "0.0.0.0";
 
 const app = fastify({ logger: true });
 
@@ -20,7 +21,7 @@ app.register(fastifyStatic, {
 });
 
 // Run the server!
-app.listen({ port: PORT }, function (err, address) {
+app.listen({ port: PORT, host: HOST }, function (err, address) {
   if (err) {
     app.log.error(err);
     process.exit(1);