The Ti gem lets you build Titanium mobile apps better, using Ruby to stich together a polyglot approach using CoffeeScript, Compass, and Sass.

1. Accelerated
MOBILE APP DEVELOPMENT WITH Ti
WYNNNETHERLAND

3. D'oh! Sorry, will have to blind you with science.

5. Isn’t she Sassy, folks?
GET
THE
BOOK.

6. Save 40% and get early access!
sass40
Sadly, sass100 is not a valid code.

7. And you are?

8. So you wanna build a mobile app?

10. Native vs. Web

11. Why native?

19. Obj C Java

20. Titanium

22. SINGLE JAVASCRIPT API

23. COMPILES TO NATIVE CODE

25. OPEN SOURCE!
http://github.com/appcelerator/titanium_mobile

26. Development options

28. After fleeing .NET for the joys of Ruby
I’d rather not use your IDE.

29. Fortunately, there’s a CLI.

30. A quick
DEMO

31. Fortunately, there’s a CLI.
Unfortunately, it’s written in Python.

32. I’m a Rubyist
Why should I care?

33. You'll still need a server API
Rails, Sinatra, etc.

34. Embrace your inner polyglot.

35. COFFEESCRIPT

36. var foo = function () {
foo = () ->
}
I’d rather write this.

37. JavaScript
var button = Titanium.UI.createButton({
title: 'I am a Button',
height: 40,
width: 200,
top: 10
});
button.addEventListener('click', function(e) {
alert("Oooh, that tickles!");
});

38. CoffeeScript
button = Titanium.UI.createButton
title: 'I am a Button'
height: 40
width: 200
top: 10
button.addEventListener 'click', (e) ->
alert "Oooh, that tickles!"

39. JavaScript Frameworks

40. Underscore.js
https://github.com/documentcloud/underscore

41. STYLESHEETS

42. var buttonOne = Titanium.UI.createButton({
title:'I am a Button',
height:40,
width:200,
top:10
});
var buttonTwo = Titanium.UI.createButton({
title:'I am also a Button',
image:'../images/chat.png',
width:200,
height:40,
top:60
});

43. // js
var buttonOne = Titanium.UI.createButton({
id: "buttonOne",
className: "button"
});
var buttonTwo = Titanium.UI.createButton({
id: "buttonTwo",
className: "button"
});
// jss
#buttonOne {
title:'I am a Button';
width:200;
height:40;
top:10
}
#buttonTwo {
title:'I am also a Button';
image:'../images/chat.png';
width:200;
height:40;
top:60
}
.button {
height: 40;
width: 200;
}

44. JSS work like CSS.

45. But I don't even like CSS.

46. Fortunately, there's
SASS & COMPASS

47. #buttonOne {
title: 'I am a Button';
width: 200;
height: 40;
top: 10
}
#buttonTwo {
title: 'I am also a Button';
image: '../images/chat.png';
width: 200;
height: 40;
top: 60
}
.button {
height: 40;
width: 200;
}

48. #buttonOne
title: 'I am a Button'
width: 200
height: 40
top: 10
#buttonTwo
title: 'I am also a Button'
image: '../images/chat.png'
width: 200
height: 40
top: 60
.button
height: 40
width: 200

49. =button
height: 40
width: 200
#buttonOne
+button
title: 'I am a Button'
top: 10
#buttonTwo
+button
title: 'I am also a Button'
image: '../images/chat.png'
top: 60

50. Oh yeah, and there's
Ruby

51. CODE DEEP DIVE

52. Ti GEM

53. gem install ti

54. Generate.

55. ti new <name> <id> <platform>

56. ti new lsrc com.lonestarrubyconf.v iphone

57. ├── Coffeefile
├── Guardfile
├── LICENSE
├── Rakefile
├── Readme.mkd
├── Resources
│ ├── app.js
│ ├── app.jss
│ ├── images
│ │ ├── KS_nav_ui.png
│ │ └── KS_nav_views.png
│ ├── lsrc.js
│ └── vendor
├── app
│ ├── app.coffee
│ └── lsrc
│ ├── api.coffee
│ ├── app.coffee
│ ├── helpers
│ │ └── application.coffee
│ ├── models
│ ├── stylesheets
│ │ ├── app.sass
│ │ └── partials
│ └── views
├── build
├── config
│ └── config.rb
├── docs
├── spec
│ ├── app_spec.coffee
│ ├── helpers
│ ├── models

58. ti generate <model/controller/view> <name>

59. Golf.Views.GamePlay.createScoreCardView = (options) ->
view = Ti.UI.createView (options)
view

60. ti scaffold <window/tabgroup/view> <domain> <name>

61. Compile.

62. ti compile <all/coffee/sass>

63. Build.

64. ti build <all/iphone/android/ipad/desktop/>

65. Ti GEM
@revans @baldrailers
@rupakg

66. Get involved!

67. Testing.

68. Jasmine

69. Jasmine
https://github.com/akahigeg/jasmine-titanium

70. XIB

71. xib2js
https://github.com/daoki2/xib2js

72. js2coffee
http://ricostacruz.com/js2coffee/

73. QUESTIONS?

75. @pengwynn