Up and Running with Gatsby: First Steps

Basic Project Structure

Let's open our new project and see what's inside.

In this video, we check out the basic structure of our new Gatsby project.

We find there's a src folder that contains a pages folder with index.js. This folder is "magic" — Gatsby will turn any React component in the pages folder into its own route.

We also find a static folder where we can add assets that we want handled outside of the Gatsby build process.

There's also a file called gatsby-config.js. This file is empty at the moment, but is where we'll configure our Gatsby site with plugins and other metadata.

Lastly, we take a look at package.json. In package.json, we find there are some built-in scripts like gatsby serve and gatsby develop. We'll explore gatsby develop in the next video.