How I got started with GatsbyJS and why you should too
To all the other self-taught devs out there that are thinking of one day becoming a freelancer but not want to use WordPress anymore, this is the article that I wish I would have had back then! With that in mind, let's get started with my beginnings: "Going Through Tutorial Hell"
Table Of Contents
Going Through Tutorial Hell
Like many other self-taught devs, I got started using freeCodeCamp before I eventually shifted to Udemy React tutorials. (FCC didn't have the updated curriculum back then with React etc., that it has now). I enjoyed going through the different lessons, seeing stuff appear on the screen with just a few lines of code, and having one "aha" moment after another. However, while going through these different courses and FCC curriculums, I eventually thought to myself: "Well, this is nice and all. But how do I actually go about making a simple lawyer or cafe shop website? Do I make a single-page React app? Or do I write HTML, JS, and CSS files from scratch as I learned at FCC? Nah, that can’t be it... Right?"
I was lost. For more than 6 months I had gone through loads of tutorials and videos, but I felt like if a client would reach out to me, I still wouldn't be able to make a website that not uses WordPress. I didn't know what to do next.
And here is where Gatsby suddenly appeared.
Wordpress vs JAMstack
I remember reading an article with a headline along the lines of "WordPress vs JAMstack", explaining why WordPress is really not efficient whatsoever(!) and that JAMstack is the future. I won't go into details here, but here is an article that gets you up to speed (link).
Long story short. I was hooked. I wanted to get right into it and so first things first, I googled "JAMstack". And suddenly this whole other part of the internet opened up for me. Now I wasn't only learning about the JAMstack but also understanding how a website and its assets get served to the client and more!.
I did some more research and it seemed like I was left with two choices for "my" JAMstack: Gatsby or NextJS.
Both frameworks are based on React, which just made sense since I had just finished another React tutorial.
I opened the official NextJS site and started going through the documentation and let be clear here, I think if I wouldn't have just finished 3 FCC certificates and 2 Udemy courses, I might have even gone for this and the actually very good NextJS "Get Started" tutorial. But I was tired. I just want to write some code on my own without having to read through more documentation.
Gatsby made it easy
And Gatsby just made it easy. I opened up the Gatsby template library (which mostly consists of blogs but w.e.), chose one, typed "git clone" and "npm i && npm run develop" and boom 💥 .
You can poke at the gatsby code and play around with it. Read some error messages and have fun with it. You can even kinda just understand on your own how gatsby-node.js works and with all the different gatsby-plugins out there even use other people's code without feeling bad about it!
('cause sometimes when I do copy somebody else's code, I feel like a little boy dropping some chewing gum into my bag at the cashier, but not paying for it. Is this just me?)
From here I just kept going. Because the Gatsby community is so big, I could go through lots and lots of other people's Gatsby sites and just kinda figure out what worked best for me. Some people like CSS-in-JS, some like to use TailwindCSS, or maybe just use simple SCSS or CSS files. There is a plugin for all of you. Not much thinking required, everything just works. And for a beginner, this was just heaven.
Especially before the Lighthouse v6 update, the performance scores of Gatsby sites were insanely good with little to no effort on my end. This was the first time I thought I had become a web dev. Creating websites with code and not using a page builder in WordPress.
Note here: I still use WordPress now and then just because there is still a big demand in freelancing, but Gatsby overall has become my main driver.
Quick setup with no to little configuration necessary and many tools that just work out of the box.
I know do realize the drawbacks that come with a heavily pre-configured framework like Gatsby, but to get started, this was just right. The entry-level felt lower than it did with NextJS.
Should you get started too?
The quick answer: Yes. Especially,
if you have little to no experience with the JAMstack, still consider yourself a beginner web dev and don't want to go through more "Get Started" documentation from start to finish. The Gatsby Template Library is just so nice and easy to get started with, that especially beginner web devs with some background in React can just create their own first blog and learn stuff "by doing it yourself"(!) Which I guess is something that most devs will love!
On top of it, the Gatsby community is huge and you will find lots of tutorials and StackOverflow answers for questions that might come up throughout your journey.
Gatsby being an open-source project helps with this a lot too.
However, the long answer: It depends.
Depending on your skill level and background you might want to jump just right into NextJS as it seems to be the more promising and "grown-up" framework currently. Last month NextJS 10 got released, fixing a lot of issues, but also bringing lots of new features that I would love to play around with. On top of Gatsby and NextJS, there are also lots of other frameworks that have really caught my eye recently. I want to try out many of them and some seem veeery promising... (I am looking at you Svelte and Sapper 👀)
The JAMstack is constantly changing as static site generators become more and more versatile and the competition is big. The focus has shifted from simply creating static files to supporting different rendering methods and going beyond static.
But if this you, who comes from tutorial hell, following all the recommend React tutorials ('cause React is the current hype...), but you actually want to learn how to create your own portfolio or your first blog, using some of the skills that you learned in the tutorials on your own? Start with Gatsby and the template library. You won't be disappointed.
That’s pretty much it!
Thanks so much for reading this far and if you are still not sure if Gatsby is the right for you, feel free to reach out to me anytime, on my website or on Twitter 🙂
