Getting Started with Titanium

1http://www.appcelerator.com | Code Strong!

Getting Started With Titanium

Kevin Whinnery

Twitter: @kevinwhinnery | http://kevinwhinnery.com

More Information:

Twitter: @appcelerator | http://appcelerator.com

http://www.appcelerator.com/

http://kevinwhinnery.com/

http://github.com/kwhinnery


Today’s Presentation

•What is Titanium?•Why Titanium?• Architecture and API Overview• Demos:– Your First Project – Desktop Twitter Client– Mobile TwitPic Client– The mobile ‘kitchen sink’

•Q&A



Want to give this talk?

• This presentation is designed for reuse• Great for your company or user group• Slides, Code, Examples, and Notes available at github.com/kwhinnery/MeetupPack• Register for free t-shirts and goodies at appcelerator.com/community/app-u



An Unlikely Hero

• Over a decade, web technologies have become one of the world’s most popular client application technology solutions:– Easy to develop, deploy and maintain– Cross platform– Open standards

•Warts and all, it’s tough to find a developer who has ZERO experience with these tools



If web apps are so great...

...why are we interested in building native applications at all? Well:– They feel responsive– They leverage platform capabilities • Filesystem I/O• Local Database•Mobile: Camera or Accelerometer

– They are or can be ‘always on’– They can be used offline



But my dev shop has...

• An investment in the people, tools, skills, and technology to build web applications• An appreciation for open source and open standards• A need to get market quickly• An aversion to maintaining a codebase per supported platform



If only you could...

• Build fully native apps using web technologies you know today• Build cross platform apps from a shared codebase• Use open source software, based on open standards• Find lots of available development talent to build these apps



Enter Titanium

•Website: http://appcelerator.com• Twitter: http://twitter.com/appcelerator• Source: http://github.com/appcelerator

Titanium is an open source framework for building native desktop and mobile

applications using open web technologies (HTML, CSS, and JavaScript)


http://appcelerator.com/

http://twitter.com/appcelerator

http://github.com/appcelerator


Platforms?

• Desktop: Win32, Mac OS X (Intel), Linux• Mobile: iPhone OS, Android• More to come


10

http://www.appcelerator.com | Code Strong!

License?

• Open Source under Apache 2.0• Commercial training and support services available• More value add services to come (analytics)• Core SDK - always free and open source


11


Titanium “Sweet Spot”

• Data-driven web service clients (Enterprise applications)•Web service mash-ups• Social utilities• Brand affinity• Casual games• Anything requiring cross-platform support


12


More on Titanium

•Web: http://appcelerator.com• Twitter: http://twitter.com/appcelerator• Docs: http://www.codestrong.com• Videos: http://vimeo.com/appcelerator• Source: http://github.com/appcelerator


http://appcelerator.com/

http://twitter.com/appcelerator

http://www.codestrong.com/

http://vimeo.com/appcelerator

http://github.com/appcelerator

13


Desktop Architecture and API Overview


14


Desktop Architecture


15


Desktop User Interface

• Tray and Dock icons• System Notifications• Application Menus• More


16


Media

• Play bundled or remote sound files• System notification (beep)


17


Networking

• HTTPClient (XHR style object)• Socket level access• Built-in IRC chat client


18


Database and Filesystem

•Write files to the local filesystem• Read files from disk• Read file via drag and drop• Use a synchronous or asynch database API


19


Workers

• Spin off worker threads• Communicate asynchronously with the worker through a JavaScript API• Offload long running tasks to keep your app responsive


20


Language Modules

• Language modules are optionally included• Full DOM access• Three currently supported modules:– Ruby– Python– PHP


21


More

• Manage/run processes and applications• Take screenshots• Update your application remotely• Get runtime platform data• More at http://codestrong.com/titanium


http://codestrong.com/titanium

22


Mobile Architecture and API Overview


23


Mobile Architecture


24


MediaStream or package audio and video content


25


More Media...Interact with the iPhone or Android built-in cameras


26


GeolocationUse Geolocation to leverage youruser’s position in the world


27


AccelerometerUse advanced gestures and track movement to create groundbreaking user interfaces


28


Database and File SystemAccess a SQLite Database (synch or asynch) and the platform file system


29


Network

XHR-style object for remote data requests.


30


Native UI ControlsUse native controls through a JavaScript interface.


31


Integrated YQL Support

• YQL - A web service aggregator using open tables• Built in to Titanium.Yahoo namespace


32


Facebook Connect

• Facebook Connect module (currently iPhone only)• Currently support for FQL• More on the way


33


Native iPhone UI

• Tab Bar• Nav Bar• Table View• Alert / Options• Group Views / Text• Many More


34


Native Android UI

• Tab Bar• Table View• Alert / Options• Activity Indicator• Notifications• Many More


35


Common APIsiPhone Table View Android Table View

Same Code Creates Both


36


More APIs

• Platform / OS Data• Application Properties• Logging• Scroll and Image Views• Composite Views• More always coming


37


Still Want More?

• Kitchen Sink - Full API Demo• Codestrong.com has Examples and Guides• http://www.codestrong.com/timobile/samples/


http://www.codestrong.com/timobile/samples/

http://www.codestrong.com/timobile/samples/

38


Titanium Developer

•Developer is a Titanium Application•Projects created/managed via Titanium Developer

•Titanium Developer deploys code to simulators

•Developer also helps with testing and packaging for devices

•Requires sign-up for Appcelerator Network (support, e-mail list, other services)


39


Kicking The Tires

• Your first application– Desktop project layout– Mobile project layout

• Demos– Desktop Twitter Client– Mobile TwitPic Client– Shared library for both– Mobile: Kitchen Sink


40


Next Steps

• Download: appcelerator.com/download• Hack– Docs/Samples: http://www.codestrong.com– Screencasts: http://vimeo.com/appcelerator

• Get Help– http://support.appcelerator.net– IRC Chat - irc.freenode.net / #titanium_app


http://www.codestrong.com/

41


Questions?

Getting Started with Titanium

Technology

Transcript of Getting Started with Titanium