Post on 08-Sep-2014
description
Building Cross Platform Mobile Apps: An Introduction to Appcelerator Titanium
Adam PaxtonBarcamp Cancun July 31, 2014
Hello
• Freelance Mobile Developer, Polanco Media, LLC
• 4+ years working with Titanium
• TCAD, TCMD certified
• Titanium Titan User Group
• Co-organizer Titanium Cancun Meetup
github.com/adampax@adampax
Titanium Meetup: bit.ly/ticancun
We are:
• Web developers
• Companies with existing developer resources
• Startups
• Someone with an idea
What do we use?
• iOS - Objective C / Swift
• Android - Java
• Mobile Web - HTML5
• Blackberry - Java, BB10 - C++
• Windows 8 Mobile - C# / JavaScript
Another Option: Appcelerator Titanium
• Appcelerator, Inc - Based in Mountain View, CA
• Titanium - Free version for anyone to use
• Appcelerator Platform - Paid version with additional features for enterprises
• Cloud Services - Mobile Backend, both free and paid versions
Titanium
• Cross platform development environment for creating native mobile apps
• Program with JavaScript
• Free and open source
• Not a webview wrapper or app generator - builds native apps
• Builds with platform SDKs
• Android SDK toolset required for Android apps
• Xcode (and a Mac) required for iOS Apps
How does it work?• Write your code in JavaScript
• Code is minified and packaged with with Titanium APIs and JavaScript interpreter (JavaScriptCore for iOS, V8 for Android)
• Ti SDK uses native SDK (Xcode, Android, etc) to package it all up
• JavaScript interpreter executes your code and builds connections to native objects using the Titanium APIs
appcelerator.com/titanium/titanium-sdk/
Pros
• Maintain a single code base across multiple platforms
• 60% to 90% code re-use across platforms
• Use your or your team’s existing JavaScript skills
• Faster ramp up with JavaScript for new developers
• Native interface, native controls, native experience
appcelerator.com/titanium/titanium-sdk/
Cons
• Does not cover entire API for all platforms
• Over 5000 APIs are supported
• You can extend the API to access any additional APIs you need
• Extra layer of abstraction means more to manage
• New feature release / bug fix in iOS / Android — must wait until supported /fixed in Titanium (This is getting faster, often same day as iOS release)
• Potential for bugs in Titanium
appcelerator.com/titanium/titanium-sdk/
Titanium Studio• IDE used to build, test, package and
publish mobile applications across platforms
• Free, based on Eclipse
• Runs on Mac, Windows, Linux
• Code completion, debugger and breakpoints
• Wizards for configuring native SDKs, creating new app projects
• Cloud Services integration
Titanium Command Line Interface
• Node.js-based command-line tool for managing, building, and deploying Titanium projects
• Don’t want to use Eclipse/Studio? Use the CLI with your favorite editor
• SublimeText, Atom VIM, etc.
• titanium build --platform android
docs.appcelerator.com/titanium/latest/#!/guide/Titanium_Command-Line_Interface_Reference
Cloud Services• Collection of pre-built services for handling
Mobile Backend requirements
• Node.js hosting
• API builder (new)
• Integration with Titanium Studio, CLI
• Free version has generous limits for API calls, push notifications.
docs.appcelerator.com/cloud/latest/
The Code - Titanium ‘Classic’• Original syntax for Titanium code
• All UI, data, logic defined in js code
• Directly access Titanium API
• CommonJS modules
var win = Titanium.UI.createWindow({ title: ‘My Window’, backgroundColor: ‘#fff’});!win.open();
The Code - Titanium Alloy• MVC Framework — Model, View, Controller
• Recommended for new projects
• Structure code into separate sections for data, UI, logic
• Models— represent database records, API queries, etc. Based on Backbone.js
• Views — XML to define UI objects, TSS (like CSS) to style them
• Controllers - JavaScript containing logic — what happens when a button is clicked? etc.
Alloy
• Keeps your code cleaner, enabling re-use
• Can still use CommonJS libraries with Alloy. Popular libraries underscore.js, moment.js already included
• Built-ins for conditional code
• TSS styling similar to CSS, easy to setup and re-use styling
• A lot more features
One more thing: Games
• Build games with Titanium + Lanica Platino
• Platino game engine to build 2D and 2.5D mobile games
• iOS and Android
• Free to try
• lanica.co
Final Notes
• Use Titanium for faster mobile development
• Use Alloy for faster Titanium development :)
• Start downloading here: www.appcelerator.com/developers/
• Documentation: docs.appcelerator.com
• Help: developer.appcelerator.com/questions/
• Learn more at Cancun Titanium meetup: bit.ly/ticancun