[Free Blog Creation] I tried hosting a static site with Obsidian and GitHub Pages!

Fujiwara Takumi — Tue, 03 Jun 2025 23:13:02 +0000

Preface

This is the website I created. *It is still under construction.
https://takumifujiwaradairy.github.io/my_public_notes/

In this article, I would like to introduce how to publish a static website for free using Obsidian and GitHub Pages.
Obsidian also offers a public feature, but it costs $96 per year, which is about 14,000 yen, so in this article, I will show you how to publish a website for free using GitHub Pages!

In this article, I will omit detailed explanations of Obsidian and GitHub Pages.

For this project, I am using Quartz4 as the static site framework for publishing Obsidian!
The reason is simply because the UI looks cool!

Step 1. Fork Quartz4 into your own repository!

https://github.com/jackyzha0/quartz

Fork it into your own repository. Note that GitHub Pages cannot be used for free unless it is a public repository!

Step 2. Clone it locally and add articles.

Clone your repository locally.

$ git clone https://github.com/user-name/obsidian-quartz.git

Add Markdown files under the content directory.

/content/index.md will be the homepage.

npx quartz build  
rm -rf docs && mv public docs  
git add -A  
git commit -m “rebuild site with index.html”
git push origin main

Running these commands will automatically complete the setup.

Step 3. Set up GitHub Pages

Set it up so it looks like the screenshot, and you're good to go!

That's a quick overview of the deployment process.
There are still more settings to configure, so I'll cover those in another article if I get around to it.

DEV Community: Fujiwara Takumi

[Free Blog Creation] I tried hosting a static site with Obsidian and GitHub Pages!

Preface

Step 1. Fork Quartz4 into your own repository!

Step 2. Clone it locally and add articles.

Step 3. Set up GitHub Pages