Project 8: SpaceX App (PWA)

This project was bootstrapped with Create React App. It was created for submission in Pana Cloud Bootcamp 2020.

Link to Web App

The web app has been deployed to Netlify, and can be accessed here.

Features

The following are some of the features of this project:

• Uses GraphQL to query data
• Query responses cached in service-worker using Caches API with Stale-While-Revalidate approach
• Developed with Test Driven Development (TDD) approach (85+ tests)
• CI/CD pipeline with Github Workflows
• Automated tests in CI/CD pipeline
• PWA- Installable on all OS (Android, iOS, Windows, etc.)
• Compliant with Lighthouse Audits
• Completely typed with Typescript
• Completely interactive design with CSS transitions
• Completely responsive design with CSS media queries

Learning Outcomes

The following are some of the learning outcomes of this project:

• Using GraphQL to query APIs with Apollo Client
• Intercepting and caching query responses dynamically in service-worker
• Using stale-while-revalidate approach for caching to get speed as well as updated data
• Using Test Driven Development (TDD) approach for developing web apps
• Using React Testing Library (RTL) to write tests for React components
• Using Jest for assertions and running tests
• Testing react-router integration
• Creating a PWA with ServiceWorkers and Manifest
• Using Typescript to develop a typed web app
• Building a web app with React.JS, React Icons, React Router DOM, etc.

API Used

SpaceX GrapgQL API