Quick Start
July 05, 2020Getting Started π
1. Create a Gatsby site.
# create a new Gatsby site using the blog starter
$ npx gatsby new my-blog-starter https://github.com/JaeYeopHan/gatsby-starter-beeIf you are not using
npx, following Gatsby Getting Started
$ npm install -g gatsby-cli
$ gatsby new my-blog-starter https://github.com/JaeYeopHan/gatsby-starter-bee2. Start developing.
$ cd my-blog-starter/
$ npm start
# open localhost:80003. Add your content
You can write...
- contents to blog in
content/blogdirectory. - resume
content/__aboutdirectory.
With markdown syntax and some meta data
Support script for creating new post

$ npm run post4. Fix meta data
You can fix meta data of blog in /gatsby-meta-config.js file.
5. Publish with netlify
π‘ if you want to deploy github pages, add following script to package.json
"scripts": {
"deploy": "gatsby build && gh-pages -d public -b master -r 'git@github.com:${your github id}/${github page name}.github.io.git'"
}:memo: Write a post!
content
βββ __about
βββ blog- You can register your resume on the web. (in
__aboutdirectory) - You can register your post. (in
blogdirectory)
π§ Customize!
Gatsby config
/root
βββ gatsby-browser.js // font, polyfill, onClientRender ...
βββ gatsby-config.js // Gatsby config
βββ gatsby-meta-config.js // Template meta config
βββ gatsby-node.js // Gatsby Node configStructure
src
βββ components // Just component with styling
βββ layout // home, post layout
βββ pages // routing except post: /(home), /about
βββ styles
β βββ code.scss
β βββ dark-theme.scss
β βββ light-theme.scss
β βββ variables.scss
βββ templates
βββ blog-post.js
βββ home.jsStyle
You can customize color in src/styles directory.
src/styles
βββ code.scss
βββ dark-theme.scss
βββ light-theme.scss
βββ variables.scssWelcome to gatsby-starter-bee! Happy blogging! π»