🍭 My blog built with Gatsby. Neat.

kremalicious.com

Table of Contents

---

🎉 Features

The whole blog is a React-based Single Page App built with Gatsby v2.

EXIF extraction

...

Related Posts

...

🏆 SEO component

Includes a SEO component which automatically switches all required meta tags for search engines, Twitter Cards, and Facebook OpenGraph tags based on the browsed route/page.

If you want to know how, have a look at the respective component under src/components/atoms/SEO.jsx

📈 Matomo (formerly Piwik) analytics tracking

Site sends usage statistics to my own Matomo installation. To make this work in Gatsby, I created and open sourced a plugin, gatsby-plugin-matomo, which is in use on this site.

gatsby-redirect-from

https://github.com/kremalicious/gatsby-redirect-from

💎 Importing SVG assets

All SVG assets under src/images/ will be converted to React components with the help of gatsby-plugin-svgr. Makes use of SVGR so SVG assets can be imported like so:

import { ReactComponent as Logo } from './components/svg/Logo'

<Logo />

🍬 Typekit component

Includes a component for adding the Typekit snippet.

If you want to know how, have a look at the respective component under src/components/atoms/Typekit.jsx

✨ Development

You need to have the following tools installed on your development machine before moving on:

• Node.js
• npm

Then install dependencies and start everything up:

npm i
npm start

🔮 Linting

ESlint, Prettier, and Stylelint are setup for all linting purposes:

npm run lint

To automatically format all code files:

npm run format
npm run format:css

🎈 Add a new project

npm run new -- "Hello"

...

🚚 Deployment

Automatic deployments are triggered upon successful tests & builds on Travis:

• push to master initiates a live deployment
• any Pull Request, and subsequent pushes to it, initiates a beta deployment

The deploy command simply calls the scripts/deploy.sh script, syncing the contents of the public/ folder to S3:

npm run deploy

The deploymeng script can be used locally too, the branch checks are only happening for Travis builds, allowing to deploy any branch from local machine.

🏛 Licenses

The MIT License (MIT)

except for:

Posts

All post content under ./content/posts is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

Photos & images

All photos & image assets under ./content/media, ./src/images, and assets sheet.psd are plain ol' copyright.

Copyright (c) 2008–2018 Matthias Kretschmann

Don't care if you fork & play with it, but you're not allowed to publish anything from it as a whole without my written permission.