Getting Started with Titanium


Published on

Get started using the Titanium SDK to build native mobile and desktop applications with web technologies.

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Getting Started with Titanium

  1. 1. Getting Started With Titanium <ul><li>Kevin Whinnery </li></ul><ul><li>Twitter: @kevinwhinnery | </li></ul><ul><li>More Information: </li></ul><ul><li>Twitter: @appcelerator | </li></ul> | Code Strong!
  2. 2. Today’s Presentation <ul><li>What is Titanium? </li></ul><ul><li>Why Titanium? </li></ul><ul><li>Architecture and API Overview </li></ul><ul><li>Demos: </li></ul><ul><ul><li>Your First Project </li></ul></ul><ul><ul><li>Desktop Twitter Client </li></ul></ul><ul><ul><li>Mobile TwitPic Client </li></ul></ul><ul><ul><li>The mobile ‘kitchen sink’ </li></ul></ul><ul><li>Q&A </li></ul> | Code Strong!
  3. 3. Want to give this talk? <ul><li>This presentation is designed for reuse </li></ul><ul><li>Great for your company or user group </li></ul><ul><li>Slides, Code, Examples, and Notes available at </li></ul><ul><li>Register for free t-shirts and goodies at </li></ul> | Code Strong!
  4. 4. An Unlikely Hero <ul><li>Over a decade, web technologies have become one of the world’s most popular client application technology solutions: </li></ul><ul><ul><li>Easy to develop, deploy and maintain </li></ul></ul><ul><ul><li>Cross platform </li></ul></ul><ul><ul><li>Open standards </li></ul></ul><ul><li>Warts and all, it’s tough to find a developer who has ZERO experience with these tools </li></ul> | Code Strong!
  5. 5. If web apps are so great... <ul><li>...why are we interested in building native applications at all? Well: </li></ul><ul><ul><li>They feel responsive </li></ul></ul><ul><ul><li>They leverage platform capabilities </li></ul></ul><ul><ul><ul><li>Filesystem I/O </li></ul></ul></ul><ul><ul><ul><li>Local Database </li></ul></ul></ul><ul><ul><ul><li>Mobile: Camera or Accelerometer </li></ul></ul></ul><ul><ul><li>They are or can be ‘always on’ </li></ul></ul><ul><ul><li>They can be used offline </li></ul></ul> | Code Strong!
  6. 6. But my dev shop has... <ul><li>An investment in the people, tools, skills, and technology to build web applications </li></ul><ul><li>An appreciation for open source and open standards </li></ul><ul><li>A need to get market quickly </li></ul><ul><li>An aversion to maintaining a codebase per supported platform </li></ul> | Code Strong!
  7. 7. If only you could... <ul><li>Build fully native apps using web technologies you know today </li></ul><ul><li>Build cross platform apps from a shared codebase </li></ul><ul><li>Use open source software, based on open standards </li></ul><ul><li>Find lots of available development talent to build these apps </li></ul> | Code Strong!
  8. 8. Enter Titanium <ul><li>Website: </li></ul><ul><li>Twitter: </li></ul><ul><li>Source: </li></ul> | Code Strong! Titanium is an open source framework for building native desktop and mobile applications using open web technologies (HTML, CSS, and JavaScript)
  9. 9. Platforms? <ul><li>Desktop: Win32, Mac OS X (Intel), Linux </li></ul><ul><li>Mobile: iPhone OS, Android </li></ul><ul><li>More to come </li></ul> | Code Strong!
  10. 10. License? <ul><li>Open Source under Apache 2.0 </li></ul><ul><li>Commercial training and support services available </li></ul><ul><li>More value add services to come (analytics) </li></ul><ul><li>Core SDK - always free and open source </li></ul> | Code Strong!
  11. 11. Titanium “Sweet Spot” | Code Strong! <ul><li>Data-driven web service clients (Enterprise applications) </li></ul><ul><li>Web service mash-ups </li></ul><ul><li>Social utilities </li></ul><ul><li>Brand affinity </li></ul><ul><li>Casual games </li></ul><ul><li>Anything requiring cross-platform support </li></ul>
  12. 12. More on Titanium <ul><li>Web: </li></ul><ul><li>Twitter: </li></ul><ul><li>Docs: </li></ul><ul><li>Videos: </li></ul><ul><li>Source: </li></ul> | Code Strong!
  13. 13. Desktop Architecture and API Overview | Code Strong!
  14. 14. Desktop Architecture | Code Strong!
  15. 15. Desktop User Interface <ul><li>Tray and Dock icons </li></ul><ul><li>System Notifications </li></ul><ul><li>Application Menus </li></ul><ul><li>More </li></ul> | Code Strong!
  16. 16. Media <ul><li>Play bundled or remote sound files </li></ul><ul><li>System notification (beep) </li></ul> | Code Strong!
  17. 17. Networking <ul><li>HTTPClient (XHR style object) </li></ul><ul><li>Socket level access </li></ul><ul><li>Built-in IRC chat client </li></ul> | Code Strong!
  18. 18. Database and Filesystem <ul><li>Write files to the local filesystem </li></ul><ul><li>Read files from disk </li></ul><ul><li>Read file via drag and drop </li></ul><ul><li>Use a synchronous or asynch database API </li></ul> | Code Strong!
  19. 19. Workers <ul><li>Spin off worker threads </li></ul><ul><li>Communicate asynchronously with the worker through a JavaScript API </li></ul><ul><li>Offload long running tasks to keep your app responsive </li></ul> | Code Strong!
  20. 20. Language Modules <ul><li>Language modules are optionally included </li></ul><ul><li>Full DOM access </li></ul><ul><li>Three currently supported modules: </li></ul><ul><ul><li>Ruby </li></ul></ul><ul><ul><li>Python </li></ul></ul><ul><ul><li>PHP </li></ul></ul> | Code Strong!
  21. 21. More <ul><li>Manage/run processes and applications </li></ul><ul><li>Take screenshots </li></ul><ul><li>Update your application remotely </li></ul><ul><li>Get runtime platform data </li></ul><ul><li>More at </li></ul> | Code Strong!
  22. 22. Mobile Architecture and API Overview | Code Strong!
  23. 23. Mobile Architecture | Code Strong!
  24. 24. Media | Code Strong! Stream or package audio and video content
  25. 25. More Media... | Code Strong! Interact with the iPhone or Android built-in cameras
  26. 26. Geolocation | Code Strong! Use Geolocation to leverage your user’s position in the world
  27. 27. Accelerometer | Code Strong! Use advanced gestures and track movement to create groundbreaking user interfaces
  28. 28. Database and File System | Code Strong! Access a SQLite Database (synch or asynch) and the platform file system
  29. 29. Network | Code Strong! XHR-style object for remote data requests.
  30. 30. Native UI Controls | Code Strong! Use native controls through a JavaScript interface.
  31. 31. Integrated YQL Support <ul><li>YQL - A web service aggregator using open tables </li></ul><ul><li>Built in to Titanium.Yahoo namespace </li></ul> | Code Strong!
  32. 32. Facebook Connect <ul><li>Facebook Connect module (currently iPhone only) </li></ul><ul><li>Currently support for FQL </li></ul><ul><li>More on the way </li></ul> | Code Strong!
  33. 33. Native iPhone UI <ul><li>Tab Bar </li></ul><ul><li>Nav Bar </li></ul><ul><li>Table View </li></ul><ul><li>Alert / Options </li></ul><ul><li>Group Views / Text </li></ul><ul><li>Many More </li></ul> | Code Strong!
  34. 34. Native Android UI <ul><li>Tab Bar </li></ul><ul><li>Table View </li></ul><ul><li>Alert / Options </li></ul><ul><li>Activity Indicator </li></ul><ul><li>Notifications </li></ul><ul><li>Many More </li></ul> | Code Strong!
  35. 35. Common APIs | Code Strong! iPhone Table View Android Table View Same Code Creates Both
  36. 36. More APIs <ul><li>Platform / OS Data </li></ul><ul><li>Application Properties </li></ul><ul><li>Logging </li></ul><ul><li>Scroll and Image Views </li></ul><ul><li>Composite Views </li></ul><ul><li>More always coming </li></ul> | Code Strong!
  37. 37. Still Want More? <ul><li>Kitchen Sink - Full API Demo </li></ul><ul><li> has Examples and Guides </li></ul><ul><li> </li></ul> | Code Strong!
  38. 38. Titanium Developer <ul><li>Developer is a Titanium Application </li></ul><ul><li>Projects created/managed via Titanium Developer </li></ul><ul><li>Titanium Developer deploys code to simulators </li></ul><ul><li>Developer also helps with testing and packaging for devices </li></ul><ul><li>Requires sign-up for Appcelerator Network (support, e-mail list, other services) </li></ul> | Code Strong!
  39. 39. Kicking The Tires <ul><li>Your first application </li></ul><ul><ul><li>Desktop project layout </li></ul></ul><ul><ul><li>Mobile project layout </li></ul></ul><ul><li>Demos </li></ul><ul><ul><li>Desktop Twitter Client </li></ul></ul><ul><ul><li>Mobile TwitPic Client </li></ul></ul><ul><ul><li>Shared library for both </li></ul></ul><ul><ul><li>Mobile: Kitchen Sink </li></ul></ul> | Code Strong!
  40. 40. Next Steps <ul><li>Download: </li></ul><ul><li>Hack </li></ul><ul><ul><li>Docs/Samples: </li></ul></ul><ul><ul><li>Screencasts: </li></ul></ul><ul><li>Get Help </li></ul><ul><ul><li> </li></ul></ul><ul><ul><li>IRC Chat - / #titanium_app </li></ul></ul> | Code Strong!
  41. 41. Questions? | Code Strong!