angular2-ionic2-demo

An experimental project for testing Ionic2 role-based authentication, SQLite pre-loading and native functionalities of mobile platforms(Android && iOS) in using TypeScript, Angular2, RxJS, Ionic2, Cordova, SQLite, Auth0, Firebase.

About

This repo could be used to explore:

1. How to enrich Auth0 JWT Payload with roles/groups/permissions info by using Auth0 Authorization Extension.
2. How to implement a customisable login page with Auth0 endpoints instead of using Auth0 JS SDK and Auth0 UI Components => [code].
3. How to use RxJS to handle nested async calls and session expiration issues(renew JWT or force to re-login) => [code].
4. How to customise Ionic2 tabs based on different user roles => [code].
5. How to share data between controllers and services by
   • Route parameters => [code]
   • Angular2 setter/getter service for sync data flow => [code]
   • Ionic2 publish/subscribe pattern for async data flow => [code]
   • Mobile native storage => [code]
   • SQLite DB => [code]
6. How to use cordova plugins(both ionic-native and other extra cordova plugins) to access mobile native functionalities, such as network, device, battery, camera, file system, etc. => [code].
7. How to prepare and preload SQLite database once users install the app in order to support OFFLINE Mode => [code].
8. How to implement InfiniteScroll => [code] with async SQL queries => [code].
9. How to integrate Firebase(customisable token authentication and real-time storage) to support ONLINE Mode.

Get started

Setup

$ npm install -g cordova ionic
$ git clone https://github.com/crabcanon/angular2-ionic2-demo.git
$ cd angular2-ionic2-demo
$ npm install
$ ionic build
$ cp src/data.db www
$ ionic platform add ios
$ ionic platform add android

// If any error regarding cordova-plugin-dbcopy, please run:
$ cordova plugin add https://github.com/an-rahulpandey/cordova-plugin-dbcopy.git --save

$ ionic build ios
$ ionic build android

$ ionic emulate ios/android(your choice)

// Do not test this project with browsers.
// Open project from Android Studio or Xcode instead of running `ionic emulate`.
// Import project from the platforms/ios or platforms/android directory.

Testing credentials(role: username/password)

• Super Admin: [email protected]/super_admin
• Reseller Admin: [email protected]/reseller_admin
• Customer Admin: [email protected]/customer_admin
• User Admin: [email protected]/user_admin

PS: With different roles, you will see different contents and initial routes.

TODO List

• Enrich Auth0 JWT Payload with roles info
• Customisable login page with Auth0 RESTful endpoints
• Role-based authentication
• Customisable session-expiration handlers(two use cases: JWT metadata or customisable expiration time period)
• Share data between pages by different methods
• Preloading SQLite database
• InfiniteScroll for list
• Search InfiniteScroll list
• Signin Firebase with custom tokens provided by Auth0
• CURD methods for Firebase nodes
• Take photoes and store to the iOS/Android camera gallery
• Take photoes and store base64 data to Firebase
• Upload files from devices to Firebase

License

MIT License

---

yehuang.me  ·  GitHub @crabcanon  ·  Gmail @sysuhuangye