Gatsby Material Starter

Overview:

The Gatsby Material Starter is a blog starter for GatsbyJS that is designed with a Material Design approach. It includes advanced features such as SEO, image optimization, PWA capabilities, and infinite scrolling feeds. This starter is meant to provide a minimal foundation for building advanced GatsbyJS powered websites by utilizing the latest technologies to streamline the development process. It supports both TypeScript and JavaScript, comes with Jest and Cypress configurations, and allows for writing Unit/Integration/E2E tests out of the box. The starter uses the gatsby-theme-advanced and is based on the Gatsby Advanced Starter.

Features:

• Gatsby v4 support
• First class TypeScript support
• Material UI V5 components
• Emotion used for styling
• Posts in MDX
• Code syntax highlighting
• Embed videos and iframes
• Infinite Scrolling
• React Query for client-side API calls
• Tags and categories for organizing posts
• Social features such as Twitter tweet button, Facebook share/share count, Reddit share/share count, and LinkedIn share button
• Author section
• Related posts computation and display based on category/tag match ranking
• Disqus support via gatsby-theme-advanced
• gatsby-plugin-image for optimized image generation
• Inline SVG imports
• High configurability
• Separate components for various functionalities like Gatsby Link utilities, SEO, Disqus, PWA features, etc.
• Offline support
• Web App Manifest support
• Loading progress for slow networks
• SEO features: Google gtag.js support, Sitemap generation, General description tags, Google Structured Data, OpenGraph Tags (Facebook/Google+/Pinterest), Twitter Tags (Twitter Cards), and RSS feeds
• Development tools: Yarn 3, Jest for unit/integration testing, Cypress for E2E testing, CI via GitHub Actions, CD via GitHub Actions, ESLint for linting, Prettier for code formatting, React Hooks Linting, Remark-Lint for linting Markdown, write-good for linting English prose, gh-pages for deploying to GitHub pages, and Netlify deploy configuration.

Installation:

To install this starter, follow these steps:

1. Make sure you have the Gatsby CLI installed and updated.
2. Run the following commands from your CLI:

gatsby new my-blog https://github.com/Vagr9K/gatsby-material-starter
cd my-blog
gatsby develop

Alternatively, you can fork the project on GitHub, make your changes, and merge new upstream features when needed.

Summary:

The Gatsby Material Starter is a powerful blog starter for GatsbyJS that incorporates Material Design principles and offers advanced features such as SEO, image optimization, PWA capabilities, and infinite scrolling feeds. It supports both TypeScript and JavaScript and provides an out-of-the-box setup for writing tests using Jest and Cypress. The starter is highly configurable and includes separate components for different functionalities. It also offers powerful development tools and easy deployment options. Overall, the Gatsby Material Starter provides a solid foundation for building advanced Gatsby websites with modern features and capabilities.