5 ms·

Big fan of static site generators and the whole JAMStack idea in general - I use Jekyll extensively - but after building a site with Gatsby, I found it too over

Big fan of static site generators and the whole JAMStack idea in general - I use Jekyll extensively - but after building a site with Gatsby, I found it too over-engineered. React is great, and definitely has its place, but to set up React, GraphQL and all the surrounding tooling just to assemble some text files into a template seems like complexity for the sake of it. For me, the fun of static sites - after years of building sites with CMSs like Wordpress and Drupal - is that they’re as close as possible to plain HTML, lightning-fast and very simple.

nine_k 7y ago
If Gatsby did not feel different and not offered what Jekyll / Hugo / Zola offer, what would be the point? If existing solutions are near perfect for you, you are not the target audience.
- mieseratte 7y ago
  What itch is Gatsby scratching?
  - dunerat 7y ago
    I'm one of the use cases that Sam mentions - B2C website. Replatforming our site with Gatsby, Netlify (hosting and more) and Contentful (headless CMS) has saved us hundreds of dollars a month in hosting - our site which receives 20,000 - 30,000 visitors a month now costs $0 to host. Additionally it is radically faster and more secure than it previously was. Being able to use React as needed has enabled us to manage some relatively complicated form handling/routing, get really creative around how we handle 'sites within the site' for a large sales team that we support, and easily create calculators and other tools for our customers. And bonus - I'm a graphic designer by trade. For one reason or another a web team of 7+ people left my company over the course of 6months and I stepped in to fill the void. Just me, one person who had prior experience building the odd site (maybe one a year) with HTML, CSS. I literally learned javascript and React through Gatsby (I'd say I'm junior developer level at this point - which is actually a good fit for my company). Gatsby is a great product (for many use cases), run by a generous team, surrounded by an equally generous community. I owe my career to Gatsby. My company is saving hundreds of thousands of dollars a year thanks to Gatsby. Stoked to see Gatsby's continued growth and success.
    - ta1234567890 7y ago
      This sounds way too good to be true. Specially considering the stories from other people here, which include a lot more technical detail. Also the other users are not new accounts with just one comment (unlike the user above).
      - BeyondLimits99 7y ago
        To be fair, I think the guy above you might be talking about different use cases. If it's just a static landing page I think the Jamstack/Gatsby/Gridsome would be fine. If it's anything more complex though, you have my condolences. Ecommerce honestly sucks for the reasons others have mentioned. I've almost finished a Shopify build with Nuxt.js and there have been so many hard learnings. The more painful one was storing checkoutIds using SSR and cookies. I still don't know if it's best practice or not :/
      - dunerat 7y ago
        I definitely understand the disbelief, but this is the truth. I started visiting hacker news to try to familiarize myself with the tech world, learn new jargon, blah blah blah, and have always just lurked. I think so highly of Gatsby that I finally created an account just to say so. Like I said, I come from a graphic design background. Mostly freelancing and working for different organizations that just needed an in house guy to do a little bit of everything. Low pay stuff in non-tech organizations - literally a small boutique in one case where I also managed retail workers. I never really got a good career off the ground for many reasons, one of which was probably the "great recession". Not a ton of demand for mediocre graphic designers who aren't very career oriented to begin with. Probably around 4 years ago I got it in my head that maybe I could learn to build websites and either get a side hustle going or work my way into it. I did online courses, videos, etc., but never had the money or guts to jump into a code camp or something more legit, and honestly nothing really stuck. Started a new graphic design gig around 3 years ago. The company was in Real Estate. Like I said - large sales team that really needs their own mini-sites within a site as the service we provide is really driven by their personal brands and relationships. As a designer on a small design team I mostly produced print ads for the sales folks - we were like a mini agency and a way of recruiting top talent. A strong corporate brand / web presence hasn't been necessary to create a successful company of just under 1000 employees, although everyone involves knows that it would only help the business. Pretty shortly into my time there I watched the web team (this includes a project manager, front end developer, ui/ux designer, 3 person SEO/analytics team, a content/data entry person, a middle manager for all of them, and some resources from the IT department) fall apart. That group wasn't really producing much - they refused to even build landing pages, didn't do any kind of SEM, etc. This is for a variety of reasons many of them political. Maybe this entire environment seems a little crazy, but I think this is far more common in many industries than people involved in tech might realize. At some point an agency was brought in to manage the web presence, but they were very obviously neglecting our site. Managers in my department knew I had done some web in the past and used me to run around the agency. The agency kind of knew it, and even had me do stuff on their behalf - I didn't care it beat designing ads for local newsletters, and mailers. A really generous javascript developer at the agency mentioned Gatsby to me once, saying that he wanted to build everything on it, including the next iteration of our website. I could see the writing on the wall, so I decided to learn it thinking(hoping) that I might have to maintain a Gatsby site one day. I think 1.0 had just been released at that point. Not long after, they were fired and I was left holding the ball. The site I inherited was built on wordpress. Because of the neglect it was many versions out of date, and rotting the way wordpress sites can when they aren't maintained. I did what I could to hold it together and doubled down on learning Gatsby and React. When I started replatforming our website it was a lot of false starts, I played with Hugo, headless wordpress in Gatsby, all kinds of schemes - honestly figuring it out as I went along. Eventually stuff started coming together. Each feature I was forced to build (was making an exact duplicate of the wordpress site) forced me to learn more about the toolset that was organically coming together - gatsby (which includes react and graphql), netlify, contentful, mailgun (remember that complicated form routing/logic), and more. I asked the IT dept, what the wordpress instance for our og site was costing us and learned it was $500+ a month. I did everything I could to keep us in Contentful and Netlify free tiers and have done so. We do pay $15/month for a service that does some form routing/templating magic for us - but that's the only cost these days. In the end it took me around 6months to do something that would have taken an agency a month to fulfill. But, I also helped on a lot of random projects (it's amazing what people will let you be a part of when you are eager), and served as webmaster for the first site. During that time leadership at my company wasn't really ready to think about web, so in the end I have provided a great value - a huge cost savings for them over what they were spending and even what they otherwise would be today. I think a lot of people here would cringe to look at my code. It looks like what was written by who it was - someone learning as they went. But, nothing ever breaks, site hasn't been down once since replatforming and moving to netlify, site traffic has increased, we finally pass security audits, page load time went from 8seconds average to somewhere around 1-2 seconds on average. I spin up landing pages regularly, and have plans for meeting unique industry needs in a way that is doable and maintainable by just me. At the end of the day I'm a novice who's making it work on my end mostly by force of will in an industry where a web presence is only just starting to matter. BUT none of it would be doable without Gatsby. Their community, documentation, and product are all amazing. I'm convinced that if my story didn't include Gatsby I wouldn't be provided the opportunities I currently. If you want to be cynical you can interpret all of that as 'guy at shitty company, in shitty industry, where web really doesn't matter, uses Gatsby to make site that just works, and saves a marginal amount of money that definitely had to be spent (hosting costs) and a large amount of money that probably shouldn't have ever been spent (bloated web team and agency that sat on their asses).' from not enough detail to waaaaaaayyyyyyyyyy too much
