Angular2 + Nativescript

Diego Barahona

Angular2

Features

  • Doesn't enforce an architectural pattern
  • You can use libraries freely (no more wrappers yay)
  • Even more web component oriented
  • Renderer decoupled from the framework

Platforms

  • Browser
  • Web Worker
  • Server
  • and...

{N}ativeScript

There
Is No
DOM

Cordova Core

Cordova Core

Web Code in Browser

Native Code in App

Cordova Approach

  • Javascript calls a Cordova function
  • Cordova sends a message from the browser to the app
  • A native Cordova plugin gets the message
  • The native plugin calls to the native methods
  • The response (if any) returns in the same order

{N}ativeScript Approach

  • Nativescript creates a runtime link between the native code an the javascript engine
  • Javascript calls a native function
  • The native function respond to javascript

Javascript Code in App

Native Code in App

Mapped Symbols

I've been telling me my self for years that hybrid web apps are cool, but they're not

How do I start?

npm install -g nativescript
tns create my-app-name --ng

# Ready to rock
# Well, not really :(
# Still missing a lot of android/ios c̶r̶a̶p̶ good tools

Hello World

import {nativeScriptBootstrap}
  from 'nativescript-angular/application';
import {Component}
  from '@angular/core';

@Component({
  selector: 'app',
  template: '<Label [text]="hello"></Label>'
})
class AppComponent {
  public hello = 'Casa Casita';
}

nativeScriptBootstrap(AppComponent);

Let's
Do Some
Code

A2 + {N}

By Diego Barahona

A2 + {N}

  • 695