audioC0RE

NB: This project is currently a work in progress

This project is my take on the 2021 #100DaysOfGatsby Challenge.

In this challenge, you are the newest hire at the (fake) headphone sharing startup, AudioC0RE! The challenge was delivered in sprints, with various tasks being completed along the way.

Sprint 1: Proof of Concept

• ✅ Build a proof of concept (POC) Gatsby site to test their routing API, builds service, hosting, and Contentful integration
• ✅ Use Gatsby’s Contentful plugin and connect to a test Contentful site

• ✅ Create the following pages:

  • home
  • about
  • and a collection of pages for every city we’re in.
• ✅ Build it on Gatsby Cloud and use their preview URL

Sprint 2: Launching the Website

• ✅ Use the Chakra UI component library as the basis for the site design
• ✅ Create a “contact” page, and add a form using Formium.
• ⏳ Choose a CDN to deploy the site to, and continue to measure Lighthouse scores as you add features.
• ✅ Add an image of headphones for the homepage, and a skyline image for each city page. Use Gatsby’s new gatsby-plugin-image project to optimize the images. Here’s the step-by-step guide.
• ⏳ Replace React with Preact using this plugin.
• ✅ Add Progressive Web App capabilities to the site, including making the site work offline.
• ✅ Follow Gatsby’s tutorial for optimizing the site for SEO.

Sprint 3: Add a WordPress-Powered Blog

• ✅ Add Gatsby’s new WordPress integration to the existing site.
• ✅ Have the default “post” content in the WordPress install power a new /blog route on AudioC0RE’s site
• ⏳ Add Yoast SEO and the WPGraphQL extension to WordPress, and use that data to power the metadata for blog posts.

Sprint 4: Add Shopfy ecommerce

• ✅ The store should live under a new “/shop” route on the site
• ✅ Use the new BETA source integration plugin for Shopify that Gatsby launched at their conference, gatsby-source-shopify-experimental
• ⏳ Create a landing page, and pages for two products – a shirt and a hat

Sprint 5: Create a Gatsby Theme

• ⏳ Build a Gatsby theme to make scaling the AudioCORE website a consistent, rapid process.
• ⏳ When complete, publish your Theme to the npm (node package manager) library so others can use it!