14
Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet http:// mattmilner.com

Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Embed Size (px)

Citation preview

Page 1: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Apache Cordova Tools in Visual Studio

YOU GOT YOUR HTML IN MY MOBILE APP!

YOU GOT YOUR MOBILE APP ALL OVER MY HTML!

Matt Milner

@milnertweet

http://mattmilner.com

Page 2: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Matt Milner Independent Consultant Pluralsight Author Interested in Pogonotrophy

@milnertweet http://mattmilner.com

Page 3: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Overview

What is Apache Cordova?

Cordova in Visual Studio

Using Your Web Skills for Mobile AppsAdding Libraries

Device Targeted Code

Using Plugins for Device Access

Page 4: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Mobile App Development

Native

Cross Platform C++ / C#

Cross Platfor

m HTML /

JS

Page 5: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Native Development

Platform-specific

languages and tools

Little if any code sharing

Mental context

switching for development

Page 6: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Cross Platform C++ / C#

Platform independent languages and tools

Share some code across platforms

Write in a single

language

Page 7: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Apache Cordova

Open source framework for building mobile applications using HTML,

JavaScript, and CSS

Page 8: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Apache Cordova

“Oh, you mean Phone Gap”?

Is that like Ionic?

Do I have to use Visual Studio?

Page 9: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Using Web Skills for Mobile

App

Hosted in web view

HTML / JavaScript / CSS

Page 10: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Cordova and Visual Studio

Project system

Easy platform switching

Full IDE features

Custom editors

VS Emulator for Android

Page 11: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Web Libraries

Bootstrap

jQuery

KnockoutIonic

Angular

Page 12: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Device Differences

Device Quirks

Platform-specific

code

Page 13: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Accessing Device Features

Different platforms

Shared code base Challenge

Platform code

Consistent JavaScript Interface

Cordova Plugin

Page 14: Apache Cordova Tools in Visual Studio YOU GOT YOUR HTML IN MY MOBILE APP! YOU GOT YOUR MOBILE APP ALL OVER MY HTML! Matt Milner @milnertweet

Matt Milner @milnertweet http://mattmilner.com