gatsby-starter-hoodie is an open-source Gatsby starter created by developer devHudi for building developer-focused tech blogs that render Markdown posts with code highlighting, KaTeX math, and Giscus comments.
What is gatsby-starter-hoodie?
gatsby-starter-hoodie is a Gatsby 5 starter template (migrated to Gatsby 5 on 2023-06-30) that takes Markdown files as content and produces a static blog site with tag and series categorization. It is built to run on Node.js 20 and requires the Gatsby CLI to scaffold a new project. The starter is inspired by the Korean blogging platform velog and includes a live demo hosted on Netlify.
Key Features
- Markdown support — Write posts as Markdown files in the
contents/postsdirectory; the starter renders them with syntax highlighting for multiple programming languages. - KaTeX math syntax — Render LaTeX-style mathematics inline and in display mode inside Markdown.
- Dark mode — Automatically responds to the operating system's color scheme settings.
- Tag and series categorization — Organize articles into tags and multi-part series from front matter or config.
- Giscus comments — Adds GitHub Discussion-based comments by configuring the
giscusblock inblog-config.js. - Responsive web design — Layout adapts to desktop and mobile viewports.
- SEO support — Includes built-in metadata handling for search engines.
- Deployment scripts — Ships with
npm run deploy-ghandnpm run deploy-gh-prefix-pathsfor GitHub Pages deployment, and works with Netlify or any static host vianpm run build.
Who is it for?
- Developers who write technical blog posts — publish tutorials and notes with code blocks and math formulas without building a blog from scratch.
- Open-source maintainers — document projects in a Markdown-driven blog and add Giscus-based GitHub discussions for community feedback.
- Students and researchers — share study notes containing LaTeX math (KaTeX) and code examples with dark mode for late-night reading.
What can you do with it?
- Publish a personal tech blog: create a new Gatsby site with
npx gatsby new my-hoodie-blog https://github.com/devHudi/gatsby-starter-hoodie, then editblog-config.jsfor title, description, author, social links, and Giscus settings. - Deploy to GitHub Pages: run
npm run deploy-ghwhen the repository name isyourname.github.io; otherwise runnpm run deploy-gh-prefix-pathsafter settingpathPrefixingatsby-config.js. - Deploy to Netlify or any static host: connect the repository and it auto-deploys on push, or run
npm run buildand host the/publicoutput directory.
How does it work?
The README walks through seven steps: create a Gatsby site with the starter, start the dev server with npm run start, create a GitHub repository for Giscus, write blog-config.js with blog and comment settings, add Markdown content to contents/posts, deploy, and optionally customize the theme and components in src/assets/theme, src/components, and src/templates.
Pricing
Free — gatsby-starter-hoodie is an open-source GitHub project with no paid tiers or premium features listed in its README.
Alternatives
- gatsby-starter-lumen — another Gatsby starter that appears in the README's Netlify one-click deploy button URL, aimed at minimalist blogs.
FAQ
Does gatsby-starter-hoodie support dark mode?
Yes. Dark mode is a built-in feature that activates automatically based on the operating system's color scheme settings (light or dark), so no manual toggle is required.
What comment system does gatsby-starter-hoodie use?
It uses Giscus, which is a comments widget powered by GitHub Discussions. You must provide your own GitHub repository and configure its repo, repoId, category, and categoryId in the giscus block of blog-config.js.
Which version of Gatsby does it use?
As of 2023-06-30, gatsby-starter-hoodie was migrated to Gatsby 5. The starter also requires Node.js 20 to run.
How do I deploy to GitHub Pages?
Run npm run deploy-gh if your repository is named yourname.github.io. For any other repository name, run npm run deploy-gh-prefix-paths and first set the pathPrefix in gatsby-config.js to your repository name.
Does it support math formulas?
Yes, KaTeX syntax is supported, so you can write and render LaTeX-style math expressions directly in your Markdown posts.
