As web developers, we are constantly looking for new technologies that are interesting and helpful in our projects. If you are in the web dev community for enough time you have heard about something called Gatsby.
This article will introduce Gatsby and the reasons you should consider using it while making your next project. However, I am trying to make a series where we will try to make a simple application with Gatsby. So Here we go(in Mario voice).
Gatsby is an open-source static site generator that is based on JAMstack. Confused about what is a static generator and what do you mean by JAMstack, don’t worry about it check out these resources Static Generator and JAMstack. So now will see some of the reasons why is it so famous.-
1. The Speed:
One of the things that always worries a web developer while using new technology is that its effect on performance. Here Gatsby comes into the picture. The websites built using Gatsby are 2-3 times faster than websites of similar types of sites. Do not believe me take a look at some of the real-world examples here. The framework under the hood takes care of performance on its own, providing you with an opportunity to focus on more fun things. If you are interested in how Gatsby does this check this.
2. Uses popular and widely used technology:
Gatsby is based on everyone’s favourite framework React. I don’t think we need to introduce React here, if you have heard about Gatsby then there is a chance that you probably heard about React. Gatsby aims to behave like a regular React application and uses its components which you can reuse and share throughout your project.
Gatsby also uses GraphQL to build its data layer. GraphQL lets you query all necessary data from wherever you want: markdown files, databases, Storyblok, traditional CMSs like Drupal, and so on. If you are anything like me and never tried GraphQL before and planning on making regular API calls in components then trust me Gatsby will be a good reason to learn GraphQL. Using GraphQL with Gatsby makes the development easier.
3. Fun learning experience:
One of the hardest things while learning new technology is how much time is required to learn them accurately. However, in Gatsby’s case, it is based on some of the most popular technologies, so you don’t need to learn everything from base. Even if you have never learned technologies like React or GraphQL, Gatsby provides you perfect opportunity to learn and master them. Gatsby also has a well-written tutorial to get you started in no time check it out.
So this was an introduction to Gatsby. I am also learning Gatsby, discovering new things about it every day and so far, I can say that everyone looking to become a good web developer should check out Gatsby.
Top comments (12)
Ok went to list, ran page speed insights...
I have yet to see a gatsby site that isn't just plain text crack a score of higher than 80 / 100.
There are obviously benefits if you find it easy to use and performance isn’t a concern, just saying the marketing of “its fast” really doesn’t seem to ring true and with the core web vitals update it might not be the best idea to use gatsby if you want to rank well naturally.
They've put an insane amount of work into Gatsby towards performance and even then, core web vitals updated and you're hosed lol ... this shows the danger of completely relying on a tool/framework like this, no matter how brilliant it is.
Well their marketing is good (same goes for the writer of this article) but if you see it as the silver bullet and a free lunch then think again.
This article is a joke. Headspace took a solid 6 seconds to load on mobile.
Looks more like some, if not all of these sites are not optimizing their image assets correctly, which is what many times causes the slow down of websites. Gatsby isn't the problem here
I made a pit stop at Gatsby but ultimately end up going Next.js
It is much better and simpler to understand.
Are you sure? Have you tried Nuxt.js, Next.js, Jekyll, and any other similar stuff before going on with the "framework of the future" thing?
If you guys don't like working with React, try Gridsome, which is basically Vue equivalent of Gatsby, with similar APIs. Also, stop reading all the negative comments below. I've tested site generators and they indeed run pretty fast, but you have to make sure that you are optimizing your website assets to be as small as possible and reduce network requests. For some pages that use a lot of SVG icons, I just embed them into the page rather than use img tag.
The memes are brilliant, but "EVERYONE's favourite framework React"? read this: dev.to/jfbrennan/really-why-react-...
Stack overflow 2021 survey has revealed the new favourite insights.stackoverflow.com/survey/...
Nuxtjs and Vue if you want performance.
Gatsby is great work though!
A great article. I think web developers are turning into Gatsby.
:) trash article i think. Nextjs is much better than this.