Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

71
Automating Your Way out of the Dark Ages Our experience with (and without) PhoneGap Build @burin creative commons licensed (BY-NC-ND) flickr photo by Fred Seibert: http://flickr.com/photos/84568447@N00/2060261678

description

This is a talk sharing TripCase's (http://phonegap.com/app/tripcase/) experience with (and without) PhoneGap Build. We'll walk through our journey and discuss how it shaped expectations on how quickly we should be getting our code in the hands of fellow testers and stakeholders.

Transcript of Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Page 1: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Automating Your Way out of the Dark AgesOur experience with (and without) PhoneGap Build @burin

creative commons licensed (BY-NC-ND) flickr photo by Fred Seibert: http://flickr.com/photos/84568447@N00/2060261678

Page 2: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

This Talkour experience w/ PhoneGap Build and how it spoiled us

about PhoneGap specifically

what we did when we couldn’t use it anymore

Page 3: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

TimelineBuilding Manually w/ Xcode & Eclipse

Building/Distributing w/ PhoneGap Build

Manual Builds (again)

Distribution w/ TestFlight & HockeyApp

Automated Build & Distribution

Page 4: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

The Redesign

Page 5: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

From: Native iOS

Native Android

Native BlackBerry

Native Windows Mobile

mobile web

touch web

Android touch

Page 6: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

To:

HTML5! !

mobile web, iOS, Android, BlackBerry*

Page 7: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

creative commons licensed (BY-NC-SA) flickr photo by x-ray delta one: http://flickr.com/photos/x-ray_delta_one/3928200642

Building stuff.

Feeling productive.

HTML5 all the things.

Page 8: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Chrome = WebKit

Safari = WebKit

Android browser = WebKit

BlackBerry browser = WebKit

Test in Chrome, because WebKit.

Page 9: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

QA team:

“I wonder how it behaves on Android 2.3 wrapped”

Page 10: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Test in Chrome, because WebKit?

Nope. :(

Page 11: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

iOS:Safari. WebView. Chrome.

Android:Browser. WebView. Chrome.

BlackBerry:6.0? 7.0? 10?

Chrome Blink?

Page 12: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

I’ll just Build Manually with Xcode & Eclipse

Page 13: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

The Dark Age

Page 14: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

git pull

Page 15: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

compass compile

Page 16: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

node r.js -o app.build.js

Page 17: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

⌘C ⌘P

Copy/Paste Files into www

Page 18: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Plug In Phone

Page 19: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 20: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 21: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Plug In Phone #2

Page 22: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 23: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 24: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Plug In Phone #3

Page 25: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 26: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 27: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

The Renaissance

Page 28: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 29: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

With PhoneGap Build:

Page 30: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

git pull

./build.sh

Page 31: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 32: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 33: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Automate All the Things!

Page 34: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

# on every commit# 1) build app# 2) zip it# 3) upload via API

Page 35: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Went from building once a week (maybe)

tobuilding multiple times a day

Page 36: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

TimelineBuilding Manually w/ Xcode & Eclipse

Building/Distributing w/ PhoneGap Build

Manual Builds (again)

Distribution w/ TestFlight & HockeyApp

Automated Build & Distribution

Page 37: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Outgrowth: Manual Builds Again

Page 38: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Unsupported Plugins

Page 39: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Manually Building (again)

Page 40: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Manually Distributing (again)

Page 41: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

The Dark Age 2.0

Page 42: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

“Building”

Page 43: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

git pull

Page 44: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

./build.sh

Page 45: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 46: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 47: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 48: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

“Distributing”

Page 49: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Me: "Want to help? Install this app and email me your UDID" Teammate: *"I emailed you my UDID the other day, when can I install the app?"* "Um.. let me check. I need to add it to the provisioning profile." Add UDID to provisioning profile git pull Run javascript build script Push a button Forgot to get new provisioning profile into Xcode Refresh profiles Push a button Send it out "it wouldn't install, what's the deal?"* "lemme try again" restart xcode push a button "ok try now"

Page 50: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

The Renaissance 2.0

Page 51: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

TestFlight to the rescue! (for iOS)

Page 52: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 53: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build
Page 54: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Hockey App to the rescue! (for Android)

Page 55: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Automating the Build AND Distribution

Page 56: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Goals

Push button “deploy”

Continuous Integration

Reduce TTHN (Time to HackerNews)

Page 57: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Xcode

Page 58: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Xcode Command Line Toolsxcrun!

xcodebuild!

agvtool!

Page 59: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Shenzhen

Ruby gem that creates .ipa files !

Distributes to TestFlight !

Part of nomad (http://nomad-cli.com/)

Page 60: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

gem install shenzhen

Page 61: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

ipa build -s {{projectName}} -c Release

Page 62: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

ipa distribute \——api_token {{apiToken}} \——team_token {{teamToken}} \——lists "Core" --notes {{notes}} \--notify --replace

Page 63: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Eclipse

Page 64: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

ant release

Page 65: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

mv bin/{{AppName}}.apk \~/Dropbox/Builds/{{appName}}.apk

Page 66: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

More Automation

Page 67: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

configure api endpoint

add build information

concatenate/minify

compile templates

compass compile

move files to xcode

move files to eclipse

Grunt Tasks for JS Code

Page 68: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

configure xcode project bundle id to be branch name

configure xcode project app name to be branch name

configure xcode project build id to be commit revision

build xcode project

distribute app to test flight

build eclipse project

distribute to server for download

Grunt Tasks for Xcode/Eclipse

Page 69: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Cordova CLI does some of this for you, too

Page 70: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

cordova build ios

cordova prepare ios

cordova compile ios

cordova emulate ios

Cordova CLI

Page 71: Automating Your Way out of the Dark Ages: Our Experience with (And Without) PhoneGap Build

Resources[PhoneGap](https://phonegap.com/)

[PhoneGap Build](https://build.phonegap.com/)

[TestFlight](https://testflightapp.com/)

[Hockey App](http://hockeyapp.net/)

[GruntJS](http://gruntjs.com/)

[shenzhen](https://github.com/mattt/shenzhen)

@burinTwitter: