Gatsby Starter My Blog

🔎 Description

A GatsbyJS starter Blog

See the starter in action » https://sleepy-aryabhata-daee42.netlify.com/

✨ Features

• Gatsby v2
• Netlify CMS for Content Management
• Netlify Deployment Friendly
• Scss and Styled-Components for styling
• Icons from font-awesome
• Algolia for search
• Pagination
• Dark/Light mode
• PrismJS for code highlighting
• Tags for Blog

⚠️ Prerequisites

If you do not have Gatsby Cli installed yet, do it first.

npm install --global gatsby-cli

More information on GatsbyJS.org

🚀 Getting Started

Install the starter using Gatsby Cli gatsby new command.

gatsby new [NEW_SITE_DIRECTORY_FOR_YOUR_BLOG] https://github.com/daniel9a/blog

Setting up Algolia

• Sign up for Algolia.
• Create a .env file and setup these variables. (I recommend a .env.production and .env.development file.) Or you can look at env.production.EXAMPLE for an example.

GATSBY_ALGOLIA_APP_ID=XXX
GATSBY_ALGOLIA_ADMIN_KEY=XXX
GATSBY_ALGOLIA_INDEX_NAME=XXX
GATSBY_ALGOLIA_API_KEY=XXX

• Grab your API keys from Algolia and place them accordingly for the variables
• Pick an tndex name you wish to call it for GATSBY_ALGOLIA_INDEX_NAME (I have mine as Gatsby-Blog)

When deploying to Netlify with Algolia you need to go to your website then Site Settings > Build & Deploy > Environment and add your environment variables here with the same variable name.

Config File

Change the settings in config.js to your liking.

Running Wesbite

Go into the newly created directory and run

gatsby build

then to hot-serve your website on http://localhost:8000

gatsby develop

😎 Contributing

• Fork the repo
• Create your feature branch (git checkout -b feature/fooBar)
• Commit your changes (git commit -am 'Add some fooBar')
• Push to the branch (git push origin feature/fooBar)
• Create a new Pull Request

💫 Deploy