Skip to content
This repository has been archived by the owner on Jan 25, 2024. It is now read-only.

A sample camera app implemented with PWA and Ionic 5.

License

Notifications You must be signed in to change notification settings

seanwu1105/ionic-pwa-example-moment

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Ionic PWA Example - Moment

build

An offline camera app built with PWA without any native framework.

Onboarding Installation Capturing
Photo Details Dark Theme I18n

Installation

launch now

Design

  • Organize the project structure by features
  • Emulate native behavior on clicking Android hardware back button by
    • using undocumented NavController in Ionic
    • removing and re-adding the iframe element on its src is changed
  • Import common components, pipes, directives, services and modules to SharedModule
  • Use mocks in test with testing injectables in DI
  • Use virtual slides to greatly reduce memory usage on displaying full size images
  • (WIP) use virtual scroll to reduce memory usage on displaying thumbnails

Features

  • Support offline mode after installed
  • Store data locally
  • Take photos in app (without using external camera app)
  • Switch ALL different cameras on devices
  • Collect GPS on taking photos
  • Support i18n dynamically for English and Tranditional Chinese
  • Localize date format dynamically
  • Share photos to other apps
  • Download photos to device storage
  • View next/previous photo with swiping gesture
  • Show EXIF of captured photos
  • Show camera with device information
  • View and zoom fullscreen photos with gesture
  • Opt-in automatic error report
  • Load thumbnail only for small size images

Tech Stack

Development

Start Live-Reload

This live-reload will not enable PWA features such as service worker.

npm run serve

Unit Test

npm run test.ci

Lint

npm run lint

Live-Reload PWA

npm run build.watch.pwa
lite-server --baseDir="www"