k__ 7y ago
Yes, Gatsby even seems to be controversal in the React eco-system. Next.js is less opinionated.
grrowl 7y ago
Gatsby was great until Next came along and took its crown
- subpixel 7y ago
  When I pitch my boss on Next.js s/he will ask how confident I am that Zeit is going to remain a profitable concern subsidizing active development for years to come.
deleted 7y ago
[deleted]
guitarnick 7y ago
Another advantage of developing close to plain HTML is that you’re free from the js next-shiny-thing hamster wheel. For example, I had thought Gatsby was the hip way to create static sites in 2019. Then another comment here mentioned it’s Next.js now.
- manigandham 7y ago
  Gatsby and Next.js are both site frameworks powered by React. They can both be used for static and dynamic sites with different conventions and features around routing, data management, and general app architecture. Both are "hip" and will likely remain as the top 2 javascript based site frameworks for now, although whether you need either of them is an entirely different question.
  - graphememes 7y ago
    VuePress / Gridsome are taking over.
    - innocentoldguy 7y ago
      Which, in the JavaScript community, means they’ll be irrelevant in 3, 2, 1.
- k__ 7y ago
  The difference with Next.js and Gatsby seems to be that Next uses well known React idioms and Gatsby does it's own thing.
- frosted-flakes 7y ago
  Next is not a static site generator, as I understand it. It's a framework for React that includes server-side rendering of HTML, among other things.
