Course Code Setup

[00:00:00]
>> All right, so first and foremost, what we're gonna do is we're gonna clone this project. And so the way that we're gonna clone this project, I'm gonna use the GitHub CLI. I love the GitHub CLI, I'm a huge fan. So, I'm gonna start by using, let's see I'm using what version 1.2.1 of the the GitHub CLI.

[00:00:20]
if you've never used it, it's at Cli.github.com and this thing is incredibly powerful. You don't have to use it. You can absolutely do everything that we're doing today without the GitHub CLI. I've just found that It cuts out a lot of steps. It removes the need to jump through the GitHub CLI and click a bunch of buttons and copy paste things around so we can go real fast.

[00:00:43]
And so what we're going to do today is we're going to fork jlengstorf/ frontend masters- intro-to-gatsby-project. So this is what I want you to run. Now, I've already built this project, so I'm not actually gonna fork, but I want you to fork it because you're gonna wanna deploy this later on, and you need to own the repo to deploy it.

[00:01:12]
That's me for getting how this works. It's gonna be GitHub repo fork. So the command you're gonna run is actually repo fork like this. And I'm gonna run clone. Okay, so once we're in sups, intro the gatsby project. Inside there's not a lot here. So let's open this up, in VS code.

[00:01:45]
And we can take a look at what's in this file. So all that we have in here right now and let's just make sure. We're running on node 16.6.1 today. If you don't have node 16, it's okay. We're using that for this project. I think Gatsby requires node 14, it might be node 12.

[00:02:08]
If you have Nvm whoops, you can just do like nvm use 16 or nvm install 16 to get the latest version. And I've installed you can see here there's an NVMRC. So if you're in this folder and you just write nvm use, it's going to grab that NVMRC, and install it and enable that one.

[00:02:33]
We've got a package read me. That's just a couple notes. The package json, as you can see here it's got the standard things you would expect the name version. A private, so that we don't accidentally publish this as an NPM package, because it doesn't make sense to do with a Gatsby site.

[00:02:51]
Description, author keywords, you can edit those if you want. And then, we have our dependencies down here. So, at its bare minimum Gatsby relies on Gatsby react, and react DOM. We're gonna be using react 17. These are the latest versions. And this is like what's at the core of a Gatsby site, then we get some scripts.

[00:03:12]
These scripts are just lined up with the gatsby CI commands. So develop is what we're going to use most of the time. That's the the kind of a core. As you're building a Gatsby site, you end up running NPM run developer NPM run start. When we're ready to build, we can build the site If we want to test our built site, we can serve it.

[00:03:32]
And if something goes weird and it doesn't feel right, we can run clean, and that'll delete the cache and public files that are degenerated files from Gatsby. You should rarely need to do this. Cleaning is not a common thing.
>> Is graph qL supposed to be a dependency?

[00:03:51]
>> No graph qL is not supposed to be a dependency because it is built into Gatsby which is a choice. It's great until it's not this is again one of those things where if you find yourself working against the nature of Gatsby and you're installing a different version of graph qL.

[00:04:10]
And you're trying to manage a bunch of stuff, it can get a little tricky. But Gatsby bundles all of that for you so that you don't have to install. A whole bunch of stuff. It specifically doesn't include react and react dom inside of gatsby, because that would be chaos.

[00:04:25]
The whole react ecosystem relies on react and react dom not being bundled. So this is Why these ones are external and graph qL and everything else is inside of Gatsby. In addition to that, we've got our lock file. We all know, a lock file is just a way for NPM to keep track of what versions are installed.

[00:04:47]
We've got a prettier RC. This is mostly just so that you don't get unexpected formatting changes if you start editing this repo. I don't care about your code formatting preferences. So if you want to edit this to be your way, feel free, it's mostly just so that you don't get surprised code changes.

[00:05:04]
We looked at the NVMRC. Get ignore is just getting rid of node modules which we don't wanna track and get dot cash is a Gatsby internal folder. You don't need to look in this folder but Gatsby will generate it as part of the develop and build processes to it will put temporary files in there.

[00:05:26]
It'll keep versions of images and different optimizations that it does will live in that cache folder. And then all of that intermediate stuff gets finalised and put into public. And again, this is a generated folder, which is why we don't want to track it in Git. And then this is a helper that if we're using natla phi stuff, so we'll leave that one in there.

[00:05:45]
And then finally, the only source code we have in here is actually images. So these images, I didn't want you all to have to go and find images. So we're just gonna make these available from the get go and we will work with these a little bit later in the project.

[00:06:00]
So, at this point I hope everybody has their fork of the repo ready. If you don't know how to fork or don't have the CLI, you can also just fork right here. Just click this button and you will fork the repo.