Gatsby Starters & Templates Logo Gatsby Starters & Templates
Gatsby Starter Foundation screenshot

Gatsby Starter Foundation

Author Avatar Theme by Cherihung
Updated: 12 Feb 2022
5 Stars

gatsby starter using Foundation 6

Github

Categories

React

Overview

The Gatsby Foundation Starter with Foundation is a blog starter that offers advanced features and is built on top of Foundation Sites for Gatsby. This project enhances the Gatsby Foundation Starter by integrating Foundation 6 support. It provides a demo website and offers a range of features to enhance the blogging experience.

Features

  • Blazing fast loading times with pre-rendered HTML and automatic chunk loading of JS files.
  • Separate components for various elements, allowing for high configurability.
  • User information, social profiles, and copyright information can be easily configured.
  • Author segment with name, location, and description.
  • Follow Me button to connect with the author on social media.
  • Posts can be written in Markdown and can include code syntax highlighting.
  • Ability to embed YouTube videos and Tweets within blog posts.
  • Tags and categories for organizing posts, with separate pages for each.
  • Disqus support for managing and displaying comments on blog posts.
  • Notifications about new Disqus comments.
  • Google Analytics support for tracking website traffic.
  • NPM scripts for easy deployment to GitHub Pages.
  • Social sharing features, including Twitter, Facebook, Reddit, Google+, LinkedIn, and Telegram buttons.
  • SEO optimization with sitemap generation, robots.txt, and various meta tags.
  • Loading progress indicator for users on slow networks.
  • Offline support for users to access the website without an internet connection.
  • Web App Manifest support for a native app-like experience.
  • Development tools like ESLint for code linting, Prettier for code styling, Remark-Lint for Markdown linting, and write-good for English prose linting.
  • CodeClimate configuration file and badge for maintaining code quality.

Installation

To install the Gatsby Foundation Starter with Foundation, follow these steps:

  1. Make sure you have Gatsby installed on your machine.
  2. Run the following command in your CLI:
gatsby new my-blog https://github.com/{repository-url}
  1. Edit the export object in the data/SiteConfig file to configure your site’s settings.
  2. Optionally, set the pathPrefix in the same file. Note: Make sure to edit the static/robots.txt file to include your domain for the sitemap.

Summary

The Gatsby Foundation Starter with Foundation combines the power of Gatsby with Foundation Sites to provide a feature-rich blog starter. It offers advanced features like pre-rendering, code syntax highlighting, social sharing, SEO optimization, and more. With easy installation and configuration, this starter is a great choice for bloggers looking for a modern and customizable platform.