syauqy / gatsby-hello-world-chakra

A boilerplate with clean Gatsby project and Chakra-UI component

Gatsby Hello World Chakra UI

A boilerplate with a clean Gatsby project and Chakra UI. This starter will help you kick off your Gatsby project with beautiful and simple UI component library quick and simple.

Demo

🚀 Quick start

1. Create a Gatsby site.

   Use the Gatsby CLI to create a new site, specifying the default starter.

   # create a new Gatsby site using the default starter
   gatsby new {your-project-name} https://github.com/syauqy/gatsby-hello-world-chakra

2. Start developing.

   Navigate into your new site’s directory and start it up.

   cd {your-project-name}/
   gatsby develop

3. Open the source code and start editing!

   Your site is now running at http://localhost:8000!

   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.

   Open the {your-project-name} directory in your code editor of choice and edit src/pages/index.js. Save your changes and the browser will update in real time!

🧐 What's inside?

A quick look at the top-level files and directories you'll see in a Gatsby project.

.
├── node_modules
├── src
    ├── components
    ├── images
    ├── pages
    ├── styles
├── .gitignore
├── .prettierrc
├── gatsby-browser.js
├── gatsby-config.js
├── gatsby-node.js
├── gatsby-ssr.js
├── LICENSE
├── package-lock.json
├── package.json
├── README.md
└── yarn.lock

🎓 Docs and references

• Gatsby Documentation.
• Chakra UI Documentation.