Gatsby Progressive Web App Starter

Gatsby Progressive Web Apps

🎡 What are Progressive Web Apps

Progressive Web Apps are Websites that took all the right vitamins.

Read More about PWA

PWA checked with Lighthouse - These checks validate the aspects of a Progressive Web App.

🚀 Quick start

1. Create a Gatsby site.

   Use the Gatsby CLI (install instructions) to create a new site, specifying the hello-world starter.

   # create a new Gatsby site using the hello-world starter
   gatsby new progressive-web-app https://github.com/rangequest/firebase-gatsby.git

2. Start developing.

   Navigate into your new site’s directory and start it up.

   cd progressive-web-app/
   gatsby develop

3. Open the source code and start editing!

   Your site is now running at http://localhost:8000!

   Note: You'll also see a second link: http://localhost:8000/___graphql. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial.

   Open the progressive-web-app directory in your code editor of choice and edit src/pages/index.js. Save your changes and the browser will update in real time!

Gatsby before PWA Implementation

Before PWA

Gatsby After PWA Implementation

After PWA

Features

• Google Fonts Customization
• Material UI Theme Customization
• SEO Module
• Service Worker
• Offline Page
• Installable App
• App Shortcuts
• GitHub Workflow to deploy to Firebase

Live Demo

🔥 Visit Site