DEV Community

Cover image for Gatsby - Themes and Starters
Sm0ke
Sm0ke

Posted on • Updated on

Gatsby - Themes and Starters

Hello coders,

In this article, I will present a collection with GatsbyJS starters and themes suitable for simple projects: one page websites, markdown / MDX blogs, and simple coming-soon pages.


What is GatsbyJS

GatsbyJS is the most impressive app generator I've seen in the last few years for a few good reasons:

  • modern tooling out of the box.
  • plugins for almost anything
  • all apps built with Gatsby will score more than 90 on Lighthouse
  • usable starters for many types of apps and technologies: one-page, eCommerce, blogs
  • comprehensive docs
  • live support on spectrum & Discord

Get Started with Gatsby

In order to start building apps with Gatsby we need a few sets of tools installed into the working station:

  • Node & Npm
  • Gatsby CLI - the Gatsby console
  • GIT - if we want to clone some starters

The official documentation has a comprehensive section about this initial setup, feel free to access it and follow the instructions applicable for your OS.

# install Gatsby globally 
$ npm install -g gatsby-cli
$
# test the installation
$ gatsby --help
Enter fullscreen mode Exit fullscreen mode

Licensing Info

All starters and themes are released under permissive licenses (MIT or CCY 30) inherited from the design providers. Before using a starter, please read the license file. Thank you!


GatsbyJS Paradigm

A nice GatsbyJS starter that uses a simple design crafted by Html5UP agency.

GatsbyJS Paradigm - Open-Source Gatsby starter.

How to use the starter

$ git clone https://github.com/app-generator/gatsby-html5up-paradigm.git
$ cd gatsby-html5up-paradigm
$ yarn # install modules
$ yarn start # start in development mode
$ yarn deploy # live FTP deployment ( Edit FTP credentials in deploy.js first)
Enter fullscreen mode Exit fullscreen mode

GatsbyJS Fashion

Simple GatsbyJS starter with a creative layout released under the MIT license.

GatsbyJS Fashion - Open-Source Gatsby starter.


GatsbyJS Multiverse

A GatsbyJS starter suitable for photographers and visual projects.

GatsbyJS Multiverse - Open-Source Gatsby starter.

To build this app, type in your terminal

$ git clone https://github.com/app-generator/gatsby-html5up-multiverse.git
$ cd gatsby-html5up-multiverse
$ yarn # install modules
$ yarn start # start in development mode
Enter fullscreen mode Exit fullscreen mode

GatsbyJS Spectral

One-page GatsbyJS web app with a design provided by Html5 Up agency.

GatsbyJS Spectral - Open-Source Gatsby starter.


GatsbyJS Aerial

A simple coming-soon app with a rolling background with a design provided by Html5 Up.

GatsbyJS Aerial - Open-Source Gatsby starter.


GatsbyJS Highlights

An open-source app built with GatsbyJS on top of HTML5Up Highlights design.

GatsbyJS Paradigm - Open-Source Gatsby starter.


Gatsby Resources


Thank you!

Oldest comments (2)

Collapse
 
remotesynth profile image
Brian Rinaldi

Nice post. Another great resource you didn't list is JAMstackThemes.dev. It's not just Gatsby but you can filter exclusively Gatsby themes or access the filtered list via this link jamstackthemes.dev/ssg/gatsby/

Collapse
 
sm0ke profile image
Sm0ke

Hello Brian,
Thanks for the update. I think jamstackthemes project was LIVE after publishing the article here on dev.
Indeed, it's a great JAMstack index. :)