Gatsby Starters & Templates Logo Gatsby Starters & Templates
Gatsby Markdown Blog Starter screenshot

Gatsby Markdown Blog Starter

Author Avatar Theme by Ammarjabakji
Updated: 19 Mar 2020
66 Stars

Gatsby Markdown Blog Starter, demo link:

Github Live Preview

Categories

React Scss Blog

Overview

The Gatsby Markdown Blog Starter is a developed version of the Gatsby Advanced Starter. It provides a minimal base for building advanced GatsbyJS powered Markdown blogs. The starter includes features such as a basic design using the typography-theme-stow-lake theme, support for Gatsby v2, fast loading times, separate components for various sections, configurability for bio section, user social profiles, copyright information, code syntax highlighting, embedded YouTube videos and tweets, support for tags and categories, Google Analytics integration, deployment scripts, social media features, SEO optimization, RSS feeds, support for slow networks, offline support, and more.

Features

  • Gatsby v2 support: Built with the latest version of GatsbyJS.
  • Blazing fast loading times: Pre-rendered HTML and automatic chunk loading of JS files for optimal performance.
  • Separate components for everything: Easy customization and modification of various sections.
  • High configurability: Customizable bio section, user social profiles, and copyright information.
  • Code syntax highlighting: Highlight code blocks for better readability.
  • Embedded YouTube videos: Easily embed YouTube videos in your blog posts.
  • Embedded Tweets: Embed tweets directly into your blog posts.
  • Tags: Categorize your blog posts with tags for easy navigation.
  • Categories: Organize your blog posts based on categories.
  • Google Analytics support: Integration with Google Analytics for tracking website analytics.
  • Deployment scripts: Scripts for easy deployment to GitHub Pages.
  • Social features: Twitter tweet button, Facebook share count, Reddit share count, Google+ share button, LinkedIn share button, Telegram share button.
  • SEO optimization: Generates sitemap, robots.txt, description tags, Schema.org JSONLD (Google Rich Snippets), OpenGraph Tags (Facebook/Google+/Pinterest), and Twitter Tags (Twitter Cards) for better search engine visibility.
  • RSS feeds: Generate RSS feeds for your blog content.
  • Loading progress for slow networks: Provides a loading indicator for slow network connections.
  • Web App Manifest support: Supports Progressive Web Apps (PWA) with Web App Manifest configuration.
  • Offline support: Allows usage of gatsby-image for offline access to static and content folders.
  • Netlify deploy configuration: Configurable for easy deployment to Netlify.
  • CSS Modules / sass support: Supports CSS Modules and Sass for styling.
  • Development tools: Includes ESLint for linting, Prettier for code style, Remark-Lint for linting Markdown, write-good for linting English prose, gh-pages for deploying to GitHub Pages, and CodeClimate configuration file and badge.

Installation

To install the Gatsby Markdown Blog Starter, follow these steps:

  1. Make sure Gatsby is installed and updated.
  2. Run the following command from your command line interface (CLI) to install the starter:
gatsby new my-blog https://github.com/[username]/gatsby-markdown-blog-starter
  1. Alternatively, you can fork the project, make your changes there, and merge new features when needed.
  2. Edit the export object in the data/SiteConfig.js file for any additional configuration.
  3. Make sure to edit the static/robots.txt file to include your domain for the sitemap.

Summary

The Gatsby Markdown Blog Starter is a powerful tool for creating advanced Markdown blogs with the GatsbyJS framework. It provides a wide range of features, including fast loading times, customizable components, social media integration, SEO optimization, deployment scripts, and more. With its easy installation process and extensive feature set, the Gatsby Markdown Blog Starter is a great choice for newcomers to Gatsby or anyone looking to build ultra-fast websites.