Gruntify your Titanium Workflow

B64825f56e05e6332dd234d013f3de3a?s=47 Frank Eijking
November 05, 2014

Gruntify your Titanium Workflow

Ti Meetup Talk 20014-11-05 (http://www.meetup.com/TitaniumNL/events/192330442/)

This presentation explains the way I personally automated my Titanium build workflow for branding white label apps using Grunt.

For sample code see: https://github.com/karaoak/TiGrunt.Sample

B64825f56e05e6332dd234d013f3de3a?s=128

Frank Eijking

November 05, 2014
Tweet

Transcript

  1. Gruntify your Titanium Workflow

  2. working @medianique @karaoak frankeijking About me

  3. Working mainly with… • Laravel, MySQL, Oracle • Backbone, SASS

    and alotta’ JS • Titanium (since 1.6.x), Alloy (since 2013)
  4. Clients we work for • SkyRadio Group
 (Titanium, Backbone, HTML5)


    SkyRadio, Radio Veronica, MyRadio • AladinFM narrowcasting 
 (Laravel, HTML5, Backbone)
 ESA, Bayer • Thieme-Meulenhoff 
 (Laravel, Backbone, Mocha, Should, Redis, socket.io)
 (+ Ant + Grunt on Jenkins CI server)
  5. Why I use Grunt • Already using it in web

    projects • Independent of an IDE • No more tedious tasks • Less or no errors • To appcelerate my workflow • It’s JavaScript !
  6. OK, but really? • Automatic ‘branding’ of white label apps

    • Consistent (test) APK signing • Automatic version tagging • Automatic deployments (OTA or Installr)
  7. Setup Grunt • gruntjs.com/getting-started • Install node and npm via

    Homebrew (brew.sh) or via the new node package installer (nodejs.org/download) $ sudo npm update -g npm $ sudo npm install -g grunt-cli
  8. Grunt modules I use • grunt-titanium • grunt-contrib-clean • grunt-contrib-copy

    • grunt-shell • grunt-template * • load-grunt-config • load-grunt-tasks • tiapp.xml • time-grunt • grunt-ftp ti-app$ npm install grunt —save-dev ti-app$ npm install grunt-titanium —save-dev
  9. package.json {
 "name": "myapp",
 "version": "0.1.0",
 "description": "My Gruntified Titanium

    App",
 "private": true,
 "author": "Karaoak",
 "devDependencies": {
 "grunt": "~0.4.5",
 "grunt-contrib-clean": "~0.5.0",
 "grunt-contrib-copy": "~0.5.0",
 "grunt-shell": "~0.7.0",
 "grunt-template": "~0.2.3",
 "grunt-titanium": "~0.2.2",
 "load-grunt-config": "~0.10.0",
 "load-grunt-tasks": "~0.6.0",
 "tiapp.xml": "^0.2.0",
 "time-grunt": “~0.3.2”, "grunt-ftp": “~1.0.1”, "jit-grunt": "^0.8.0", "ticons": "0.10.2"
 }
 }
  10. Principles • Keep app configurations DRY and in one(!) place

    • Keep configurations + keystores under version mgmt. • App ids and Ti SDKs should be able to differ between platforms • Enable theming of Classic Ti Apps • Automate app signing per deployType easily • Setup should be simple with little dependencies (personal flavours disclaimer)
  11. How it’s set up • _builds/
 build.options.json • _config/ 


    json configurations + templates + keystores • _grunt/
 commonjs default Grunt tasks • Gruntfile.js
 jit loaded grunt config
 app context read/store (to build.options.json)
 custom tasks using: 
 stored grunt options + app context config (personal flavours disclaimer)
  12. App configurations

  13. Templates

  14. Gruntfile.js + _grunt/

  15. Gruntfile.js + custom tasks

  16. developers.default.json $ ti info Fill these using the above or

    via iPhone Configuration Utility app
  17. Custom tasks • Set the app (brand) context 
 (custom

    tiapp.xml, app/config.json, etc.) • Kick off iOS Simulator + Genymotion for different devices easily • Create iOS Adhoc builds and distribute these automatically • Create production IPAs + APKs
 Jarsign and zipalign by hand using Android tools 
 (via grunt-shell)
  18. grunt-titanium

  19. http://docs.appcelerator.com/titanium/3.0/#!/guide/ Titanium_Command-Line_Interface_Reference

  20. Demo!

  21. Demo #1 $ grunt tiapp —app skyradio —p ios $

    grunt sim $ grunt tiapp —app veronica —p ios $ grunt sim $ grunt test —device 5 $ grunt adhoc $ grunt release $ grunt tiapp —app skyradio —p android $ grunt geny —device s4 $ grunt test —device s4 $ grunt release
  22. Demo #2 $ grunt tiapp —app memory —p ios $

    grunt sim —device 5s $ grunt sim —device ipad-2 $ grunt tiapp —app quiz —p ios $ grunt sim —device 5s $ grunt test —device 5 $ grunt adhoc $ grunt release $ grunt tiapp —app match —p android $ grunt geny —device s4 $ grunt test —device s4 $ grunt release
  23. Alternatives • Create build recipes using Fokke’s TiNy CLI •

    Tony’s tiapp.xml can do more every version var ts = new Date().getTime();
 var tiapp = require('tiapp.xml').load('./tiapp.xml');
 tiapp.setProperty('build.timestamp', ts, 'string');
 tiapp.write(); Example (you add this to custom grunt taks or methods) • Use SublimeText with MattTuttle/sublime-ti-build • Use TitaniumStudio :)
  24. Personal thoughts • Just like your app, your Gruntfile.js is

    a WiP • I don’t think there’s a BEST Grunt setup • Find and create the Grunt tasks that work for you! • You can solve any workflow issue. There is an awesome amount of npm modules available • It’s a Means, not an End
  25. Questions?