DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

24
DC Area Appcelerator Titanium Meetup Aaron K. Saunders CEO Clearly Innovative Inc January 2013

description

DC Area Meetup, discussing Appcelerator Alloy, Appcelerator Cloud Services and Appcelerator Node.ACS

Transcript of DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Page 1: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

DC Area Appcelerator Titanium Meetup

Aaron K. SaundersCEO Clearly Innovative Inc

January 2013

Page 2: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Tonight’s Topics

• Who we are & what we do• Appcelerator Alloy Book• Appcelerator Overview• Alloy• Appcelerator Cloud Services• Node.ACS

Page 3: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Who Am I

• CEO Clearly Innovative Inc. mobile development agency specializing in HTML5, javascript & nodejs

• Appcelerator Platform Evangelist• 2+ years of Appcelerator blogging • Working on book with Appcelerator Cloud

Services and Alloy for Wiley & Sons

Page 4: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Why Cross-Platform Mobile Development

• Ability to provide mobile solutions to multiple platforms efficiently– Reduce Time To Market– Reduce Total Project Cost– Reduce Total Project Maintenance

Page 5: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

About Appcelerator

• Open source cross-platform framework• Generates Native UI Components• IOS, Android and Mobile Web/HTML 5

Support from same code base• Blackberry 10 Support in Beta Preview• Windows 8 Phone 2nd half 2013 release

Page 6: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

About Appcelerator: Tools

• Eclipse Based IDE• Code Assist• Integrated Debugger• On device debugging• Integrated device deployment• Integrated cloud services access• Alloy code generation

Page 7: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

About Alloy

Alloy is a new application framework by Appcelerator for Titanium. It provides a MVC framework for developers that are building

Titanium apps.http://docs.appcelerator.com/titanium/latest/#!/guide/Alloy_Framework

Page 8: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Alloy Benefits

• Alloy comes with a clean well defined XML UI markup, style sheets, and reusable widget components.

• Built-in Backbone.js and Underscore.js support

Page 9: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Backbone.js gives structure to web applications by providing models with key-value binding

and custom events, collections with a rich API of enumerable functions, views with

declarative event handling, and connects it all to your existing API over a RESTful JSON

interface.

Page 10: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Simple Alloy Application

Page 11: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Here is the XML for the View

Page 12: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Here is the code for the Controller

Page 13: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Backbone In Alloy

• Models– Keep track of your data

• Collections– Manage lists/arrays of your data

• Sync Adapter(s)– Local Storage, SQL, Properties, extendable

Page 14: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Alloy: Other Features

• Platform specific markup & inline events view files

• Separation of style files in .tss, similar to .css files

• Localization support• Migration support for changes in schema• Customizable parsers

Page 15: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Alloy Models & Collections

• Models inherit from Backbone.Model. NOTE: if the first character of a model is lower case, it will be automatically converted to uppercase for referencing the Model class.

• Collections inherit from Backbone.Collections.• Created a simple Javascript object and it is persisted as an model

Page 16: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Alloy Data-Binding

• Binds model or collection objects to UI Elements

• All elements are not currently supported, but should be by 1.0GA release

• Binding Supports– Filtering– Data Transformation– Global or Local Model & Collection

Page 17: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Alloy Sync Adapter

• Support for persisting application content• Based on common REST verbs– GET > READ– PUT > UPDATE– POST > CREATE– DELETE > DELETE

• Can be integrated with local or remote data stores

Page 18: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Node.ACS

• Built using NodeJS, ExpressJS under the covers• Build and host custom services to extend

Appcelerator Cloud Services (ACS)• Host your existing node.js app/service on the

Appcelerator Cloud• Create Node.ACS apps directly from TiStudio

http://nodeacs.cloud.appcelerator.com/guides/quickstart

Page 19: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Appcelerator Cloud Services

Page 20: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Appcelerator Cloud Services: Pricing

Page 21: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Downloads for Getting Started with Alloy

• Official Appcelerator Alloy Documentation– http://docs.appcelerator.com/titanium/latest/#!/guide/

Alloy_Framework

• Quick Start: bit.ly/alloyqs

• TiStudio/TiSDK 3.0– http://preview.appcelerator.com/studio/

• More Information– Wiki docs: bit.ly/alloy_docs– Google Groups: bit.ly/alloy_group– Github: github.com/appcelerator/alloy

Page 23: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Appcelerator & Kinvey Integration

https://github.com/aaronksaunders/todolist.alloy.kinvey

LOOK AT SOME CODE?

Page 24: DC Titanium User Group Meetup: Appcelerator Titanium Alloy jan2013

Aaron K SaundersTwitter: @aaronksaundersblog: http://blog.clearlyinnovative.comFacebook: https://www.facebook.com/ClearlyInnovativeIncGithub : https://github.com/aaronksaunders/SlideShare: http://www.slideshare.net/aaronksaunders/

1706 R Street, NWWashington, DC 20009

www.clearlyinnovative.com