Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
src πŸ’© Mar 6, 2018
.gitignore Start from scratch Mar 5, 2018
.nvmrc Add .nvmrc Mar 6, 2018
gatsby-config.js Add react-helmet plugin Mar 6, 2018
gatsby-node.js Sort posts by date Mar 6, 2018
license Update license Mar 6, 2018
package.json 2.0.1 Mar 7, 2018 Update readme Mar 6, 2018
yarn.lock Downgrade to styled-components 2.4.0 Mar 7, 2018

Superstylin' v2 πŸŽ‰

A Gatsby Starter with Style πŸ’…

What is Superstylin'?

Superstylin' is a Gatsby starter that uses styled-components as the main way to style your Gatsby site, it provides an easy to start structure to get you up and running with your first Gatsby-powered site.

About styled-components

Simply put, styled-components is a way to add your css in your js, it works by creating a component and style it, then you'll get a styled-component, it's really simple and very powerful.

Benefits of using styled-components

By using your css in your js you get the power of javascript to add more functionality to the way you declare your styles, but wait, that's not all!

Below are some interesting readings to further discover the benefits of styled-components.

A big thanks to Glen Maddern and Max Stoiber for making styled-components πŸ‘πŸŽ‰.

Also big thanks to Kyle Mathews for starting and maintaining Gatsby πŸ‘πŸŽŠ.

Inline-styles vs CSS in JS

Read this excellent post on why inline-styles !== css-in-js by Max Stoiber.

Features of Superstylin' v2

  • Use css-in-js with the magic of styled-components πŸ’…
  • Uses Gatsby built-in GraphQL to fetch and sort blog posts
  • Easy to customize and to get started with your own Gatsby site
  • Perfect for sites, blogs or both
  • Super simple project structure to get you up and running fast


$ gatsby new my-awesome-site

$ cd my-awesome-site

$ gatsby develop


Licensed under the MIT License, Copyright Β© 2018 Enrique Benitez

See license for more information.