kilburn 7y ago
TLDR: I just completed a large project built with Gatsby, and wouldn't recommend it to anyone. The technology is extremely complicated, and the end result quite inflexible. Here's an idea of how the whole thing works when you have non-technical users: 1. You need some sort of Content Management System for non-technical users to be able to create content. 2. That CMS stores the content however it sees fit (db/files/whatnot) and provides an API to fetch it. 3. In gatsby, you build "source plugins" that fetch the content and fill it in an in-memory GraphQL sever. 4. Building the site entails fetching all content, feeding it to GraphQL, making a webpack build to run in nodejs, making a webpack build to run on the final site, and finally generating the HTML files. If this doesn't sound so bad, here are some complaints in no particular order: - There are no incremental builds. You must rebuild everything every time you want to publish a change. Our builds currently clock in at ~8min. They've been saying they want incremental builds since 2 years ago. They are "just around the corner" since ~6 months ago. They "already did the hard part" ~4 months ago. They "will offer incremental builds sometime in the future but only in the cloud paid-for version" as of ~1 month ago. - Users hate not being able to immediately see how their content will look like (especially if every time they publish there's a ~10min. delay to actually being able to see it). We had to setup a "preview" environment that is running gatsby in development mode. Gatsby the company just recently started selling this as a paid cloud service (we built it ourselves). - Development mode does not serve html files like production builds do. The site behaves differently in that mode, and some issues only happen in actual builds. When you encounter one such issue, the feedback loop becomes "full build for every change" == ~10min of waiting to try every single change. This is a HUGE productivity killer. - Gatsby generates html files. Then it hydrates that html in the client, using ReactDOM.hydrate. Sounds cool, but the React devs explicitly stated that prerendered content must match exactly what the client-side would render, and if it doesn't your site may completely break and it won't be considered a rehydration bug. Now consider what happens if you try to use a component that changes appearance by doing size detection, or if you have some area that changes between "Hello <user>" or "log in" depending on whether the client is logged in, etc. BTW, these bugs only happen when you test actual builds, not in development mode of course (massive waste of time as per the point above). - Gatsby hijacks NODE_ENV (setting it to "production" for actual builds and "development" for the development mode). This leaks into the many tools involved in the many things that happen while building (babel, webpack and all of their plugins, times two compilations, plus the rendering phase, etc). For instance, I've lost many hours trying to get a full, tree-shaken but unmangled build to no avail. - Gatsby infers GraphQL types from the data you feed into it. It usually works, but when it doesn't it is painful to discover why (your queries return weird results) and fixing it means specifying your data types manually (something you already did once when you defined the database, again to define the models in the CMS, and yet again when you specified the API Gatsby uses to fetch the contents) - Many months ago we went with CSS Modules because Gatsby sold it as a way to get the CSS required for each page inlined in the HTML itself. Fast-forward a bit, people where having issues with specificity (because of ordering) ... and now Gatsby inlines ALL of the site's css in each and every page. Our html's usually have more inlined CSS than actual HTML! I can assure you I'm going the next.js route if I ever have to build a site with similar technology.
snake_case 7y ago
I switched my personal Jekyll site to Gatsby 2 years ago. I ran into some minor bugs and even contributed 3 PRs that got merged. I loved working with it for a few weeks. Two months after switching, it too dawned on me how over-engineered it is. I switched off of it to a custom static site generator I made (admittedly it was also over-engineered), but I'm finally back to a simple static generator called zola [1] and it feels so refreshing. Not only is Gatsby over-engineered, it's also bloated IMO. I think one of their main selling points it that page loads seem instant. Preloading other pages in the background seems needless to me when we're talking about a simple blog. Sure, it might be good for apps, but forcing my (few) visitors to download needless mbs on desktop or mobile seems like a bad user experience to me. [1]: https://github.com/getzola/zola https://github.com/getzola/zola
- ukyrgf 7y ago
  I like the look of Zola, and I bookmarked it when I saw the README pick a bone with Hugo's templating engine. Take a look at the Hugo Discourse forum and I can't imagine less than 99% of the topics are about Go/Hugo templating issues. The Hugo docs basically say "we use Go's template engine, go learn that confusing shit and then we'll tell you 5 different deprecated ways to get today's date if you are enough of a masochist."
dplgk 7y ago
> complexity for the sake of it. It's not for the sake of it. It's so Gatsby didn't have to achieve much beyond wrapping some complicated frameworks to be useful. Basically, about 5 minutes into setting up Gatbsy, you go "Oh, so it's just React and GraphQL. Ok..."

nine_k 7y ago

If Gatsby did not feel different and not offered what Jekyll / Hugo / Zola offer, what would be the point? If existing solutions are near perfect for you, you are not the target audience.

mieseratte 7y ago
What itch is Gatsby scratching?
- dunerat 7y ago
  I'm one of the use cases that Sam mentions - B2C website. Replatforming our site with Gatsby, Netlify (hosting and more) and Contentful (headless CMS) has saved us hundreds of dollars a month in hosting - our site which receives 20,000 - 30,000 visitors a month now costs $0 to host. Additionally it is radically faster and more secure than it previously was. Being able to use React as needed has enabled us to manage some relatively complicated form handling/routing, get really creative around how we handle 'sites within the site' for a large sales team that we support, and easily create calculators and other tools for our customers. And bonus - I'm a graphic designer by trade. For one reason or another a web team of 7+ people left my company over the course of 6months and I stepped in to fill the void. Just me, one person who had prior experience building the odd site (maybe one a year) with HTML, CSS. I literally learned javascript and React through Gatsby (I'd say I'm junior developer level at this point - which is actually a good fit for my company). Gatsby is a great product (for many use cases), run by a generous team, surrounded by an equally generous community. I owe my career to Gatsby. My company is saving hundreds of thousands of dollars a year thanks to Gatsby. Stoked to see Gatsby's continued growth and success.
  - ta1234567890 7y ago
    This sounds way too good to be true. Specially considering the stories from other people here, which include a lot more technical detail. Also the other users are not new accounts with just one comment (unlike the user above).
    - BeyondLimits99 7y ago
      To be fair, I think the guy above you might be talking about different use cases. If it's just a static landing page I think the Jamstack/Gatsby/Gridsome would be fine. If it's anything more complex though, you have my condolences. Ecommerce honestly sucks for the reasons others have mentioned. I've almost finished a Shopify build with Nuxt.js and there have been so many hard learnings. The more painful one was storing checkoutIds using SSR and cookies. I still don't know if it's best practice or not :/
    - dunerat 7y ago
      I definitely understand the disbelief, but this is the truth. I started visiting hacker news to try to familiarize myself with the tech world, learn new jargon, blah blah blah, and have always just lurked. I think so highly of Gatsby that I finally created an account just to say so. Like I said, I come from a graphic design background. Mostly freelancing and working for different organizations that just needed an in house guy to do a little bit of everything. Low pay stuff in non-tech organizations - literally a small boutique in one case where I also managed retail workers. I never really got a good career off the ground for many reasons, one of which was probably the "great recession". Not a ton of demand for mediocre graphic designers who aren't very career oriented to begin with. Probably around 4 years ago I got it in my head that maybe I could learn to build websites and either get a side hustle going or work my way into it. I did online courses, videos, etc., but never had the money or guts to jump into a code camp or something more legit, and honestly nothing really stuck. Started a new graphic design gig around 3 years ago. The company was in Real Estate. Like I said - large sales team that really needs their own mini-sites within a site as the service we provide is really driven by their personal brands and relationships. As a designer on a small design team I mostly produced print ads for the sales folks - we were like a mini agency and a way of recruiting top talent. A strong corporate brand / web presence hasn't been necessary to create a successful company of just under 1000 employees, although everyone involves knows that it would only help the business. Pretty shortly into my time there I watched the web team (this includes a project manager, front end developer, ui/ux designer, 3 person SEO/analytics team, a content/data entry person, a middle manager for all of them, and some resources from the IT department) fall apart. That group wasn't really producing much - they refused to even build landing pages, didn't do any kind of SEM, etc. This is for a variety of reasons many of them political. Maybe this entire environment seems a little crazy, but I think this is far more common in many industries than people involved in tech might realize. At some point an agency was brought in to manage the web presence, but they were very obviously neglecting our site. Managers in my department knew I had done some web in the past and used me to run around the agency. The agency kind of knew it, and even had me do stuff on their behalf - I didn't care it beat designing ads for local newsletters, and mailers. A really generous javascript developer at the agency mentioned Gatsby to me once, saying that he wanted to build everything on it, including the next iteration of our website. I could see the writing on the wall, so I decided to learn it thinking(hoping) that I might have to maintain a Gatsby site one day. I think 1.0 had just been released at that point. Not long after, they were fired and I was left holding the ball. The site I inherited was built on wordpress. Because of the neglect it was many versions out of date, and rotting the way wordpress sites can when they aren't maintained. I did what I could to hold it together and doubled down on learning Gatsby and React. When I started replatforming our website it was a lot of false starts, I played with Hugo, headless wordpress in Gatsby, all kinds of schemes - honestly figuring it out as I went along. Eventually stuff started coming together. Each feature I was forced to build (was making an exact duplicate of the wordpress site) forced me to learn more about the toolset that was organically coming together - gatsby (which includes react and graphql), netlify, contentful, mailgun (remember that complicated form routing/logic), and more. I asked the IT dept, what the wordpress instance for our og site was costing us and learned it was $500+ a month. I did everything I could to keep us in Contentful and Netlify free tiers and have done so. We do pay $15/month for a service that does some form routing/templating magic for us - but that's the only cost these days. In the end it took me around 6months to do something that would have taken an agency a month to fulfill. But, I also helped on a lot of random projects (it's amazing what people will let you be a part of when you are eager), and served as webmaster for the first site. During that time leadership at my company wasn't really ready to think about web, so in the end I have provided a great value - a huge cost savings for them over what they were spending and even what they otherwise would be today. I think a lot of people here would cringe to look at my code. It looks like what was written by who it was - someone learning as they went. But, nothing ever breaks, site hasn't been down once since replatforming and moving to netlify, site traffic has increased, we finally pass security audits, page load time went from 8seconds average to somewhere around 1-2 seconds on average. I spin up landing pages regularly, and have plans for meeting unique industry needs in a way that is doable and maintainable by just me. At the end of the day I'm a novice who's making it work on my end mostly by force of will in an industry where a web presence is only just starting to matter. BUT none of it would be doable without Gatsby. Their community, documentation, and product are all amazing. I'm convinced that if my story didn't include Gatsby I wouldn't be provided the opportunities I currently. If you want to be cynical you can interpret all of that as 'guy at shitty company, in shitty industry, where web really doesn't matter, uses Gatsby to make site that just works, and saves a marginal amount of money that definitely had to be spent (hosting costs) and a large amount of money that probably shouldn't have ever been spent (bloated web team and agency that sat on their asses).' from not enough detail to waaaaaaayyyyyyyyyy too much

