├── .gitignore
├── .prettierrc
├── LICENSE
├── README.md
├── gatsby-browser.js
├── gatsby-config.js
├── gatsby-node.js
├── gatsby-ssr.js
├── package.json
├── src
├── components
│ ├── header.js
│ ├── layout.css
│ └── layout.js
├── images
│ ├── gatsby-icon.png
│ ├── one.jpg
│ ├── three.jpg
│ └── two.jpg
└── pages
│ ├── 404.js
│ ├── index.js
│ └── page-2.js
└── yarn.lock
/.gitignore:
--------------------------------------------------------------------------------
1 | # Project dependencies
2 | .cache
3 | node_modules
4 | yarn-error.log
5 |
6 | # Build directory
7 | /public
8 | .DS_Store
9 |
--------------------------------------------------------------------------------
/.prettierrc:
--------------------------------------------------------------------------------
1 | {
2 | "semi": false,
3 | "singleQuote": true,
4 | "trailingComma": "es5"
5 | }
6 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | The MIT License (MIT)
2 |
3 | Copyright (c) 2015 gatsbyjs
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
23 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 |
9 |
10 | Kick off your project with this default boilerplate. This barebones starter ships with the main Gatsby configuration files you might need.
11 |
12 | _Have another more specific idea? You may want to check out our vibrant collection of [official and community-created starters](https://next.gatsbyjs.org/docs/gatsby-starters/)._
13 |
14 | ## 🚀 Quick start
15 |
16 | 1. **Install the Gatsby CLI.**
17 |
18 | The Gatsby CLI helps you create new sites using Gatsby starters (like this one!)
19 |
20 | ```sh
21 | # install the Gatsby CLI globally
22 | npm install -g gatsby-cli
23 | ```
24 |
25 | 2. **Create a Gatsby site.**
26 |
27 | Use the Gatsby CLI to create a new site, specifying the default starter.
28 |
29 | ```sh
30 | # create a new Gatsby site using the default starter
31 | gatsby new my-default-starter
32 | ```
33 |
34 | 3. **Start developing.**
35 |
36 | Navigate into your new site’s directory and start it up.
37 |
38 | ```sh
39 | cd my-default-starter/
40 | gatsby develop
41 | ```
42 |
43 | 4. **Open the source code and start editing!**
44 |
45 | Your site is now running at `http://localhost:8000`!
46 |
47 | *Note: You'll also see a second link: `http://localhost:8000___graphql`. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the [Gatsby tutorial](https://next.gatsbyjs.org/tutorial/part-five/#introducing-graphiql).*
48 |
49 | Open the the `my-default-starter` directory in your code editor of choice and edit `src/pages/index.js`. Save your changes and the browser will update in real time!
50 |
51 | ## 🧐 What's inside?
52 |
53 | A quick look at the top-level files and directories you'll see in a Gatsby project.
54 |
55 | .
56 | ├── node_modules
57 | ├── src
58 | ├── .gitignore
59 | ├── .prettierrc
60 | ├── gatsby-browser.js
61 | ├── gatsby-config.js
62 | ├── gatsby-node.js
63 | ├── gatsby-ssr.js
64 | ├── LICENSE
65 | ├── package-lock.json
66 | ├── package.json
67 | ├── README.md
68 | └── yarn.lock
69 |
70 | 1. **`/node_modules`**: The directory where all of the modules of code that your project depends on (npm packages) are automatically installed.
71 |
72 | 2. **`/src`**: This directory will contain all of the code related to what you will see on the front-end of your site (what you see in the browser), like your site header, or a page template. “Src” is a convention for “source code”.
73 |
74 | 3. **`.gitignore`**: This file tells git which files it should not track / not maintain a version history for.
75 |
76 | 4. **`.prettierrc`**: This is a configuration file for a tool called [Prettier](https://prettier.io/), which is a tool to help keep the formatting of your code consistent.
77 |
78 | 5. **`gatsby-browser.js`**: This file is where Gatsby expects to find any usage of the [Gatsby browser APIs](https://next.gatsbyjs.org/docs/browser-apis/) (if any). These allow customization/extension of default Gatsby settings affecting the browser.
79 |
80 | 6. **`gatsby-config.js`**: This is the main configuration file for a Gatsby site. This is where you can specify information about your site (metadata) like the site title and description, which Gatsby plugins you’d like to include, etc. (Check out the [config docs](https://next.gatsbyjs.org/docs/gatsby-config/) for more detail).
81 |
82 | 7. **`gatsby-node.js`**: This file is where Gatsby expects to find any usage of the [Gatsby node APIs](https://next.gatsbyjs.org/docs/node-apis/) (if any). These allow customization/extension of default Gatsby settings affecting pieces of the site build process.
83 |
84 | 8. **`gatsby-ssr.js`**: This file is where Gatsby expects to find any usage of the [Gatsby server-side rendering APIs](https://next.gatsbyjs.org/docs/ssr-apis/) (if any). These allow customization of default Gatsby settings affecting server-side rendering.
85 |
86 | 9. **`LICENSE`**: Gatsby is licensed under the MIT license.
87 |
88 | 10. **`package-lock.json`** (See `package.json` below, first). This is an automatically generated file based on the exact versions of your npm dependencies that were installed for your project. (You won’t change this file directly).
89 |
90 | 11. **`package.json`**: A manifest file for Node.js projects, which includes things like metadata (the project’s name, author, etc). This manifest is how npm knows which packages to install for your project.
91 |
92 | 12. **`README.md`**: A text file containing useful reference information about your project.
93 |
94 | 13. **`yarn.lock`**: [Yarn](https://yarnpkg.com/) is a package manager alternative to npm. You can use either yarn or npm, though all of the Gatsby docs reference npm. This file serves essentially the same purpose as `package-lock.json`, just for a different package management system.
95 |
96 | ## 🎓 Learning Gatsby
97 |
98 | Looking for more guidance? Full documentation for Gatsby lives [on the website](https://next.gatsbyjs.org/). Here are some places to start:
99 |
100 | - **For most developers, we recommend starting with our [in-depth tutorial for creating a site with Gatsby](https://next.gatsbyjs.org/tutorial/).** It starts with zero assumptions about your level of ability and walks through every step of the process.
101 |
102 | - **To dive straight into code samples head [to our documentation](https://next.gatsbyjs.org/docs/).** In particular, check out the “Guides”, API reference, and “Advanced Tutorials” sections in the sidebar.
103 |
104 | ## 💫 Deploy
105 |
106 | [](https://app.netlify.com/start/deploy?repository=https://github.com/gatsbyjs/gatsby-starter-default)
107 |
--------------------------------------------------------------------------------
/gatsby-browser.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Implement Gatsby's Browser APIs in this file.
3 | *
4 | * See: https://www.gatsbyjs.org/docs/browser-apis/
5 | */
6 |
7 | // You can delete this file if you're not using it
8 |
--------------------------------------------------------------------------------
/gatsby-config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | siteMetadata: {
3 | title: 'Gatsby Default Starter',
4 | },
5 | plugins: [
6 | {
7 | resolve: `gatsby-source-filesystem`,
8 | options: {
9 | path: `${__dirname}/src/images`,
10 | name: 'images',
11 | },
12 | },
13 | 'gatsby-transformer-sharp',
14 | 'gatsby-plugin-sharp',
15 | 'gatsby-plugin-react-helmet',
16 | {
17 | resolve: `gatsby-plugin-manifest`,
18 | options: {
19 | name: 'gatsby-starter-default',
20 | short_name: 'starter',
21 | start_url: '/',
22 | background_color: '#663399',
23 | theme_color: '#663399',
24 | display: 'minimal-ui',
25 | icon: 'src/images/gatsby-icon.png', // This path is relative to the root of the site.
26 | },
27 | },
28 | 'gatsby-plugin-offline',
29 | ],
30 | }
31 |
--------------------------------------------------------------------------------
/gatsby-node.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Implement Gatsby's Node APIs in this file.
3 | *
4 | * See: https://www.gatsbyjs.org/docs/node-apis/
5 | */
6 |
7 | // You can delete this file if you're not using it
8 |
--------------------------------------------------------------------------------
/gatsby-ssr.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Implement Gatsby's SSR (Server Side Rendering) APIs in this file.
3 | *
4 | * See: https://www.gatsbyjs.org/docs/ssr-apis/
5 | */
6 |
7 | // You can delete this file if you're not using it
8 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "gatsby-starter-default",
3 | "description": "Gatsby default starter",
4 | "version": "1.0.0",
5 | "author": "Kyle Mathews ",
6 | "dependencies": {
7 | "gatsby": "^2.0.0",
8 | "gatsby-image": "^2.0.6",
9 | "gatsby-plugin-manifest": "^2.0.2",
10 | "gatsby-plugin-offline": "^2.0.5",
11 | "gatsby-plugin-react-helmet": "^3.0.0",
12 | "gatsby-plugin-sharp": "^2.0.5",
13 | "gatsby-source-filesystem": "^2.0.1",
14 | "gatsby-transformer-sharp": "^2.1.1",
15 | "react": "^16.5.1",
16 | "react-dom": "^16.5.1",
17 | "react-helmet": "^5.2.0"
18 | },
19 | "keywords": [
20 | "gatsby"
21 | ],
22 | "license": "MIT",
23 | "scripts": {
24 | "build": "gatsby build",
25 | "develop": "gatsby develop",
26 | "format": "prettier --write '**/*.js'",
27 | "test": "echo \"Error: no test specified\" && exit 1"
28 | },
29 | "devDependencies": {
30 | "prettier": "^1.14.2"
31 | },
32 | "repository": {
33 | "type": "git",
34 | "url": "https://github.com/gatsbyjs/gatsby-starter-default"
35 | }
36 | }
37 |
--------------------------------------------------------------------------------
/src/components/header.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Link } from 'gatsby'
3 |
4 | const Header = ({ siteTitle }) => (
5 |
4 |
5 |