Post on 24-Dec-2015
transcript
Multi-device apps withVisual Studio tooling for Apache Cordova™Amanda Silver
DEV-B323
Cloud Scenarios for Enterprise DevelopersDev & Test
in the Cloud
Mobile AppsIn the Cloud
Hybrid Apps
Web SitesIn the Cloud
Native - Rich
Desktop reassurance
• WPF core investments• Access to modern features• Common distribution• Easier transition to Store apps
Native and web investments
Web - Reach
Modern web
• Productive HTML5 development
• Highly interactive web with JavaScript and TypeScript.
• Ready for Enterprise LOB apps and cloud modernization
Optimize for devices
• Universal apps and native compilation
• Cross-device Windows, iOS, Android native apps (thru Xamarin)
Embrace hybrid apps
• Cordova tooling support built on existing Modern Web support in
Visual Studio and TypeScript.• Android, iOS support including
the entire developer flow.
HTML
Productivity of Visual Studio for hybrid apps
Scale to complex Enterprise apps through optional TypeScript support
End-to-end development workflow included
Flexibility to use any JavaScript framework
Visual Studio tools for Apache Cordova™
Hybrid-HTML apps
New Cordova tooling in Visual Studio
Natural path for web developers targeting devices
Shortest path for cross-platform mobile
Especially relevant for Enterprise B2E scenarios
Black Box
CSS | HTMLJavaScript | TypeScript
What it does…
What it doesn’t do…
End to End Workflow for Hybrid Mobile App
Value Prop
Value Prop
What it does…
What it doesn’t do…
Black Box10
21 Manage Device
Capabilities 3Manage
ServiceCapabili
ties 4Edit Code 5Edit
& Style
UI 6Build & Run 7Debug &
Diagnose 8CI &Cloud Build 9 Publish &
ManageTest on Device
s
Highly iterative, not sequential
Create Project
Adding new features, platforms, capabilities pushes backwards
Demo
Hybrid cross-platform mobile development• Tools for Apache Cordova™ in Visual Studio
Step 0
Acquisition
Installs
Step-by-step Guide
OSS pre-reqs (Ant, Android SDK, Git, node.js, etc.)
Visual Studio Extension
Visual Studio Update (debugging)
Details each step of configuration for your development machine including gotchas
Black Box
Step 1
Create New
Templates
Notes
JavaScript & TypeScript
Blank templates
AngularJS
Backbone + Underscore + jQuery
WinJS (base.js + ui.js)
Black Box
Samples
Step 2Manage Device Capabilities
Config EditorSimilar to Windows App Manifest with cross-platform capabilities included as part of Cordova
Can manually update plug-in versions via XML or pull custom plugins from plugins.cordova.io
Locks to version dependencies to avoid breaks
Also supports ability to add local custom native plug-ins
Black Box
What it does…
What it doesn’t do…
Connecting your app with Services
It’s easier than ever to build applications that use Microsoft services. Add a
service to your app in
Visual Studio
Configure your service
settings
Write code to use the
service
Azure Active Directory
AuthenticationOffice 365 Exchange &
Files
Azure Mobile Services
Auth, Data, & PushApplication
Insights Analytics
Step 3
Step 6
Build & Run
BuildUses Cordova CLI
Custom build process to optimize for iterative loop
Launch remote build agent
Initiate deployment to iOS simulator
Remote build to in-network OSX
Step 7
Debug & Diagnose
Same great Visual Studio debug experienceBreakpoints, DOM Inspection, Just-my-code
Call-stacks, Locals, Watch
TypeScript Source Mapping
Debug against Simulator, Emulator, Device targets
(Windows & Android 4.4+ for best experience)
Black Box
But now with additional targets
Step 10
Publish & Manage
Deploy via Windows Intune
Black Box
Manage distribution & version updates
Built in data points optimized for mobile apps
Support for custom events
Monitor via Application Insights
Deploy Via iTunes for local iOS device
Download the Preview
Build & Test for the breadth of devices
Deploy your app via Windows Intune
Monitor with Applications Insights
Breathe
Come on, bring your own device!We can handle it.
Breakout Sessions
Related content
Find Me Later At. . . “the Booth”
FDN-05 – The Microsoft Application Platform for Developers: Create Applications that Span Devices and Services
DEVB310 – Getting Started with TypeScript
DevB333 – Sharing Code and UI with Universal Projects and Windows Library for JavaScript (WinJS)
DevB221 – Native Mobile Application Development for iOS, Android, and Windows in C# and Visual Studio
DEVB420 – Building Rich Apps with AngularJS on ASP.NET
2:15 – 4:00 TODAY!
Developer Platform and Tools
Visit the Developer Platform & Tools BoothHaving a friend buy your coffee?Yea, it’s kind of like that.
MSDN Subscribers get up to $150/mo in Azure credits.
Stop by the Developer Platform and Tools booth and visit the MSDN Subscriptions station to activate your benefits and receive a gift!
http://aka.ms/msdn_teched
3 Steps to New Gear! With Application Insights
1. Create a Visual Studio Online account http://visualstudio.com
2. Install Application Insights Tools for Visual Studio Online http://aka.ms/aivsix
3. Come to our booth for a t-shirt and a chance to win!
VSIP QR Tag Contests Visit our booth to join the hunt for cool prizes!
ResourcesMicrosoft Engineering Stories
How Microsoft Builds Softwarehttp://aka.ms/EngineeringStories
Visual Studio Industry Partner Program
Meet Our New Visual Studio Online Partners or Join Now.http://vsipprogram.com
Visual Studio | Integrate
Create Your Own Dev Environmenthttp://integrate.visualstudio.com
Development tools & services for teams of all sizeshttp://www.visualstudio.com
Complete an evaluation and enter to win!
Evaluate this session
Scan this QR code to evaluate this session.
© 2014 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.