WWWID reader as a Progressive Web App. Part of #WWWIDChallenge for February 2018.
This project is bootstrapped using gatsby-starter-typescript-plus.
Hey there!
This website was created by @resir014 as part of the #WWWIDChallenge for February 2018.
The challenge was to create a Progressive Web App (PWA) that can load in less than 5 seconds. I was free to choose any framework/library as long as it's usable via all modern browsers. The website consists of a homepage with latest feeds, an article view, and category filters.
I decided to go the JAMstack path using Gatsby.js. The basic PWA setup for Gatsby is to use gatsby-plugin-manifest
and gatsby-plugin-offline
, and further optimizations are done during the build process, such as image processing with Sharp, complete with lazyloading of image thumbnails with gatsby-image
.
I also use TypeScript, because it's awesome.
- Basic Gatsby.js + TypeScript setup
- Progressive Web App
- Statically generated
- Image processing with Sharp
- Styling with
styled-components
.
A nodejs >= 6.0.0 setup with yarn is recommended.
# install dependencies
yarn
# ...or if you prefer npm
npm install
# serve with hot reload at localhost:8000
yarn start
# build for production
yarn build
Built with Gatsby - the blazing-fast static site generator for React.