Turning a Markdown Repository into a Hosted Docs Site with MkDocs

Convert flat Markdown files into a searchable MkDocs site by moving them into a docs/ folder, adding a simple YAML config, and deploying via GitHub Actions.

INFO
While often referred to colloquially as a “GitBook”, we use MkDocs with the Material theme because it’s open-source, highly customizable, and looks incredibly professional out of the box.

1. Reorganize the Files

Static site generators expect a specific directory structure. Move all your standalone .md files into a dedicated docs/ folder. Your root ReadMe.md should be copied to docs/index.md to serve as the homepage.

mkdir -p docs
# Move all markdown files except ReadMe.md
for file in *.md; do if [ "$file" != "ReadMe.md" ]; then mv "$file" docs/; fi; done
# Copy ReadMe to act as the homepage
cp ReadMe.md docs/index.md

2. Configure MkDocs

Create an mkdocs.yml file in the root of your project. This file defines the site name, theme, and the sidebar navigation structure.

site_name: The Engineering Playbook
theme:
  name: material
  palette:
    - scheme: default
      toggle:
        icon: material/brightness-7
        name: Switch to dark mode
    - scheme: slate
      toggle:
        icon: material/brightness-4
        name: Switch to light mode

nav:
  - Introduction: index.md
  - Architecture:
    - Clean Architecture: CleanArchitecture.md

The nav array maps the sidebar labels to your Markdown files.

3. Deploy via GitHub Actions

To host the site for free on GitHub Pages, add a workflow file at .github/workflows/docs-deploy.yml.

name: Deploy docs
on:
  push:
    branches:
      - main
permissions:
  contents: write
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-python@v5
        with:
          python-version: 3.x
      - run: pip install mkdocs-material 
      - run: mkdocs gh-deploy --force

When you push to main, this workflow installs MkDocs, builds the static HTML, and forcefully pushes it to the gh-pages branch. GitHub Pages will then automatically serve your beautiful new documentation site.

4. Improving Developer Experience (The ./run Script)

To make it trivial for your team to write documentation locally without memorizing Python commands, add a simple executable shell script named run to the root of your project.

#!/usr/bin/env bash
set -e

case "$1" in
    setup)
        echo "Installing MkDocs..."
        pip install mkdocs-material
        ;;
    serve)
        echo "Starting local server..."
        mkdocs serve
        ;;
    build)
        echo "Building static site..."
        mkdocs build
        ;;
    help|*)
        echo "Usage: ./run [setup|serve|build]"
        ;;
esac

Now, anyone pulling the repository can simply type ./run setup followed by ./run serve to instantly spin up a live-reloading local preview of the documentation!

If you enjoyed this article, feel free to support my work on Ko-fi!

Support on Ko-fi