Chill Dev / Grumpy Dev


September 10, 2018

Sega Genesis box

If you’re asking what that picture is of, it’s of one of the most beautiful gaming consoles to ever grace this planet of ours. I’ll admit, the SNES had better games, but Genesis was my first 16-bit console and I’ll always have a soft spot for it. But fucking anyway…

I’m going to do some more stuff like this ranty post about the process of upgrading webpack 4 that I made over on GitHub. Don’t get me wrong. GH is great. Gists are neat. But I want this to be a separate thing.

Ok, let’s get playing with Gatsby v2. Why? Because I need a fucking blog to post this shit on.

engine9:~ gabe$ yarn global add --verbose gatsby
error css-loader@1.0.0: The engine "node" is incompatible with this module. Expected version ">= 6.9.0 <7.0.0 || >= 8.9.0".
verbose 15.704 Error: Found incompatible module
    at checkOne (/usr/local/lib/node_modules/yarn/lib/cli.js:60055:11)
    at Object.check (/usr/local/lib/node_modules/yarn/lib/cli.js:60061:5)
    at /usr/local/lib/node_modules/yarn/lib/cli.js:22222:73
    at (<anonymous>)
    at step (/usr/local/lib/node_modules/yarn/lib/cli.js:92:30)
    at /usr/local/lib/node_modules/yarn/lib/cli.js:103:13
    at <anonymous>
error Found incompatible module
info Visit for documentation about this command.
engine9:~ gabe$ node --version

Fucking… Ok. Maybe keep your shit up to date, ding dong.

Downloads Node 10

engine9:~ gabe$ node --version

Alright, that’s better. Now on to Gatsby…

engine9:~ gabe$ yarn global add --verbose gatsby
success Installed "gatsby@1.9.277" with binaries:
      - gatsby
✨  Done in 37.97s.
engine9:~ gabe$ 

Wait, what?


Oh, right. Gatsby v2 is still beta. I remember the @next trick from my webpack 4 adventure. Let’s try that.

engine9:~ gabe$ yarn global add --verbose gatsby@next
✨  Done in 30.72s.
engine9:~ gabe$ gatsby --version


Ok. Now, how do I make a blog?

google fu

Ahh… So there are starter builds of Gatsby for specific purposes. I want one I know for sure is going to be supported with v2, so I’ll just take this gatsby-starter-blog v2 off the shelf here.

Side note: I swear, I will never get links right in Markdown. I always do it wrong. I know. It’s simple. It’s alphabetical. Brackets before Parens. Text before URL. Ugh.

engine9:gatsby-v2 gabe$ gatsby new cdgd
info Creating new site from git:
Cloning into 'my-blog'...
remote: Counting objects: 1122, done.
remote: Compressing objects: 100% (4/4), done.
remote: Total 1122 (delta 0), reused 0 (delta 0), pack-reused 1118
Receiving objects: 100% (1122/1122), 2.14 MiB | 8.46 MiB/s, done.
Resolving deltas: 100% (626/626), done.
success Created starter directory layout
info Installing packages...
✨  Done in 40.35s.
engine9:gatsby-v2 gabe$

Cool. Let’s take it for a spin.

engine9:cdgd gabe$ gatsby develop
success open and validate gatsby-config — 0.008 s
success load plugins — 0.251 s
success onPreInit — 1.487 s
success delete html and css files from previous builds — 0.015 s
info One or more of your plugins have changed since the last time you ran Gatsby. As
a precaution, we're deleting your site's cache to ensure there's not any stale
success initialize cache — 0.013 s
success copy gatsby files — 0.071 s
success onPreBootstrap — 0.004 s
success source and transform nodes — 0.072 s
success building schema — 0.354 s
success createPages — 0.052 s
success createPagesStatefully — 0.020 s
success onPreExtractQueries — 0.001 s
success update schema — 0.132 s
success extract queries from components — 0.085 s
success run graphql queries — 0.087 s — 5/5 58.31 queries/second
success write out page data — 0.005 s
success write out redirect data — 0.001 s
⠠ onPostBootstrapdone generating icons for manifest
success onPostBootstrap — 0.306 s

info bootstrap finished - 7.398 s

 DONE  Compiled successfully in 2172ms                                                                                  5:45:33 AM

You can now view gatsby-starter-blog in the browser.


View GraphiQL, an in-browser IDE, to explore your site's data and schema


Note that the development build is not optimized.
To create a production build, use gatsby build

ℹ 「wdm」: 
ℹ 「wdm」: Compiled successfully.

Not bad. Ok. Let’s fuck with some shit. Remove the stock pages. Add a new one. Throw all this bullshit in it.

  1. New github repo
  2. Commit all this crap and push
  3. Sign in to Netlify via Github account
  4. New site from Git
  5. Continuous deployment from Github
  6. Netlify building…
  7. Boom

Hey. Let’s give this turd a name.


What the fuck does that mean you ask?

It’s a play on the name of an awesome rock bar I never got to go to. I don’t know what the fuck the initials of it meant, but CDGD is: Chill Dev, Grumpy Dev. That’s a fair description of me. Probably you too. We’re rolling with it, so too late if you object.

Next time I’ll start fucking around with customizing this blog some more. But for now, that was a super chill experience. Gatsby and Netlify are dope and super easy to use. I love it!

Gabriel Ricard

Stream of consciousness software fuckery.
Assembled by Gabriel Ricard, software developer, runner, dad, dude & occasional grumpy-pants. Bother me on Twitter & GitHub if you feel like it.