Spark the future.

May 4 – 8, 2015Chicago, IL

Getting Started with Cross-Platform Mobile Development using Apache Cordova Ryan J. SalvaFind me on Twitter @ryanjsalva

BRK2704

Please interrupt me.

Please interrupt me.Ask questions.

Please interrupt me.Tell me if I talk to fast.

Please interrupt me.Say “hi” to your mom. This talk is recorded.

Way back machine: 2010

0%

10%

20%

30%

40%

50%

60%

70%

80%

90%

100%

43%

64%

Time Spent in Apps vs. Browser

Apps Web Source: Flurry Analytics

Apps dominate the mobile web

2013 20140%

10%

20%

30%

40%

50%

60%

70%

80%

90%

100%

80% 86%

20% 14%

Time Spent in Apps vs. Browser

Apps Web Source: Flurry Analytics

HTML is the most popular language among mobile developers.

Source: Developer Economics State of the Developer Nation Q3 2014

HTML/Ja

vaSc

ript

Java

C/C++

Objec

tive-

C C#

Visual D

evelop

men

t Too

l

Java

/Coff

ee/T

ype

Scrip

tPH

P

Pyth

on

ActionS

cript

Ruby

Lua

42%

38%

26%24%

23%

17%15%

11%

7%

3% 3% 3%

The Languages Developers Know Best% of developers who consider them-

selves proficient by language

HTML trails closely behind Java and Objective-C as developers’ primary language.Source: Developer Economics State of the Developer Nation Q3 2014

Java

Objective-C

HTML/JavaScript

C#

C/C++

Visual Development Tool

Java/Coffee/Type Script

PHP

Python

ActionScript

Lua

Ruby

26%

17%

17%

14%

10%

8%

3%

1%

1%

1%

1%

1%

24%

20%

17%

13%

9%

7%

3%

1%

1%

1%

1%

1%

Primary Language Share% of developers using each as their

primary language

Full-time Professionals All Developer Segments

Enter Apache Cordova

6% of apps in stores14% of apps in the business category

Source:App Brain, April 2015

What is Cordova?• Open source framework• A web app in a native wrapper• Android + iOS use a webview• Windows uses WWAhost• Single, shared JavaScript

codebase deployed to all targets

• Plugins provide a common JavaScript API to access device capabilities

Native Wrapper

<webview>Your JavaScript App

Cordova Plugin JS API

How does Cordova work?

Cordova Project

• HTML, CSS, JS, assets

• Configuration• Platform code• Plugin code

Visual Studio Project• HTML, CSS, JS, assets• Windows-specific runtime• Windows-specific plugin

code• Windows-specific

configurationXCode Project• HTML, CSS, JS, assets• iOS-specific runtime• iOS-specific plugin code• iOS-specific configuration

Android Project• HTML, CSS, JS, assets• Android-specific runtime• Android-specific plugin code• Android-specific

configuration

Create Build

Native Windows App

Native iOS App

Native Android App

Xb

oxPhone

Desk

top ‘windows8’ Platform

Targets Windows 8WWA in local context

‘windows7’ PlatformNot maintained

‘WP7.5’ PlatformDeprecated

‘WP8’ PlatformSilverlight app w/webview

‘windows’ PlatformTargets Windows 8.1 &

Windows Phone 8.1WWA in local context

Also continues to allow targeting Windows 8

Phase 0 Phase 1 Phase 2

‘windows’ PlatformTargets UWP

WWA in remote (default) or local mode (setting in

config.xml)

Embedded Cordova also supported

Also continues to allow targeting Windows 8, 8.1, and WP8.1

Win10 RTM

‘WP8’ PlatformSilverlight app w/webview

Summer ‘14

‘WP8’ PlatformSilverlight app w/webview

Direct access to WinRT makes platform-specific code and plugins easier to write

Supports hosted content model natively On a web standards roadmap Supports embedded Cordova apps You can use the JavaScript libraries and patterns you

love. SafeHTML is no longer an issue in Windows 10 Working on support for the top 25 plugins WinJS offers touch and keyboard friendly controls that

work on all mobile platforms. WinJS can be used in concert with Angular, Bootstrap, and other libraries.

Cordova Windows 10 Platform

Cordova Windows 10 platform now available for prototyping!

How do I get it? Extension to Visual Studio 2013 In-box with Visual Studio 2015

All the stuff you need Visual Studio installs and

uses the third party tools you need for multi-device development

As you use Visual Studio, each time it opens, it runs dependency checks and keeps up-to-date a verified stack of open source tools from the community

Okay, show me.

You need… Windows 10 Technical Preview 2 Visual Studio 2015 RC Cordova Windows 10 Platform Prototype (optional)

For help.. https://aka.ms/cordova-docs https://aka.ms/cordova-samples https://aka.ms/cordova-tutorials

How do I try it out?

Use Cordova if you want to… Use your web skills & assets Maintain one codebase Use the JS libraries you love

You might be better off writing native apps if…

You’re want to build a consumer app in the top 3% You want different apps on different devices You ♥ Java, Objective-C or DirectX. If you love XAML/C#, consider Xamarin.

Should I build a Cordova app or Native apps?

Are you guys totally for serial about Cordova?

Yup.

Visual Studio has had support for Cordova for a year

VS2015’s Cordova investments include: Improved CLI and project system interop with 3rd party CLIs Updated Cordova, plugins, emulators, and OSS components An improved build path for iOS Additional app services support for mobile services, auth, O365, and analytics

Windows is committed to building and growing a first class Cordova platform

Major Windows investment for Cordova included: Hosted app content support with WinRT access Embedded webview support with WinRT access Security model redesign Contribution of all Cordova code to the Apache Cordova OSS project

• Cordova Browser Platform + Browser Support for Top 30 Plugins

• Ripple Emulator• Cordova Windows Platform• Cordova Test Infrastructure (MEDIC) • Cordova CLI (--list, --save, --restore, --arch)• Filling out the Plugin support matrix• Hosted app support for File, Media Capture, and

Camera plugins• Performance tests

Contributions to Open Source

Salesforce is building on the Windows 10 Cordova platform today

Download the tools (free) http://aka.ms/cordova

Documentation http://aka.ms/cordova-docs Videos http://aka.ms/cordova-videos Tutorials http://aka.ms/cordova-tutorials Samples http://aka.ms/cordova-samples Support forums

http://www.stackoverflow.com

cordova platform add windows@https://aka.ms/cordova-win10

Resources

FREE UPGRADE to Visual Studio Enterprise with MSDNLearn more about this offer: http://aka.ms/nbtbvs

Learn more about Visual Studio 2015 at our in-person or online events: http://aka.ms/nbtbevents

There’s no better time than now to get ready for the release of Visual Studio 2015!

For a limited time, get a free upgrade to Visual Studio Enterprise with MSDN

Visit Myignite at http://myignite.microsoft.com or download and use the Ignite Mobile App with the QR code above.

Please evaluate this sessionYour feedback is important to us!

© 2015 Microsoft Corporation. All rights reserved.