Gatsby Starter Dom is an open-source Gatsby starter template that builds a simple static blog from markdown and MDX files, with a dark mode UI and out-of-the-box integrations for comments, analytics, and SEO. It is maintained by CH4MD0M on GitHub and is positioned as a "Simple UI Blog Template."
What is Gatsby Starter Dom?
Gatsby Starter Dom is a starter template for Gatsby that generates a static blog site. It takes markdown and MDX files as content inputs and produces a fully built static site with post listing, tag pages, search, and an auto-generated table of contents. The template runs on Gatsby 4, requires Node.js v16 or higher, and is configured through a single blog-config.js file. The project source is hosted at https://github.com/CH4MD0M/gatsby-starter-dom, with a live demo at https://ch4md0m.github.io/gatsby-starter-dom/.
Key Features
- Markdown and MDX support — Write posts in
.mdor.mdxformat and the template renders them as blog pages with code highlighting. - Post search — A search feature lets readers find posts by keyword, with no external search service required.
- Automatic table of contents (TOC) — A TOC is generated from the headings of each post.
- Tag system — Organize posts with tags and provide tag-based filtering.
- Utterances comments — Integrates Utterances, a GitHub-issue-based comment widget, by setting the repository in
blog-config.js. - Google Analytics — Supports Google Analytics by pasting a tracking ID into
blog-config.js. - Auto-generated SEO files — robots.txt, sitemap.xml, and rss.xml are generated automatically for search engine optimization and feed readers.
- Dark mode — A light/dark theme toggle is included.
- KaTeX support — Mathematical formulas written in KaTeX syntax are rendered in posts.
Who should use Gatsby Starter Dom?
- Frontend developers who want to scaffold a personal blog quickly using Gatsby and customize the starter's React components and GraphQL queries.
- Technical writers who publish documentation in markdown and need a clean reading experience with code highlighting, TOC, and tag navigation.
- Korean-speaking developers looking for a blog starter with Korean-language README and writing guide, as the project documentation is primarily in Korean.
What can you do with Gatsby Starter Dom?
- Start a blog in minutes — Run
npx gatsby new my-blog https://github.com/CH4MD0M/gatsby-starter-dom, thenyarn installandyarn startto serve the site at localhost:8000. - Customize the blog metadata — Edit
blog-config.jsto set the site URL, title, description, author name, hero name, social links (email, GitHub, Instagram), Utterances repository, and Google Analytics ID. - Write posts with math and code — Compose content in markdown that includes KaTeX formulas and code snippets, and the template will render them with proper syntax highlighting.
How does Gatsby Starter Dom work?
The template is installed through the Gatsby CLI, which scaffolds a new project from the GitHub repository. After installation, the developer edits blog-config.js to fill in site metadata and third-party credentials. Running yarn start launches a development server at localhost:8000, and a production build can be generated with Gatsby's build command. A separate writing guide is available in the demo site at https://ch4md0m.github.io/gatsby-starter-dom/blog/writing-guide/.
FAQ
What Node.js version does Gatsby Starter Dom require?
Gatsby Starter Dom requires Node.js v16 or higher, and it specifically asks for Gatsby CLI v4 (the README pins v4.7.0). Installing an older Node version may cause the build to fail.
Is Gatsby Starter Dom free?
The template can be downloaded and used for free from GitHub; no paid plan is mentioned in the repository. You can modify the source code to fit your own blog.
What comment system does it use?
It uses Utterances, which stores comments as GitHub issues. You configure the repository in blog-config.js, so you need a public GitHub repository to enable comments.
Does it generate an RSS feed?
Yes, the template automatically generates rss.xml along with robots.txt and sitemap.xml during the build, so readers can subscribe to your blog via RSS.
Can I use it for a non-blog site?
The template is designed specifically as a blog starter, with post listing, tags, and writing guide. While you could repurpose it, the built-in features are all oriented around blogging.
