Case Study: ReallyLateBooking, Appcelerator and CoffeeScript

Ticonf.eu 2013 talk about mobile app ReallyLateBooking and how it was developed using Appcelerator and CoffeeScript

Transcript

1. Case Study: Building Apps with Appcelerator and CoffeeScript Roberto Gil Del Sol domingo, 24 de febrero de 13
2. @robertogds • Co-Founder / CEO ReallyLateBooking. • Host Madrid Appcelerator Titanium Meetup Group • Professional Software developer since 1998 So who am I? Pascal -> C -> C++ -> Perl -> Java -> Javascript -> CoffeeScript domingo, 24 de febrero de 13
3. @robertogds • Mobile application for booking hotels on the same day with big discounts. • Last Minute hotels. • iOS, Android, HTML versions What is ReallyLateBooking? domingo, 24 de febrero de 13
4. @robertogds + 200.000 Downloads (App Store + Google Play) + 30.000 Registered users #1 App Store Spain (Overall and Travel category) Featured by Apple : App of the week, “New and Noteworthy” -> We are raising money! Milestones domingo, 24 de febrero de 13
5. @robertogds • SeedRocket Madrid Winners • AppCircus Compostela Winners • TechCity London Finalists • SeedCamp Barcelona Finalists • WebSummit Dublin Finalists Awards domingo, 24 de febrero de 13
6. @robertogds • Only 2 developers. (Back-end and Front-end) • Started Jun 2011 • iOS release launched 1 month later. • Android release launched 2 months later. Our secret: How we did it? Appcelerator + CoffeeScript domingo, 24 de febrero de 13
7. @robertogds Front-end: Native iOS and Android apps, REST consumer. (Appcelerator + CoffeeScript) Back-end: GAE, Play Framework (JAVA), REST API (JSON). RLB Architecture domingo, 24 de febrero de 13
8. @robertogds • Conceived by Jeremy Ashkenas in 2009 (creator of Backbone.js) • “Javascript with Ruby-like syntax” • Programs can be written with less code without sacrificing runtime performance. • It compiles into clean JavaScript JSLint compliant • The Golden Rule: “it’s just JavaScript” What is CoffeeScript? domingo, 24 de febrero de 13
9. @robertogds CoffeeScript the good parts
   B.>@./82'6 ( 0>2.@2'./82)62CF
   
   1.@.+,
   
   @;<
   G
   
   @./82 .11B2:@"6?@2:2>08607 3A:0@6;:2F
   
   632 ?;A>02 61>29;B2A@@;:F
   
   
   @./82 1282@2%;C2 6:12D
   
   G
   
   
   G • Nice Syntax • Don’t need to declare variables domingo, 24 de febrero de 13
10. @robertogds CoffeeScript the good parts
    B.>@./82'6 ( 0>2.@2'./82)62CF
    
    1.@.+,
    
    @;<
    G
    
    @./82 .11B2:@"6?@2:2>08607 3A:0@6;:2F
    
    632 ?;A>02 61>29;B2A@@;:F
    
    
    @./82 1282@2%;C2 6:12D
    
    G
    
    
    G • Nice Syntax • Don’t need to declare variables domingo, 24 de febrero de 13
11. @robertogds CoffeeScript the good parts
    @./82'6 ( 0>2.@2'./82)62C
    
    1.@.+,
    
    @;<
    
    
    @./82 .11B2:@"6?@2:2>08607 2 
    
    632 ?;A>02 616?>29;B2A@@;:
    
    
    @./82 1282@2%;C2 6:12D
    
    
    
    • Nice Syntax • Don’t need to declare variables domingo, 24 de febrero de 13
