Setting up a Gatsby Site Without the `gatsby new` Command
There are many Enterprise level companies that maintain an internal clone of the NPM registry for security purposes. If you work for such a company, you may find that you are able to successfully run
npm install -g gatsby-cli but cannot run the
gatsby new <project-source> as the
gatsby new command clones a repo from a public GitHub repository. Many companies block public GitHub, which will cause the
gatsby new command to fail. Not to worry, though, you can set up a new Gatsby site without the
gatsby new command with a few quick steps.
To get started with Gatsby, you’ll need to make sure you have the following software tools installed:
For step-by-step installation instructions and detailed explanations of the required software, head on over to the Gatsby tutorial.
After your developer environment is set up, you’ll want to set up a new project folder.
mkdir my-new-gatsby-sitecd my-new-gatsby-site
Next, you’ll need to set up NPM within your project.
Fill out the prompts for the
package.json file that is generated. If you’d like to skip that, you can run
npm init -y and a pre-filled
package.json will be generated for you.
Now, you’ll need to install the necessary packages that Gatsby relies on to work its magic.
npm install --save gatsby react react-dom
Next, you’ll add a
src directory and a
pages directory inside your project.
mkdir srccd srcmkdir pages
Inside the pages directory, you’ll make an
index.js file that exports a React component.
cd pagestouch index.js
Now, add some React code to your
index.js file as a starting point for your project.
import React from "react"export default () => <h1>Hello Gatsby!</h1>
Finally, go back to the root of your project and run the
gatsby develop command to start a development server and begin coding.
cd ../../gatsby develop
And that’s it! You should now have your initial page running on
localhost:8000 with a GraphiQL IDE running on
localhost:8000/___graphql. From here, you can follow the rest of the Gatsby tutorial starting with setting up a code editor to get the full experience of what Gatsby can offer.
Edit this page on GitHub