Practera SDK - Ionic 2/Angular 2 (soon 4)

Overview

Docs

1. Front-end Architecture

2. Naming Convention Planning

Requirements

For development environment, here are mandatory utilities.

• Npm (Nodejs) : Refer to https://nodejs.org/download/
• Ionic v3 : version 3++

Setup Notes

1. Install dependencies

   npm install -g ionic #install ionic-cli globally

2. Make sure your ionic is running at least v3 and above by running ionic -v command

   ionic -v # example version number (> 3) from the command above

3. If you have problem installing ionic, please uninstall current version of ionic with the following and repeat the step 1 & 2 above again to install ionic correctly.

   npm uninstall -g ionic

4. after git clone with git clone [email protected]:intersective/practera-sdk-ionic.git

5. change directory into the project folder cd practera-sdk-ionic

6. Install node dependencies

   npm install

7. To run app locally

   ionic serve

Development Notes

1. Ionic Deeplinking/Routing Deeplinking allow a URL to auto redirect user into a specific page in the App. We also use named url parameters in URL, for example, http://example.com?parameter_name=example_value for specific feature to adapt backward-compatible consideration.

   For example, using pagename in do parameter:

   • Reset password: http://example.com?do=resetpassword&[email protected]&key=abcdefg

   • Registration: http://example.com?do=registration&[email protected]&key=abcdefg

2. Copy src/configs/config.ts.default to src/configs/config.ts. Change your appkey inside config.ts based on the appkey in your database.

3. Start server or initiate app

   ionic serve
   

Troubleshooting

1. Cached web content - If you found what you see in browser isn't updated as expected after you've changed the codebase, you can try:

   1. Make sure ionic serve in your terminal if it is still running
   2. Activate browser Developer Mode in Chrome/Safari/Firefox - OPT + CMD + I
   3. Empty cache
      1. Chrome
         1. Application Tab
         2. Clear Storage
         3. click '[Clear selected]' button
      2. Safari
         1. Select Develop
         2. Disable cache
         3. Empty cache or OPT + CMD + E
      3. Firefox
         1. Get into Preference (use shortcut key CMD + ,)
         2. Select Advanced
         3. At the Cached Web Content click '[Clear Now]' button

2. To clear npm cache, if you get prompted about node-sass, run command below

   npm rebuild node-sass

3. To make sure your npm package installed has the latest/match package.json dependencies correctly

   # reinstall after node_modules & npm cache cleared
   rm -fr node_modules
   rm -fr package-lock.json
   npm cache clean --force
   npm install