The document outlines the functionalities and architecture of Appcelerator Titanium for developing mobile applications using JavaScript. It discusses components such as the JavaScript source code, proxy objects that connect JavaScript and native code, and the use of Alloy for MVC architecture. The document also introduces Tishadow for automated testing, enabling quick feedback across multiple devices and emulators.

1. ANDroid Conference - Ancona
Giorgio Mandolini
g.mandolini@e-xtrategy.net
@g_mandolini
Rapid Application Development con
Titanium Appcelerator

2. ANDroid Conference - Ancona
Ti
Titanum Appcelerator
Titanium is an open source
framework for building native,
hybrid and mobile web apps from
a single JavaScript-based SDK
other
JavaScript

3. ANDroid Conference - Ancona
Yes… JavaScript :-)

4. ANDroid Conference - Ancona
How does it work ?
Application JS
APIs and Optional Modules
Bridge
OS (Android, iOS, other)
other
SDK
3 major components
● JavaScript source code (inlined into a
Java or Objective-C file and compiled as
an encoded string),
● the platform-specific implementation
of the Titanium API in the native
programming language,
● a JavaScript interpreter that will be
used to evaluate code at runtime
http://www.appcelerator.com/blog/2012/05/comparing-
titanium-and-phonegap/

5. ANDroid Conference - Ancona
How does it work ? (2)
● When your application is launched, a JavaScript execution environment
is created in native code and your application source code is evaluated.
● Injected into the JavaScript runtime environment of your application is
what we call “proxy” objects – basically, a JavaScript object which has a
paired object in native code.
● Colloquially we will often refer to “JavaScript land” and “native land” in a
Titanium application, as they are kind of parallel universes to one
another. The proxy object exists both in JavaScript land and native land
and serves as the “bridge” between the two.
http://www.appcelerator.com/blog/2012/05/comparing-titanium-and-phonegap/

6. ANDroid Conference - Ancona
How does it work ? (3)
http://docs.appcelerator.com/titanium/latest/#!/guide/Titanium_Module_Concepts

7. ANDroid Conference - Ancona
Titanium + Alloy

8. ANDroid Conference - Ancona
Anatomia di un progetto Alloy
Model
View
Controller
● Architettura MVC
● Stili CSS like
● Data-bind su Modelli
backbone.js

9. ANDroid Conference - Ancona
tiapp.xml - Il cuore della nostra app
Optional Modules

10. ANDroid Conference - Ancona
Extending API
why?
● Accessing specific OS features
● Leveraging existing native
libraries
● Optimizing critical portions of
the app
● Extending portions of the
Titanium Mobile framework
how?
● Creating one or more native
modules throught the Titanium
Module SDK
● Great flexibility
● Easy to distribute (Open
Source, Binary packages,
Appcelerator Marketplace)
http://www.slideshare.net/omorandi/extending-appcelerator-titanium-mobile-through-native-
modules
© Olivier Morandi - http://titaniumninja.com/

11. ANDroid Conference - Ancona
Run! Ehm… wait!
Lanciamo l’app...
● Android Emulator ? → :-(
● Android Emulator x86 + Intel HAXM ? → not bad!
● Real devices → real feedback, but not so viable
● Genymotion ? → better than Intel HAXM
...ma possiamo fare di meglio!
● Come mettere tutto insieme?
● Come testare (quasi) istantaneamente su più device/emulatori?

12. ANDroid Conference - Ancona
TiShadow comes to the rescue!
tishadow app
● Install once (a few), many runs
tishadow server
● push the app to connected hosts
tishadow cli
● our tool to send commands to
server

13. ANDroid Conference - Ancona
TiShadow: automated test
Jasmine
● BDD
● Assertions
● Synch & Asynch test
tishadow spec
● run tests against connected devices
● tishadow @ spec --update -l nl → some magic :-)

14. ANDroid Conference - Ancona
Demo time