Totally Build Apps for Free! (not really)

Totally Build Apps for Free*not really

Tony Hillerson • Tack Mobile

Mobile+Web DevConf

San Francisco January 2015

Presentation tackmobile.com

slideshare.net/thillerson/totally-build-apps-for-free-not-really

http://www.slideshare.net/thillerson/totally-build-apps-for-free-not-really


About Me

• Engineering Director, Tack Mobile

• Denver, CO

• Android (since Beta), then iOS (since ~ iOS 2)

• Various Server-side technologies

• Pragmatic Programmers Author


Goals for Today

• Very Modest Goal:

• Understand what cross-platform solutions get you

• … and what they don’t

• Offer my experience on which types of cross-platform solutions make sense


Like It Or Not…

• Cross platform solutions are necessary

• I don’t like it…

• But it’s the world we live in

• Be prepared


FAQ…


If we use solution ‘X’, then we can build an app for platform Aand get platform BFOR FREE


FOR FREE, RIGHT?


Solutions

• Cordova/Phonegap Based

• Titanium

• Xamarin

• Fuse Tools *NEW!

• React Native *SUPER BRAND NEW!


http://www.gartner.com/technology/reprints.do?id=1-20SX3ZK&ct=140903&st=sb

http://www.gartner.com/technology/reprints.do?id=1-20SX3ZK&ct=140903&st=sb


wut




People Want Answers




First, Let’s Talk About Native

• I strongly believe

Native should be your default preference


Doesn’t HTML Solve Everything?

• Your Mobile Web is important

• A Good Mobile Web Experience is Table Stakes

• Web views replacing native - It’s just not the world we live in yet.


Mobile UX Considerations

• Android users want Android conventions

• iOS users want iOS conventions

• Unless you have a good reason not to

• … and that reason shouldn’t be that you can’t do it with your toolchain


What About These Solutions, Then?


Mobile Development Strategies

• Mobile Web - i.e. no app

• Single Platform - i.e. iOS only

• Multi-platform

• Cross-Platform


What Are You Trying to Accomplish?

• Make a one-size-fits-all app?

• Shield developers from learning a new language or platform?

• Save money on development effort?

• Share code, but still build a great UX?


Cross Platform Strategies

• Web-view solutions

• Vendor Technology/APIs

• Native Compilation


Cross Platform Web

• PhoneGap/Cordova Based

• Strategy: Hide cross platform differences, Write with web technologiesRun in web view

• Hard Questions:

• Does it look like a web app?

• Does it feel like a web app?


Cross Platform Interpreted

• Example: Titanium

• Strategy: Hide cross platform differences behind a common, vendor API.Write everything once with web technologies, interpreted on native platforms

• Hard questions:

• How hard is it to fit design to the platform?

• Do I get native performance and experience?


Cross Platform Native

• Example: Xamarin, React Native, RubyMotion

• Strategy: Unified language and platform to native APIs.Runs in native runtime.Write in one language, calling native APIs.

• Hard Questions:

• Do you trust the developer?

• Can they keep up?


A Syllogism

• Native applications are preferable to web

• and Native execution is preferable to interpreted

• and platform native APIs are preferable to vendor APIs

• Cross platform native apps are native, executed, and access native APIs

• Therefore: Cross native platforms are preferable

• QED


What’s For Free, Then?


React Native Dev Quote

• “We’re not chasing the write once, run anywhere pipe dream”

• “Learn Once, Write Anywhere” 28:50 - http://youtu.be/KVZ-P-ZI6W4?t=28m50s

http://youtu.be/KVZ-P-ZI6W4?t=28m50s


First, What’s Not Free?

• Platform specific design

• Platform specific expectations

• Technical discovery

• Licensing fees


The Free Part

• Shared code where it makes sense

• Common understanding across team(s)


Cross Platform Native Strategies

• Share http access

• Share local data layer

• Build to MVVM, share model and view model


Cherry-picking Shared Code

API Access Layer +

Deserialization

iOS UIAndroid UI


Push the Shared Code as Far As You Can

API Access Layer +

Deserialization

iOS UIAndroid UI

Common Data Model Layer

Common View Model Layer


Add Caching and Local Data

API Access Layer +

Deserialization

iOS UIAndroid UI



Local Datastore


Abstract Platform Services

API Access Layer +

Deserialization

iOS UIAndroid UI



Local Datastore

Location Manager

CoreLocationInjected Injected

Abstract Location Manager


Xamarin as an Example


Xamarin

• Write in C# using .Net libraries

• Access Platform APIs directly

• Core project (shared code)

• Android project

• iOS project


An API Client Interface

public interface CheckvistAPI { [Get("/auth/login.json")] Task<string> LogIn(string username, string remote_key); [Get("/checklists.json")] Task<Checklist[]> GetChecklists(string token);}


iOS Uses It public override void ViewDidLoad () { base.ViewDidLoad (); var client = new CheckvistClient(); var loginTask = new Task(() => { client.LogIn("username", "AP1k3Y"); var checklists = client.GetChecklists(); foreach (var checklist in checklists) { Debug.WriteLine(checklist.Name); } } ); loginTask.Start(); }


Android Uses It protected override void OnCreate(Bundle bundle) { base.OnCreate(bundle); SetContentView(Resource.Layout.Main); var client = new CheckvistClient(); var loginTask = new Task(() => { client.LogIn("username", "AP1k3Y"); var checklists = client.GetChecklists(); foreach (var checklist in checklists) { Console.WriteLine(checklist.Name); } } ); loginTask.Start(); }


Recap


Recap

• Web technologies are not up to native standards yet

• Cross platform solutions deserve your attention

• Don’t give up access to the native APIs

• Build good apps

Thank You! Questions?

[email protected]

[email protected]

mailto:[email protected]

mailto:[email protected]

Totally Build Apps for Free! (not really)

Software

compresentation tackmobile

answerspresentation

fre tackmobile

comwutpresentation tackmobile

comfaqpresentation tackmobile

sensepresentation tackmobile

crossplatform solutions

cross platform solutions