Gatsby Starter Bloomer is a minimal Gatsby starter that pairs the Bloomer React component library with the Bulma CSS framework, providing a pre-configured foundation for building static sites.
What is Gatsby Starter Bloomer?
Gatsby Starter Bloomer is a barebones Gatsby starter created by GitHub user zlutfi. It sets up a new Gatsby project with Bloomer, a set of React components that implement Bulma's CSS classes, so you can build responsive interfaces without hand-writing CSS. The starter outputs a static site generated by Gatsby and comes ready with Sass support, Font Awesome icons, a sticky footer layout, and progressive web app features. A live demo is available at gatsby-starter-bloomer-db0aaf.netlify.com, and the repository includes a one-click 'Deploy to Netlify' button for quick hosting.
Key Features
- Sass Ready — The starter is configured with Sass support, so you can write SCSS directly in your Gatsby project from the start.
- Font Awesome Icons — Font Awesome is included, letting you use its icon set in components without additional setup.
- Progressive Web App — PWA functionality is already wired in, giving your site offline support and the ability to be installed on users' devices.
- Sticky footer — A fixed-to-bottom footer layout is part of the starter, keeping your footer visible on pages with little content.
- Bloomer components — Blends React components with Bulma's grid, buttons, forms, and other UI elements, reducing the need for custom CSS.
- One-click Netlify deploy — A deploy button triggers a build and host on Netlify directly from the GitHub repository.
Who is it for?
- Gatsby developers — Use this starter to skip the boilerplate of setting up Gatsby with a CSS framework and components.
- React developers exploring Bulma — See how Bloomer wraps Bulma classes as React components, useful for learning both.
- Freelancers building client sites — The Sass and Font Awesome setup speeds up creating quick marketing or portfolio pages.
What can you do with Gatsby Starter Bloomer?
- Launch a personal site — Combine the sticky footer, PWA support, and Bulma layout to ship a fast, responsive personal site quickly.
- Prototype a business landing page — Assemble hero, pricing, and contact sections using Bloomer components and Font Awesome icons.
- Build a documentation site — Gatsby's file-based routing plus Bulma's readability makes a clean documentation shell possible with minimal CSS.
