This course has been updated! We now recommend you take the Introduction to Gatsby, v2 course.
Transcript from the "Gatsby Overview" Lesson
[00:00:00]
>> Jason Lengstorf: But before we can talk about what Gatsby is, we need to understand the problems that Gatsby is solving. So let's look at the challenges of modern web development. And modern web development is such a powerful thing, but it comes with this just kind of big knot of challenges.
[00:00:16] And three of them, if we were to put them into their big buckets, one is just that getting started is overwhelming. There are dozens or hundreds of tools for for doing just frontend development. And that can mean that when you get started, it's hard to decide what you should use.
[00:00:30] It's hard to figure out how all these pieces fit together. It's hard to get it customized to do the thing that you want. You sometimes feel like, I wanna write some code. But ultimately, what you end up doing is spending hours reading documentation for various projects just to get something up and running in the browser.
[00:00:48]
>> Jason Lengstorf: The way that we manage our data is also evolving. We are no longer using just monolithic CMSs, where the database, the content management part, the UI, and everything is handled through one monolithic code base. That's starting to break apart, and we're starting to see different strategies for this, and so we need to be able to address that in our code.
[00:01:07] And third, getting it right is just really hard. You can make an entire career out of multiple subsections. You can become a DevOps specialist, and spend your whole career just launching, and scaling, and deploying sites. You can become a performance expert or UX expert. And each of those things, it's deep enough that you could spend your entire career learning and improving in that area, and you'd probably still never hit the bottom of that.
[00:01:30] You'd probably still never learn everything there is to know. So if we're gonna build these great experiences, and we have to do all of that, we have to make a great UX, we have to get it up and performant, we have to get it deployed and scaled. It's just really hard to get all of that right, as one person or as a small team, and so we need to address that.
[00:01:50] And so Gatsby is designed to try to address these problems. And so the first way that we do that is Gatsby is designed to be a shortcut. We wanna allow developers to quickly build excellent apps and sites, and we do that by helping to eliminate boilerplate. Boilerplate is really common in modern JavaScript, in modern apps in general, where you want to just build something.
[00:02:15] I wanna open up the browser and type hello world and see it show up. But it ends up being a huge amount of setup to make this work. And so let's do this, let's see how we can get from our console, we wanna open something up, open a code editor, write something, and then show it in the browser.
[00:02:33] So I do that, I'm like, great, this is gonna be so much fun. But then I need Webpack. Okay, why do I need Webpack? Well, I need the JavaScript to be bundled in a way that can be used on the page, okay. All right, but then I wanna use ES15, so I need Babel.
[00:02:45] Okay, so then I need to do CSS, and I wanna make sure that that's optimized properly, and has all the polyfills and the proprietary property names. Okay, so now I've got PostCSS in here, and then I need to get it on a server, so I'm now dealing with Node.js.
[00:03:02] And then when I get that Node server stood up, I have to post that somewhere. So now I'm looking at a container, or Kubernetes or Docker, or I'm trying to get it in somewhere, all right. So then I need to route this somehow, so now I'm installing Nginex to make sure that it's pointing to my app when somebody hits my domain.
[00:03:23] And the assets are just chewing through my bandwidth, so now I gotta install a CDN. And suddenly, I haven't even written any code yet. This is just the stuff that I have to do to get the site up and running in my browser, and then out onto the Internet, and that's a lot of stuff.
[00:03:40] So Gatsby's removing the boilerplate for getting started and deploying. We want you to be able to, very quickly, just open the browser and start seeing the stuff that you're typing, no boilerplate, no nonsense. And so it looks a little bit like this. You have your code editor, you install Gatsby, and then you just build a site.
[00:03:59] You don't have to worry about Webpack or Babel, or any of this boilerplate. You just get to write some code, and you see it in the browser. A library loads as you develop, and when you're ready, you just deploy it to Netlify. And the great thing about this is that to use Gatsby, there's very little to learn that you wouldn't already know if you were working with React and GraphQL.
[00:04:18] Because under the hood, Gatsby's just using React and GraphQL. So you get to work with languages that you already know that will transfer from other jobs or other frameworks. If you're working in React or if you're working with a GraphQL code base, those skills are gonna transfer. You don't have to relearn a new language to use Gatsby, you just get to use React.
[00:04:40] And then when you deploy it in Netlify, Netlify just watches your GitHub branches. And when you push to that GitHub branch, it's like, okay, cool, I'll put that on the Internet for you. And you don't have to worry about deployment. Because Gatsby's deploying as static assets, you also don't have to worry about server scaling.
[00:04:54] You don't have to worry about database charting. You don't have to worry about making things synchronize, or eventually consistent, or all these words that are terrifying when you start thinking about scaling production apps. Instead, you just say, here's a bucket of static files, I'm gonna put this on a CDN.
[00:05:10] CDNs are designed to geographically distribute that stuff. And because it's static, you don't have to worry about database access, you don't have to worry about the server going down. You don't have to worry about DDoS. I mean, it takes quite a bit to DDoS a CDN, right? So your site is going to be resilient, and you don't have to think about it.
[00:05:28] You just say, Netlify, please host my site. And it says, gotcha, continue about your day, don't worry about this anymore.