k__ 7y ago

Yes, Gatsby even seems to be controversal in the React eco-system. Next.js is less opinionated.

grrowl 7y ago

Gatsby was great until Next came along and took its crown

subpixel 7y ago
When I pitch my boss on Next.js s/he will ask how confident I am that Zeit is going to remain a profitable concern subsidizing active development for years to come.

deleted 7y ago

[deleted]

guitarnick 7y ago

Another advantage of developing close to plain HTML is that you’re free from the js next-shiny-thing hamster wheel. For example, I had thought Gatsby was the hip way to create static sites in 2019. Then another comment here mentioned it’s Next.js now.

manigandham 7y ago
Gatsby and Next.js are both site frameworks powered by React. They can both be used for static and dynamic sites with different conventions and features around routing, data management, and general app architecture. Both are "hip" and will likely remain as the top 2 javascript based site frameworks for now, although whether you need either of them is an entirely different question.
- graphememes 7y ago
  VuePress / Gridsome are taking over.
  - innocentoldguy 7y ago
    Which, in the JavaScript community, means they’ll be irrelevant in 3, 2, 1.
k__ 7y ago
The difference with Next.js and Gatsby seems to be that Next uses well known React idioms and Gatsby does it's own thing.
frosted-flakes 7y ago
Next is not a static site generator, as I understand it. It's a framework for React that includes server-side rendering of HTML, among other things.

