Get Up and Running with Titanium and Backbone.js

The following assumes you have the iPhone SDK installed and Xcode properly configured on your OS X computer. In the future I may update this post to be compatible with Android and or Linux

So, apparently, you want to try Appcelerator Titanium. I’m not really sure why you want to do this, but this tutorial will get you started.

I wrote a tool to manage Titanium SDK versions. This tool requires node.js. If you don’t already have node installed, you can just download it from nodejs.org and run

$ ./configure
$ make
$ sudo make install

Once you have node installed, you’ll have to install my tool. It’s called tsm and it allows you to download and install Titanium SDK versions easily. Install it with npm like so:

$ sudo npm -g install tsm

The -g option to npm (the node package manager) installs the package globally. You’ll need to do this as the tsm bin (or a symlink to it) must be put in your PATH by npm.

Now, you can run it like so:

$ tsm ls

This command will hit the Appcelerator build server and check to see what sdk versions are available to be installed. You’ll need to install the latest available stable version. At the time of writing, this is 2.0.1. Take a look at the Appcelerator docs site and see what version is right underneath SDK Updates. This is the version you want. Install it like so:

$ tsm install 2.0.1

You’ll see a progressbar tick across as your SDK is downloaded and unzipped for you. When it’s done, you’re ready to rock. Download my backbone.js and Titanium template with git:

$ git clone https://github.com/russfrank/backbone.ti myproject
$ cd myproject
$ git submodule init
$ git submodule update

Now, try running the project:

$ tsm run 2 run --platform=iphone

and the sample backbone.js app should pop up in the simulator.

What did I just do?

Well, first, you used tsm to install an SDK version. Then, you cloned the repository where I keep a backbone.js skeleton project. You had to initialize git-submodule because underscore.js and backbone.js were submoduled out. Then, you used tsm run to run the titanium.py script that came with a particular version of Titanium.

tsm run takes one argument; the rest of the arguments are passed straight to the Titanium command line tool. The one argument it takes is a version selector. You selected version 2, which probably matched the sdk version you grabbed above.

Moving Forward

Eventually I will write some tutorials about how to best use Backbone.js with Titanium. For now, I’d recommend setting up a Backbone.View with just what’s needed for display; any logic that will work on any platform should not go in the View, but a Controller class. This way, you can write a View for each platform and just include the one you need for a particular platform.

You can also create a blank project with

$ tsm run 2 create --platform=iphone,ipad,android --type=project --name=myapp --id=com.my.app

if you do not wish to use Backbone.js at all.