Slide deck used for my Oct 29 webinar titled "Building Mobile Apps with NativeScript + Push Notifications"

1. Let's talk NativeScript
This changes everything!
By

2. About Me
Technical Evangelist
Microsoft MVP (ASP.NET/IIS)
lohith.nagaraj@telerik.com
@kashyapa
http://www.kashyapas.com
http://www.telerikhelper.net
Lohith G N
http://www.telerik.com

3. Agenda
• NativeScript
• Push Notification
• Telerik Backend
• NativeScript + Push

4. You're Welcome!
NativeScript
{ }
Native iOS / Andoid / Windows Phone* Apps
Built with JavaScript + CSS + XML
Single Code Base
*Coming Soon

5. What?
{N} is built from ground up
No DOM
No Cross-Compilation
No Plugins Required
{N} is straight-up JS | Running as Native App

6. Under the hood
{N} works over an abstraction - a very smart one
Runs JavaScript in a Virtual Machine
JavaScriptCore VM on iOS
V8 VM on Android
JavaScriptCore* VM on Win Mobile 10
*Tentative

7. You write JavaScript
{N} utilizes a bridge
Has full access to Native APIs
- That's all of iOS + Android APIs!
Uses Reflection to look up Native APIs
List of APIs for each Platform
Metadata pre-generated
Injected into App package @ Build time

8. Plug & Play?
{N} is very flexible
Allows reuse of skills & assets
Use native libraries for each platform
Use JS libraries without DOM dependency
Shared UI styles through CSS
Full TypeScript Support

9. How do I start?
{N} Command Line Interface makes it easy
Grab the NativeScript CLI:
npm install -g nativescript
tns create MyApp
tns platform add android
Create Project & Add Platforms:
tns run android
tns run android --emulator
Run Project on Device or Emulator:

10. Choice of IDE?
{N} aims to give you flexibility
Sublime Text | With complete Workflow
VS Code | Best for TypeScript
Most other JS/CSS text editors

11. Demo

12. Why {N} again?

13. Push Notifications

14. What is Push Notification
• Send Some Data to your App
• Convenient, Battery Friendly
• App need not be running
• Used as Marketing Campaigns, Promos, etc

15. Architectural Overview
APNS
WNS
Android/iOS/WP

16. Procedure
• Register Your App with respective Notification
Service
• Use an App Server to communicate with
Notification Server
• Handle Push Notification message on your
device

17. Demo
Registering with GCM

18. Telerik Backend
Think of it as an App Server

19. Push in Telerik Backend
• Effortless Integration with iOS/WP/Android
• Isolates Platform Differences
• Different notification servers
• Different devices
• Different OS Versions
• Powerful Targeting
• Easy device integration
• Hybrid or Native

20. Demo
Telerik Backend Push Settings

21. Push with NativeScript

22. Process
• Create a NativeScript App
• Include NativeScript Push Plugin
• Register the device with your App Server
• Listen for Push Notification callback
• Handle Push Notification

23. Demo
NativeScript + Push Notification

24. By
Native X-Platform Mobile with JS
NativeScript Blog | @NativeScript
Go build your dream app!