kilburn 7y ago

TLDR: I just completed a large project built with Gatsby, and wouldn't recommend it to anyone. The technology is extremely complicated, and the end result quite inflexible. Here's an idea of how the whole thing works when you have non-technical users: 1. You need some sort of Content Management System for non-technical users to be able to create content. 2. That CMS stores the content however it sees fit (db/files/whatnot) and provides an API to fetch it. 3. In gatsby, you build "source plugins" that fetch the content and fill it in an in-memory GraphQL sever. 4. Building the site entails fetching all content, feeding it to GraphQL, making a webpack build to run in nodejs, making a webpack build to run on the final site, and finally generating the HTML files. If this doesn't sound so bad, here are some complaints in no particular order: - There are no incremental builds. You must rebuild everything every time you want to publish a change. Our builds currently clock in at ~8min. They've been saying they want incremental builds since 2 years ago. They are "just around the corner" since ~6 months ago. They "already did the hard part" ~4 months ago. They "will offer incremental builds sometime in the future but only in the cloud paid-for version" as of ~1 month ago. - Users hate not being able to immediately see how their content will look like (especially if every time they publish there's a ~10min. delay to actually being able to see it). We had to setup a "preview" environment that is running gatsby in development mode. Gatsby the company just recently started selling this as a paid cloud service (we built it ourselves). - Development mode does not serve html files like production builds do. The site behaves differently in that mode, and some issues only happen in actual builds. When you encounter one such issue, the feedback loop becomes "full build for every change" == ~10min of waiting to try every single change. This is a HUGE productivity killer. - Gatsby generates html files. Then it hydrates that html in the client, using ReactDOM.hydrate. Sounds cool, but the React devs explicitly stated that prerendered content must match exactly what the client-side would render, and if it doesn't your site may completely break and it won't be considered a rehydration bug. Now consider what happens if you try to use a component that changes appearance by doing size detection, or if you have some area that changes between "Hello <user>" or "log in" depending on whether the client is logged in, etc. BTW, these bugs only happen when you test actual builds, not in development mode of course (massive waste of time as per the point above). - Gatsby hijacks NODE_ENV (setting it to "production" for actual builds and "development" for the development mode). This leaks into the many tools involved in the many things that happen while building (babel, webpack and all of their plugins, times two compilations, plus the rendering phase, etc). For instance, I've lost many hours trying to get a full, tree-shaken but unmangled build to no avail. - Gatsby infers GraphQL types from the data you feed into it. It usually works, but when it doesn't it is painful to discover why (your queries return weird results) and fixing it means specifying your data types manually (something you already did once when you defined the database, again to define the models in the CMS, and yet again when you specified the API Gatsby uses to fetch the contents) - Many months ago we went with CSS Modules because Gatsby sold it as a way to get the CSS required for each page inlined in the HTML itself. Fast-forward a bit, people where having issues with specificity (because of ordering) ... and now Gatsby inlines ALL of the site's css in each and every page. Our html's usually have more inlined CSS than actual HTML! I can assure you I'm going the next.js route if I ever have to build a site with similar technology.

snake_case 7y ago

I switched my personal Jekyll site to Gatsby 2 years ago. I ran into some minor bugs and even contributed 3 PRs that got merged. I loved working with it for a few weeks. Two months after switching, it too dawned on me how over-engineered it is. I switched off of it to a custom static site generator I made (admittedly it was also over-engineered), but I'm finally back to a simple static generator called zola [1] and it feels so refreshing. Not only is Gatsby over-engineered, it's also bloated IMO. I think one of their main selling points it that page loads seem instant. Preloading other pages in the background seems needless to me when we're talking about a simple blog. Sure, it might be good for apps, but forcing my (few) visitors to download needless mbs on desktop or mobile seems like a bad user experience to me. [1]: https://github.com/getzola/zola https://github.com/getzola/zola

ukyrgf 7y ago
I like the look of Zola, and I bookmarked it when I saw the README pick a bone with Hugo's templating engine. Take a look at the Hugo Discourse forum and I can't imagine less than 99% of the topics are about Go/Hugo templating issues. The Hugo docs basically say "we use Go's template engine, go learn that confusing shit and then we'll tell you 5 different deprecated ways to get today's date if you are enough of a masochist."

dplgk 7y ago

> complexity for the sake of it. It's not for the sake of it. It's so Gatsby didn't have to achieve much beyond wrapping some complicated frameworks to be useful. Basically, about 5 minutes into setting up Gatbsy, you go "Oh, so it's just React and GraphQL. Ok..."