Use single nginx container for app and docusaurus

config/nginx.conf.development.template

@@ -151,6 +151,10 @@ http {
       proxy_pass http://planet:9876;
     }
 
+    location /docs {
+      root /usr/share/nginx/html;
+    }
+
     # Static next.js front-end
     location / {
       # Directory from which we serve Next's static content

docker/development.yml

@@ -13,7 +13,7 @@ services:
   # API Gateway
   nginx:
     build:
-      context: ../src/web/app
+      context: ../src/web
       cache_from:
         - docker.cdot.systems/nginx:buildcache
       # next.js needs build-time access to a number of API URL values, forward as ARGs

src/web/app/Dockerfile → src/web/Dockerfile

@@ -15,13 +15,35 @@ ARG WEB_URL
 ARG SUPABASE_URL
 ARG ANON_KEY
 
+## Base ###########################################################################
 FROM node:16 as base
 
-WORKDIR /frontend
+RUN npm install -g pnpm
 
-COPY . .
+## Dependencies ###################################################################
+## Telescope app
+FROM base as dependencies-app
 
-FROM base as dependencies
+WORKDIR /app
+
+COPY ./app/package.json ./
+
+RUN pnpm install
+
+## Telescope docs
+FROM base as dependencies-docs
+
+WORKDIR /docs
+
+COPY ./docusaurus/package.json ./
+
+RUN pnpm install
+
+## Build ######################################################################
+## Telescope app
+FROM base as build-app
+
+WORKDIR /app
 
 # Copy the various API URLs build args over so next.js can see them in next.config.js
 ARG API_URL
@@ -57,10 +79,29 @@ ENV NEXT_PUBLIC_SUPABASE_URL ${SUPABASE_URL}
 ARG ANON_KEY
 ENV NEXT_PUBLIC_ANON_KEY ${ANON_KEY}
 
-RUN npm install --no-package-lock
+COPY ./app ./
+
+COPY --from=dependencies-app /app/node_modules ./node_modules
+
+RUN pnpm build
+
+## Telescope docs
+FROM base as build-docs
+
+WORKDIR /docs
+
+COPY ./docusaurus ./
+
+COPY --from=dependencies-docs /docs/node_modules ./node_modules
+
+RUN pnpm build
+
+## Deploy ######################################################################
+FROM nginx:1.20.2-alpine as deploy
+
+WORKDIR /
 
-RUN npm run build
+COPY --from=build-app /app/out /var/www/data
 
-FROM nginx:stable-alpine as build
+COPY --from=build-docs /docs/build /usr/share/nginx/html/docs
 
-COPY --from=dependencies /frontend/out /var/www/data

src/web/docusaurus/docusaurus.config.js

@@ -9,7 +9,7 @@ const config = {
   title: 'Telescope',
   tagline: "A tool for tracking blogs in orbit around Seneca's open source involvement",
   url: 'https://telescope.cdot.systems',
-  baseUrl: '/',
+  baseUrl: '/docs/',
   onBrokenLinks: 'throw',
   onBrokenMarkdownLinks: 'throw',
   favicon: 'img/favicon.ico',

src/web/docusaurus/src/pages/index.js

@@ -14,7 +14,7 @@ function HomepageHeader() {
         <h1 className="hero__title">{siteConfig.title}</h1>
         <p className="hero__subtitle">{siteConfig.tagline}</p>
         <div className={styles.buttons}>
-          <Link className="button button--secondary button--lg" to="/docs/overview">
+          <Link className="button button--secondary button--lg" to="./docs/overview">
             Docusaurus Tutorial - 5min ⏱️
           </Link>
         </div>