gatsby-starter-bootstrap
A Bootstrap 5 starter for Gatsby — fast, accessible, ready to fork.
jaxx2104TypeScript★ 278⑂ 67 forks0BSDupdated 1 week ago
visit the demo
git clone https://github.com/jaxx2104/gatsby-starter-bootstrap.gitjaxx2104/gatsby-starter-bootstrapREADME.mdfork it — it’s yours
Gatstrap
A Bootstrap 5 starter for Gatsby — fast, accessible, and ready to fork.
Features
- Gatsby 5.16+ with React 19 and TypeScript (strict).
- Bootstrap 5.3 via Sass — no jQuery, no popper.
- Markdown blog with Prism syntax highlighting.
gatsby-plugin-imagefor responsive images.- Gatsby
<Head>API for per-page SEO. - Lighthouse mobile 95+ on Performance, Accessibility, Best Practices, SEO.
Quick start
gatsby new my-blog https://github.com/jaxx2104/gatsby-starter-bootstrap cd my-blog pnpm install pnpm develop
Open http://localhost:8000.
Configuration
Edit gatsby-config.ts. The siteMetadata block is the single source of truth
for the navbar title, the per-page SEO <Head>, and the PWA manifest:
const siteMetadata = {
title: 'Your Site',
description: 'Your description.',
siteUrl: 'https://example.com',
author: 'Your Name',
twitter: 'your_handle',
}
Customization
Theme tokens are at src/scss/colors.scss and src/scss/fonts.scss. Override
Bootstrap 5 Sass variables there before the bootstrap import in
src/scss/gatstrap.scss.
To swap the brand color:
// src/scss/colors.scss $purple: #00bcd4;
Writing posts
Add a folder under content/posts/:
content/posts/2026-06-01-my-post/
index.md
hero.jpg
index.md frontmatter:
--- layout: post title: My Post path: /my-post category: Notes tags: [example] description: A one-sentence description. date: 2026-06-01 ---
Scripts
| Command | Description |
|---|---|
pnpm develop |
Start the dev server |
pnpm build |
Production build to public/ |
pnpm typecheck |
Run TypeScript strict mode checks |
pnpm lint |
Run Biome lint |
pnpm lint:fix |
Run Biome check (lint + format) with fixes |
pnpm format |
Run Biome format |
Contributing
- Fork and clone.
pnpm installto install (Node 22).pnpm typecheck,pnpm lint, andpnpm buildmust pass before opening a pull request.- Pre-commit hooks run
lint-stagedautomatically. git pushrunspnpm typecheckvia apre-pushhook. Usegit push --no-verifyto skip during work-in-progress pushes.- SCSS and Markdown files are not formatted by tooling — follow the
.editorconfigsettings (2-space indent, LF line endings, UTF-8).
License
Released under the 0BSD License.
more like this