Building a Personal Knowledge Base with Quartz and Obsidian

4 min read

Inspired by Pranav Bhardwaj’s XDA article, I built this site in a couple of hours using Quartz, a static site generator designed specifically for publishing Obsidian vaults. With this post written mostly by Claude after we finished, here’s a complete guide to setting up your own Obsidian-powered blog in under two hours (or faster if you don’t take as much hand holding as I did).

Prerequisites

Part 1: Server Setup and Quartz Installation

1. Prepare Your Server

SSH into your server and install Node.js (Quartz requires Node 18+):

curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt install -y nodejs

2. Clone and Install Quartz

Create a project directory and clone Quartz:

mkdir -p ~/workbus
cd ~/workbus
git clone https://github.com/jackyzha0/quartz.git .
npm install

3. Configure Quartz

Edit quartz.config.ts to customize your site:

pageTitle: "Your Site Name",
baseUrl: "yourdomain.com",

Create a starter page in content/index.md:

---
title: Welcome
---
 
# Welcome to My Digital Garden
 
Start writing your content here!

4. Build Your Site

npx quartz build

This generates static HTML files in the public/ directory.

Part 2: Web Server Configuration

1. Install and Configure Nginx

sudo apt install -y nginx

Create an Nginx configuration file at /etc/nginx/sites-available/yourdomain.com:

server {
    listen 80;
    server_name yourdomain.com www.yourdomain.com;
 
    root /home/youruser/workbus/public;
    index index.html;
 
    location / {
        try_files $uri $uri.html $uri/ =404;
    }
}

Enable the site:

sudo ln -s /etc/nginx/sites-available/yourdomain.com /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl restart nginx

2. Set Up SSL with Certbot

sudo apt install -y certbot python3-certbot-nginx
sudo certbot --nginx -d yourdomain.com -d www.yourdomain.com

Certbot will automatically configure HTTPS and set up auto-renewal.

Important: Fix directory permissions so Nginx can access your files:

chmod 755 /home/youruser

Part 3: GitHub Integration

1. Create a GitHub Repository

  • Go to github.com/new
  • Create a private repository (e.g., myblog)
  • Don’t add README or .gitignore

2. Connect Your Server to GitHub

cd ~/workbus
git init
git remote add origin https://github.com/username/myblog.git
git config user.name "Your Name"
git config user.email "your@email.com"
git add -A
git commit -m "Initial commit"
git branch -M main
git push -u origin main

You’ll need a GitHub Personal Access Token (create at github.com/settings/tokens) instead of your password.

Part 4: Obsidian Vault Setup

1. Organize Your Local Vault

Move your Obsidian vault to a local directory (not iCloud):

cp -R "/path/to/vault" ~/Documents/myblog

Open Obsidian and add this new location as a vault.

2. Clone the Repository

cd ~/Documents/myblog
git init
git remote add origin https://github.com/username/myblog.git
git config user.name "Your Name"
git config user.email "your@email.com"
git pull origin main --allow-unrelated-histories

3. Organize Content

Move your markdown files into a content/ folder:

mkdir -p content
mv *.md content/
git add .
git commit -m "Move content to content folder"
git push origin main

Part 5: Automation

1. Create a Sync Script (Local)

Create ~/Documents/myblog/sync.sh:

#!/bin/bash
cd ~/Documents/myblog
 
if [[ -z $(git status -s) ]]; then
    echo "No changes to sync."
    exit 0
fi
 
git add .
git commit -m "Update notes - $(date '+%Y-%m-%d %H:%M')"
git push origin main
echo "✓ Synced successfully!"

Make it executable:

chmod +x ~/Documents/myblog/sync.sh

2. Server Auto-Update Script

Create /home/youruser/workbus/update-blog.sh:

#!/bin/bash
cd /home/youruser/workbus
 
git fetch origin main
LOCAL=$(git rev-parse HEAD)
REMOTE=$(git rev-parse origin/main)
 
if [ $LOCAL != $REMOTE ]; then
    echo "$(date): New changes detected, updating..."
    git pull origin main
    npx quartz build
    echo "$(date): Blog updated successfully!"
fi

Make it executable and add a cron job:

chmod +x ~/workbus/update-blog.sh
crontab -e

Add this line to check for updates every 5 minutes:

*/5 * * * * /home/youruser/workbus/update-blog.sh >> /home/youruser/workbus/update.log 2>&1

Your Workflow

Now publishing is simple:

  1. Write or edit notes in Obsidian
  2. Run your sync script: ~/Documents/myblog/sync.sh
  3. Wait 5 minutes for auto-deployment
  4. Your changes appear live on your website

Customization Tips

Themes

Install community themes from quartz-themes:

cd ~/workbus
curl -s -S -o action.sh https://raw.githubusercontent.com/saberzero1/quartz-themes/master/action.sh
chmod +x action.sh
./action.sh tokyo-night
npx quartz build

Replace the text title with a logo by modifying quartz/components/PageTitle.tsx.

Dark Mode Default

Edit quartz.layout.ts and set:

Component.Darkmode({ defaultMode: "dark" })

Conclusion

You now have a professional publishing system that combines Obsidian’s writing experience with Quartz’s beautiful output. Your personal knowledge base is version-controlled, automatically backed up to GitHub, and publishes seamlessly to the web.

The beauty of this setup is that it grows with you. Start with simple notes, add themes as you explore, customize components when you need them. Your digital garden is ready to cultivate.

Happy writing!

Graph View

Backlinks