Caddy for Quartz

---

Intro §

From the official Quartz Github

Quote

Quartz is a set of tools that helps you publish your digital garden and notes as a website for free. Quartz v4 features a from-the-ground rewrite focusing on end-user extensibility and ease-of-use.

Personally, I love Quartz for its seamless integration with Obsidian, enabling me to craft this blog effortlessly using my favorite note editor.

Prerequisite §

• A static website generated with Quartz (read the Quartz documentation)
• A Caddy instance (check out 01-caddy-in-docker)

---

Host Quartz with Caddy §

Basic Configuration §

To host your Quartz website, execute the command below to generate all static files within the public folder (refer to build documentation for more details):

npx quartz build

Following the execution of this command, a public folder will be generated, containing all the .html necessary files.

On the Caddyfile, add the following configuration:

domain.name {
	root * /path/to/quartz/public
	file_server
}

This will tell Caddy to serve the public folder as a static website.

Caddy and path handling

The debug server in Quartz automatically redirects the path to HTML files. However, this behavior differs in Caddy; if you request /post, it searches for a /post file rather than /post.html.

This configuration is effective only for /index because Caddy automatically searches for HTML index file.

To ensure accurate path handling, incorporate a try_files directive:

domain.name {
	root * /path/to/quartz/public
	try_files {path} {path.html}
	file_server
}

Caddy and errors handling

Similar to path handling, it’s crucial to specify error handling in the Caddy file. This ensures the correct rendering of the 401.html file when a not found error occurs.

To appropriately capture errors, employ a handle_errors and rewrite directive:

domain.name {
	root * /path/to/quartz/public
	try_files {path} {path.html}
	file_server

	handle_errors {
		@404-410 expression `{err.status_code} in [404, 410]`
		handle @404-410 {
			root * /path/to/quartz/public
			rewrite * {err.status_code}.html
			file_server
		}
	}
}

With this configuration, any errors ranging from 401 to 410 will be displayed using the corresponding .html file.

---

Ressources §

• Quartz
  • Quartz Github
  • Quartz Documentation
• Caddy
  • file_server directive
  • try_files directive
  • rewrite directive
• Obsidian
  • Obsidian website
  • Obsidian Git plugin
• Photo by Krystal Ng on Unsplash