Successfully reported this slideshow.

Appcelerator Titanium Alloy


Published on

Appcelerator Titanium Alloy Framework

Published in: Technology, Education
    Are you sure you want to  Yes  No
    Your message goes here
    Are you sure you want to  Yes  No
    Your message goes here

Appcelerator Titanium Alloy

  1. 1. AlloyPowerful MVC from Appc
  2. 2. Ajenda● What is Alloy● Why Alloy● How to work with Alloy● Examples● Questions
  3. 3. What Is Alloy?● Alloy is built on Node.js, available on npm, and integrated with Titanium Studio● Alloy is an open source MVC framework with the goal of making Titanium development easier, faster, and more scalable
  4. 4. Why Alloy?● Scaffolding generation and advanced tooling● Best Practices● With Alloy, developers can build apps not only faster, but of higher quality, effortlessly leveraging features like compile time validation, advanced code generation, and reusable components.
  5. 5. Alloy Key Features● UI and app logic separation through MVC framework● Develop your apps using XML and JSON● Reusable widgets and templates● Built-in Backbone.js and Underscore.js support● Command Line interface
  6. 6. How to Start?● Alloy Quickstart Guide● Alloy Google Group!forum/appc-ti-alloy● Alloy on Github
  7. 7. Getting StartRequirements● Ti SDK and Studio 2.1 or greater● Node.js 0.6.3 or greater● Support only on OSX 10.6 or greater(Windows and Linux Support Later)Platform Support● Android - 2.2 (API8) or greater● iPad - 4.2 or greater● iPhone - 4.2 or greater● Mobile Web
  8. 8. Install AlloyOnce Titanium and Node.js are installed thenrun the below command from the OSX terminalapp to install Alloy $sudo npm install alloy -g
  9. 9. Sample ProjectObjectives● Create Tab based App● Call XHR request● Display Results
  10. 10. New Alloy Project● Create a new Titanium Mobile Project● Using Terminal change to the directory where the newly created project lives● To set up the project to use Alloy run $alloy new
  11. 11. Directory Structure
  12. 12. views - index.xml
  13. 13. styles - index.tss
  14. 14. controllers - index.js
  15. 15. Create Controller $alloy generate controller rowAbove command will create following files a. controllers/row.js b. views/row.xml c. styles/row.tss
  16. 16. Create Model $alloy generate model todo name:stringactive:booleanAbove command will create following files a. models/todo.js b. models/todo.json c. migrations/201208061357439_todo.js
  17. 17. Code WalkthroughGithub Link: