feat(docker compose)!: add docker compose instead of using a pre-build Dockerfile

Author: DeepanshKhurana

.github/workflows/publish.yml

@@ -0,0 +1,38 @@
+name: Build and Publish
+
+on:
+  push:
+    branches: ["main"]
+    tags: ["v*"]
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: docker/metadata-action@v5
+        id: meta
+        with:
+          images: ghcr.io/deepanshkhurana/ode
+          tags: |
+            type=raw,value=latest,enable={{is_default_branch}}
+            type=semver,pattern={{version}}
+            type=semver,pattern={{major}}.{{minor}}
+
+      - uses: docker/login-action@v3
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - uses: docker/build-push-action@v5
+        with:
+          context: .
+          push: true
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}

CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.1.0] - 2025-11-26
+
+### Added
+
+- Major change since the app now moves to a `docker-compose.yaml` setup fundamentally changing how to write content in it. `README.md` will have more context but you can now mount directories for content (`pieces` and `pages`) while using the public image to constantly rebuild the site on push or update. You are free to set this up yourself. `config.yaml`, `intro.md`, and `favicon.ico` can also be mounted.
+
 ## [1.0.3] - 2025-11-26
 
 ### Added

Dockerfile

@@ -1,10 +1,11 @@
-FROM node:20-alpine AS build
+FROM node:20-alpine
+
 WORKDIR /app
+
 COPY package*.json ./
-RUN npm install
+RUN npm ci
+
 COPY . .
-RUN npm run build
-FROM nginx:alpine
-COPY --from=build /app/dist /usr/share/nginx/html
-EXPOSE 80
-CMD ["nginx", "-g", "daemon off;"]
+
+EXPOSE 4173
+CMD ["sh", "-c", "npm run build && npm run preview -- --host 0.0.0.0 --port 4173"]

README.md

@@ -10,6 +10,11 @@ The theme/idea comes directly from `journal.coffee` which is my Wordpress-based
 
 Rest assured, I will be using `ode` too!
 
