Quotes application for Web and Mobile (Android, iOS) with single code base buit with Angular and Nativescript.

If you want to create your own cross-platform app similar to this, check this starter: nativescript-angular-web-starter.

You can check previews and screenshots of this application for Web, Android and iOS platforms at ngxp.io

1. Globally installed Nativecript - npm install -g nativescript
2. Globally installed Angular CLI - npm install -g angular-cli
3. Mac OS to build iOS app.

1. git clone https://github.com/shripalsoni04/ngxp-quotes-app.git
2. cd ngxp-quotes-app
3. npm run ngxp-install
   • As we are using nativescript-firebase plugin, just press y for below two questions when asked while installation.
     • are you using iOS?
     • are you using android?
     • For all other questions press n.

npm start - This will start the application at http://localhost:4200.

• First start the simulator or connect the iOS device.
• Execute npm run start.ios
• Note - If you are using XCode8 then you need to set the DEVELPMENT_TEAM. There are two ways to set it.
  1. Using XCode
     • After executing npm run start.ios command, open project wordspace file nativescript/platforms/ios/nativescript.xcworkspace in XCode
     • Click on nativescript project in XCode and set Team from General Tab.
     • The issue with thie approach is, you need to set it everytime you remove and add the iOS platform.
  2. From build.xconfig (preferable)
     • Open nativescript/app/App_Resources/iOS/build.xconfig file.
     • Uncomment DEVELOPMENT_TEAM = YOUR_TEAM_ID; line, and enter your team id.

• Execute npm run start.android

You can execute any valid command of angular-cli from web/ folder and any valid command of nativescript-cli from nativescript/ folder. For convenince below are the commands which you can execute from root directory.

1. Angular dependencies at two levels for AOT support

• Currently we have added angular dependencies in root level package.json and web/package.json. Because, AOT does not work properly when we use path mapping and this issue is reported and can be traked at angular/angular-cli#1732 and PR:angular/angular-cli#2470. Once this issue is resolved we can add path mapping as shown below and remove the angular dependencies from web/package.json, so in case of any version update we just need to change the version at root directory level.

  web/src/tsconfig.json

  "paths": {
      "@angular/*": ["../../node_modules/@angular/*"]
    }
  

1. nativescript-cardview
2. nativescript-floatingactionbutton
3. nativescript-iqkeyboardmanager
4. nativescript-material-icons
5. nativescript-ngx-fonticon
6. nativescript-plugin-firebase
7. nativescript-social-share
8. nativescript-swiss-army-knife
9. nativescript-theme-core
10. angular-mdl
11. Awesome framework and toolchain of Nativescript and Angular.