All Projects → thundermiracle → gatsby-simple-blog

thundermiracle / gatsby-simple-blog

Licence: MIT License
an easily configurable gatsby-starter-blog with overreacted looking and tags, breadcrumbs, disqus, i18n, eslint, algolia supported

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects

Projects that are alternatives of or similar to gatsby-simple-blog

Gatsby Starter Delog
A blog for designers and developer, built with Gatsby and Netlfiy CMS. Live demo https://delog-w3layouts.netlify.com/
Stars: ✭ 145 (+202.08%)
Mutual labels:  gatsby, starter, gatsbyjs
gatsby-starter-kit
A set of starters for Gatsby.js
Stars: ✭ 99 (+106.25%)
Mutual labels:  gatsby, starter, gatsbyjs
Gatsby Starter Prismic I18n
Based on gatsby-starter-prismic with Internationalization (i18n) support
Stars: ✭ 77 (+60.42%)
Mutual labels:  i18n, gatsby, gatsbyjs
Gatsby Advanced Starter
A high performance skeleton starter for GatsbyJS that focuses on SEO/Social features/development environment.
Stars: ✭ 1,224 (+2450%)
Mutual labels:  gatsby, disqus, gatsbyjs
gatsby-starter-antoine
My opinionated Gatsby.js starter
Stars: ✭ 17 (-64.58%)
Mutual labels:  eslint, gatsby, gatsbyjs
Gatsby Themes
Get high-quality and customizable Gatsby themes to quickly bootstrap your website! Choose from many professionally created and impressive designs with a wide variety of features and customization options.
Stars: ✭ 1,208 (+2416.67%)
Mutual labels:  eslint, gatsby, gatsbyjs
gatsby-plugin-disqus
💬 A plugin for adding Disqus comments to GatsbyJS
Stars: ✭ 40 (-16.67%)
Mutual labels:  gatsby, disqus, gatsbyjs
gatsby-starter-highlights
Gatsby.js V2 starter template based on highlights by HTML5 UP
Stars: ✭ 15 (-68.75%)
Mutual labels:  gatsby, gatsbyjs
gatsby-attila-theme-ghost
A Gatsby theme plugin for creating blogs from headless Ghost CMS.
Stars: ✭ 16 (-66.67%)
Mutual labels:  gatsby, gatsbyjs
gatsby-source-stripe
Gatsby source plugin for building websites using Stripe as a data source
Stars: ✭ 71 (+47.92%)
Mutual labels:  gatsby, gatsbyjs
gatsby-i18n
Gatsby plugin that provides i18n support
Stars: ✭ 25 (-47.92%)
Mutual labels:  i18n, gatsby
typescript-npm-package-template
Boilerplate to kickstart creating an npm package using TypeScript
Stars: ✭ 122 (+154.17%)
Mutual labels:  eslint, starter
gatsby-starter-typescript
Typescript version of the default Gatsby starter. Uses Gatsby v1.x
Stars: ✭ 58 (+20.83%)
Mutual labels:  gatsby, gatsbyjs
react-hooks-gatsby
Learn how to use React Hooks, and how they work with Gatsby. Watch the livestream:
Stars: ✭ 18 (-62.5%)
Mutual labels:  gatsby, gatsbyjs
guillaumebriday.fr
✏️ 📖 My personal blog built with Gatsby and Tailwind CSS.
Stars: ✭ 27 (-43.75%)
Mutual labels:  algolia, gatsbyjs
gatsby-portfolio
Portfolio / Personal Website - Built with Gatsby.js and Published at konstantin.digital
Stars: ✭ 23 (-52.08%)
Mutual labels:  gatsby, gatsbyjs
gatsby-starter-fractal
Gatsby.js V2 starter template based on Fractal by HTML5 UP
Stars: ✭ 19 (-60.42%)
Mutual labels:  gatsby, gatsbyjs
gatsby-starter-breeze
A Gatsby starter for graceful blogging in Chinese.
Stars: ✭ 44 (-8.33%)
Mutual labels:  gatsby, gatsbyjs
gatsby-plugin-apollo-client
📡Inject a Shopify Apollo Client into the browser.
Stars: ✭ 20 (-58.33%)
Mutual labels:  gatsby, gatsbyjs
gatsby-plugin-prettier-build
prettify gatsby build output
Stars: ✭ 30 (-37.5%)
Mutual labels:  gatsby, gatsbyjs

gatsby-simple-blog

Build Status CircleCI Netlify Status

Description

A gatsbyjs starter forked from gatsby-starter-blog and applied overreacted lookings, with tags and Algolia, pagination, breadcrumbs, eslint, relative posts, disqus, i18n, eslint supported.

This project is migrated to Gatsby@v4

  • check the latest Gatsby@v3 version here.
  • check the latest Gatsby@v2 version here.

Sample pages

Github-Pages

Netlify

Gatsby Cloud

How to use

npm install -g gatsby-cli

gatsby new my-blog-folder https://github.com/thundermiracle/gatsby-simple-blog

How to deploy by Circle-CI in Medium.com

Medium.com -- Deploy Static Sites to Netlify by Circle-CI

How to add search function to a multilingual GatsbyJS site with Algolia

https://thundermiracle.medium.com/how-to-add-search-function-to-a-multilingual-gatsbyjs-site-with-algolia-4ef17af888f3

Configuration

  1. Almost all basic configurable values are here: ./config/index.js

  2. To enable Algolia, create a site in Algolia and copy .env.sample to .env, change all variables to real Algolia ones. You can check the tutorial here:

https://www.gatsbyjs.com/docs/adding-search-with-algolia/#configuring-the-algolia-plugin

i18n

  1. Add [lang].js to config/locales folder

  2. Modify supportedLanguages in config/index.js

  3. Set site.lang in config/index.js as default language

  4. add [filename].[lang].md to content/blog and enjoy!

Features

  • i18n

    Display multiple language. (Only be shown when supportedLanguages > 1)

    i18n

    Display language link in every post. (You can disable it in config/index.js by displayTranslations: false)

    translations

  • overreacted design

    overreacted.io lookings

    top--light

    top--dark

  • Tags

    Display articles in same tag.

    tag

    alltags

  • Algolia

    Search posts in same language by Algolia.

    Algolia-search

  • Breadcrumbs

    Display breadcrumbs in header part.

    post

  • Relative posts

    Display previous and next posts in same tag in footer part.

    relative-posts

  • Disqus

    Use disqus.com to enable comment.

    disqus

  • eslint

    Enable eslint for better coding experience.

  • module resolver

    Enable babel-module-resolver to prevent relative path hell

License

This project is licensed under the terms of the MIT license.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].