This is Joanne's website, shows her works. Clicking on each image will show it in full-screen mode. Images are dynamically served from Firebase storage
and lazily loaded using IntersectionObserver
API. All resources are cached by workbox
service worker that makes the web faster on next visit and even when user lost the internet. Also the web will be server-side-rendered to make it faster and easier to be found by search engines.
The website was built and deployed using following technologies:
- React: A JavaScript library for building user interfaces
- Create React App: a React application build tool
- Workbox: JavaScript libraries for Progressive Web Apps
- Firebase: cloud platform for storage, database, hosting and functions
// to install dependencies
yarn
// to debug on localhost:3000
yarn start
// to run tests
yarn test
// to build for production
yarn build:ssr
// to test on localhost:5000 with production build
yarn serve
// to deploy on firebase hosting cloud
firebase deploy