15 Creating a NativeScript App with Angular

 

This chapter covers:

  • Why you may want to create NativeScript apps with Angular
  • How to create and run a NativeScript-with-Angular app
  • The structure of an Angular app

In the last chapters, we finished the Pet Scrapbook app and you learned how to prepare it for deployment to the App Store and Google Play store. We could stop here, and you’d have the tools and understanding needed to start writing your own apps with NativeScript. But, that wouldn’t be fair because there’s more to NativeScript than vanilla NativeScript. You can also create NativeScript apps with Angular, also known as NativeScript-with-Angular apps.

DEFINITION

NativeScript-with-Angular apps are a type of NativeScript app that is written using the Angular JavaScript framework. Apps still rely on NativeScript’s core modules and the NativeScript runtime, but let you replace NativeScript’s app structure, page definition, navigation, and data binding with the corresponding Angular way of doing things.

Angular (a.k.a. Angular 2+) is the successor to the popular web development framework, Angular 1 (also known as AngularJS).  Like NativeScript, Angular is an open source JavaScript framework, and it’s maintained by Google and other development community members.

15.1   Why Angular

15.1.1   Advantages

15.1.2   Disadvantages

15.1.3   Recommendations

15.2   Using NativeScript with Angular to recreate the Pet Scrapbook app

15.2.1   Scaffolding an Angular project

15.2.2   Running an Angular project

15.2.3   App structure

15.3   TypeScript

15.3.1   Understanding TypeScript

15.3.2   Why TypeScript is significant

15.4   NativeScript Angular integration

15.5   Understanding NativeScript-with-Angular app startup

15.5.1   Understanding the app.module.ts file

15.5.2   Angular components and the app.component.ts file

15.6   Summary

15.7   Exercise

15.8   Solutions