12. @robertogds CoffeeScript the good parts • Arrays comprehension 0A/2?9.@5 0A/2:A93;>:A96:86?@ >2?A8@6@29 :.923;>6@296:.>>.E >2?A8@6@293;>6@296:.>>.EC52:6@29 :.926?@2?@ domingo, 24 de febrero de 13
13. @robertogds CoffeeScript the good parts • Arrays comprehension B.>0A/2? :A9 0A/2?3A:0@6;:F B.>-6 -82: ->2?A8@? ->2?A8@?+, 3;>-6 -82:86?@ 82:4@5-6-82:-6 F :A986?@+-6, ->2?A8@? <A?59.@5 0A/2:A9 G >2@A>:->2?A8@? G domingo, 24 de febrero de 13
14. @robertogds CoffeeScript the good parts • Private by default *6:1;C>2=A6>2A6 <<860.@6;:*6:1;C './>;A<>2=A6>2A6 <<860.@6;:'./>;A< :2C'./>;A<*6:1;C ;<2: domingo, 24 de febrero de 13
15. @robertogds CoffeeScript the good parts • Private by default 2:2>.@21/E;3322&0>6<@   3A:0@6;:F B.>'./>;A< *6:1;C *6:1;C>2=A6>2A6 <<860.@6;:*6:1;C './>;A<>2=A6>2A6 <<860.@6;:'./>;A< :2C'./>;A<*6:1;C ;<2: G 0.88@56? domingo, 24 de febrero de 13
16. @robertogds CoffeeScript the good parts • Strict comparisons •== vs === H@>A2I@>A2 HI3.8?2 HI H I HI3.8?2 domingo, 24 de febrero de 13
17. @robertogds CoffeeScript the good parts • Strict comparisons •== vs === H@>A2I@>A2 @>A2 HI3.8?2 @>A2 HI @>A2 H I @>A2 HI3.8?2 @>A2 domingo, 24 de febrero de 13
18. @robertogds CoffeeScript the good parts • Strict comparisons • == vs === • CoffeeScript “is” operator: always (===) H@>A2I6?@>A2 3.8?2 H@>A2I6?H@>A2I @>A2 HI6?3.8?2 3.8?2 HI6? 3.8?2 6? @>A2 HI6?3.8?2 3.8?2 domingo, 24 de febrero de 13
19. @robertogds CoffeeScript the good parts • Existential operator (?) .82>@ 7:2C6@6328B6? if (typeof elvis !== "undefined" && elvis !== null) { alert("I knew it!"); } if foo?.bar then console.log foo.bar if (typeof foo !== “undefined” && !== null && foo.bar) <2>?;::2C$2>?;:H%;/2>@;I H68I domingo, 24 de febrero de 13
20. @robertogds CoffeeScript the good parts • String interpolation: :.92H%;/2>@;I 0;:?;82 8;4H;8.F:.92GI H;8.%;/2>@;I • You can put real code in there: :.92H%;/2>@;I 0;:?;82 8;4H;8.F:.92 @;(<<2>.?2GI H;8.%#%'#I domingo, 24 de febrero de 13
21. @robertogds CoffeeScript the good parts • Classes: 08.??$2>?;: 0;:?@>A0@;>36>?@-:.92 8.?@-:.92  @56? 36>?@-:.9236>@?-:.92 @56? 8.?@-:.928.?@-:.92 3A88-:.92  HF@56? 36>?@-:.92GF@56? 8.?@-:.92GI domingo, 24 de febrero de 13
22. @robertogds CoffeeScript the good parts • Classes: 08.??$2>?;: 0;:?@>A0@;>36>?@-:.92 8.?@-:.92  @56? 36>?@-:.9236>@?-:.92 @56? 8.?@-:.928.?@-:.92 3A88-:.92  HF@56? 36>?@-:.92GF@56? 8.?@-:.92GI domingo, 24 de febrero de 13
23. @robertogds CoffeeScript the good parts • Classes: 08.??$2>?;: 0;:?@>A0@;>36>?@-:.92 8.?@-:.92  36>?@-:.9236>@?-:.92 8.?@-:.928.?@-:.92 3A88-:.92  HF36>?@-:.92GF8.?@-:.92GI domingo, 24 de febrero de 13
24. @robertogds CoffeeScript the good parts • Classes: 08.??$2>?;: 0;:?@>A0@;>36>?@-:.92 8.?@-:.92  36>?@-:.9236>@?-:.92 8.?@-:.928.?@-:.92 3A88-:.92  HF36>?@-:.92GF8.?@-:.92GI domingo, 24 de febrero de 13
25. @robertogds CoffeeScript the good parts • Classes: 08.??$2>?;: 0;:?@>A0@;>36>?@-:.92 8.?@-:.92  3A88-:.92  HF36>?@-:.92GF8.?@-:.92GI domingo, 24 de febrero de 13
26. @robertogds CoffeeScript the good parts • Classes and inheritance 08.??$2>?;: 0;:?@>A0@;>36>?@-:.92 8.?@-:.92  3A88-:.92  HF36>?@-:.92GF8.?@-:.92GI 08.??9<8;E222D@2:1$2>?;: 0;:?@>A0@;>36>?@ 8.?@ @6@82  ?A<2>36>?@ 8.?@ 3A88-:.92  HF?A<2>G F@6@82G ?@2B2:2C9<8;E22H&@2B2I H!;/?I I#I 0;:?;82 8;4?@2B2 3A88-:.92 &@2B2!;/? # domingo, 24 de febrero de 13
27. @robertogds How to use it with Titanium? 1. Installing CoffeeScript. You need Node.js and npm (node package manager): $ npm install -g coffee-script 2. Create new Titanium Project and add build.sh file to compile the *.coffee files domingo, 24 de febrero de 13
28. @robertogds Configuring your Project domingo, 24 de febrero de 13
29. @robertogds Using reusable components CoffeeScript Classes -> Common JS Modules domingo, 24 de febrero de 13
30. @robertogds Learn More: TitanTodo JavaScript version: https://github.com/robertogds/titantodo CoffeeScript version: https://github.com/robertogds/TitanTodo-Coffee Inspired by: http://addyosmani.github.com/todomvc/ Really Simple JavaScript and CoffeeScript App domingo, 24 de febrero de 13
31. @robertogds Thank you for listening! domingo, 24 de febrero de 13