+## Warning
+
+> [!WARNING]  
+> Like all good things, Ode is currently changing and evolving. Things might break now and then.
+
 ## Live Demo
 
 You can find a live demo of the app [here](https://ode-demo.vercel.app/).
@@ -64,87 +69,71 @@ https://github.com/user-attachments/assets/222af674-11f0-4b5a-8232-a31aca8a61b1
 - **Fully customizable**: All UI labels, site metadata, and page order configurable via `config.yaml`
 - **No tracking, no analytics, no boxes, no search, no media**: Just writing and reading
 
-## Tech Stack
-
-- **React 19** with React Router for client-side navigation
-- **Vite** for blazing fast development and optimized builds
-- **SCSS** for styling with a clean, minimal design
-- **TypeScript** build scripts for content indexing and generation
-- **ReactMarkdown** for rendering markdown content
-- **Front Matter** for parsing markdown metadata
-
 ## Getting Started
 
-### Deployment Gotchas!
-
-Once you have your Fork or branch ready, you can deploy the app but the reader position Permalinks as well as the Body of Work links will fail. This is due to SPA handling of paths and (from my understanding) how React works. But this can be fixed.
-
-#### Easy Mode: Deploy to Vercel
+### Docker Compose (Recommended)
 
-You can directly to Vercel below. `vercel.json` already has the fixes Vercel will need.
+If you want to self-host, use the public Docker image. Create a directory with your content:
 
-https://github.com/DeepanshKhurana/ode/blob/46873b31df3d4b02bbb375d4389173a1b6ac3f6b/vercel.json#L1-L12
-
-[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FDeepanshKhurana%2Fode)
-
-#### Pro Mode: nginx Configuration
-
-If you are like me, you probably have your own server where you will need to handle SPA routing. If you are using nginx, a template is already provided.
-
-https://github.com/DeepanshKhurana/ode/blob/81c9c2916c5fade480a017b277be7eb1dc799cb4/nginx-template#L1-L32
-
-### From WordPress
+```
+my-site/
+  public/
+    config.yaml
+    content/
+      intro.md
+      pieces/
+      pages/
+  docker-compose.yml
+```
 
-If you are coming from WordPress, you can use the awesome [lonekorean/wordpress-export-to-markdown](https://github.com/lonekorean/wordpress-export-to-markdown) to get your content in markdown format. It will mostly be plug and play with this version of Ode.
+Create a `docker-compose.yml`:
+
+```yaml
+services:
+  ode:
+    image: ghcr.io/deepanshkhurana/ode:latest
+    ports:
+      - "8080:4173"
+    restart: unless-stopped
+    volumes:
+      - ./public:/app/public:ro
+```
 
-### Installation
+Run:
 
 ```bash
-npm install
+docker compose up -d
 ```
 
-### Development
+Your site will be available at `http://localhost:8080`. Restart the container to rebuild after content changes:
 
 ```bash
-npm run dev
+docker compose restart
 ```
 
-Runs the app in development mode at `http://localhost:5173`
+### Other Deployment Options
 
-### Building
+**Note:** In this case, you need to replace the content in `public/` with your own.
 
-```bash
-npm run build
-```
+Once you have your Fork or branch ready, you can deploy the app but the reader position Permalinks as well as the Body of Work links will fail. This is due to SPA handling of paths and (from my understanding) how React works. But this can be fixed.
 
-This will:
-1. Index all pieces from `public/content/pieces/`
-2. Index all pages from `public/content/pages/`
-3. Paginate pieces for reader mode
-4. Calculate word/piece statistics
-5. Generate RSS feed
-6. Generate body of work archive
-7. Build the production bundle
+#### Deploy to Vercel
 
-### Preview Production Build
+You can directly to Vercel below. `vercel.json` already has the fixes Vercel will need.
 
-```bash
-npm run preview
-```
+https://github.com/DeepanshKhurana/ode/blob/46873b31df3d4b02bbb375d4389173a1b6ac3f6b/vercel.json#L1-L12
 
-## Configuration
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FDeepanshKhurana%2Fode)
 
-Edit `public/config.yaml` to customize your site. You can handle quite a few things here:
+#### nginx Configuration
 
-- Change your site’s name, author, and vibe at the top.
-- Tweak button text and messages to sound how you want.
-- Pick which pages show up first in the menu.
-- Hide any pages or pieces you don’t want public.
-- Set how collections are sorted—oldest first or newest first.
-- Rename the light/dark mode switches.
-- Edit the “words wasted” summary to your liking.
+If you are like me, you probably have your own server where you will need to handle SPA routing. If you are using nginx, a template is already provided.
 
-https://github.com/DeepanshKhurana/ode/blob/2e61bbe7eadcc36ff9b05c13e4e4d71ab4c885b1/public/config.yaml#L1-L41
+https://github.com/DeepanshKhurana/ode/blob/81c9c2916c5fade480a017b277be7eb1dc799cb4/nginx-template#L1-L32
+
+### From WordPress
+
+If you are coming from WordPress, you can use the awesome [lonekorean/wordpress-export-to-markdown](https://github.com/lonekorean/wordpress-export-to-markdown) to get your content in markdown format. It will mostly be plug and play with this version of Ode.
 
 ## Writing Content
 
@@ -179,7 +168,58 @@ date: 2021-06-14
 Tell everyone everything!
 ```
 
-## Build Scripts
+## Configuration
+
+Edit `public/config.yaml` to customize your site. You can handle quite a few things here:
+
+- Change your site's name, author, and vibe at the top.
+- Tweak button text and messages to sound how you want.
+- Pick which pages show up first in the menu.
+- Hide any pages or pieces you don't want public.
+- Set how collections are sorted—oldest first or newest first.
+- Rename the light/dark mode switches.
+- Edit the "words wasted" summary to your liking.
+
+https://github.com/DeepanshKhurana/ode/blob/2e61bbe7eadcc36ff9b05c13e4e4d71ab4c885b1/public/config.yaml#L1-L41
+
+## Development
+
+### Installation
+
+```bash
+npm install
+```
+
+### Dev Server
+
+```bash
+npm run dev
+```
+
+Runs the app in development mode at `http://localhost:5173`
+
+### Building
+
+```bash
+npm run build
+```
+
+This will:
+1. Index all pieces from `public/content/pieces/`
+2. Index all pages from `public/content/pages/`
+3. Paginate pieces for reader mode
+4. Calculate word/piece statistics
+5. Generate RSS feed
+6. Generate body of work archive
+7. Build the production bundle
+
+### Preview Production Build
+
+```bash
+npm run preview
+```
+
+### Build Scripts
 
 Run individual build scripts:
 
@@ -190,6 +230,15 @@ Run individual build scripts:
 - `npm run build:rss` - Generate RSS feed
 - `npm run build:sitemap` - Generate Sitemap
 
+## Tech Stack
+
+- **React 19** with React Router for client-side navigation
+- **Vite** for blazing fast development and optimized builds
+- **SCSS** for styling with a clean, minimal design
+- **TypeScript** build scripts for content indexing and generation
+- **ReactMarkdown** for rendering markdown content
+- **Front Matter** for parsing markdown metadata
+
 ## License
 
 MIT

docker-compose.yml

@@ -0,0 +1,8 @@
+services:
+  ode:
+    image: ghcr.io/deepanshkhurana/ode:latest
+    ports:
+      - "8080:4173"
+    restart: unless-stopped
+    volumes:
+      - ./public:/app/public:ro