Hybrid Web Application Platform Appcelerator Titanium 2010년 9월 18일 토요일
Dec 17, 2014
Hybrid Web Application Platform
Appcelerator Titanium
2010년 9월 18일 토요일
Web Evolution
• 웹은 계속 진화하고 있다.
• 인터넷도 계속 진화하고 있다.
• 3.0을 넘어 4.0 유비쿼터스 웹으로 진화하고 있다.
• HTML5
2010년 9월 18일 토요일
TV
Display Screen
ATM, Kiosk
Home Device
Desktop
NotebookSmart Phone
Door lock
Light
set-top box
Display ui
Chrome OS
Tablet
Ice box
Printer Fax
iPhone
Andorid
Advertisement
iPad
Sub trainDisplay ui
Galaxy Tab
Web Game
Gov2.0
2010년 9월 18일 토요일
Why Hybrid Web App?
• Hand-held Device(smart phone, tablet pc)의 발전
• Web OS(Chrome OS, Palm Web OS) 의 도래
• Home Device(Apple TV, Google TV)로의 확장
• Browser(Chrome, Safari, Firefox extension) 기술의 발전
2010년 9월 18일 토요일
• Introduce
• Development
• Demo
• Appendix
Index
2010년 9월 18일 토요일
Introduction
2010년 9월 18일 토요일
Architecture
Your Application(html, css, javascript,php,python,ruby)
Desktop API Optional Modules
OS - Window, Mac, Linux
UI API
Bridge to OS - JavaScript,Ruby,Python,PHP
2010년 9월 18일 토요일
Architecture
Your Application(html, css, javascript,php,python,ruby)
Phone API Optional Modules
Bridge - JavaScript - Java, Objective-C
OS - Android, iOS
UI API
2010년 9월 18일 토요일
Desktop
Tablet
Mobile
resource : http://www.deshow.net/animal/2008/rabbit_small_animals.html#pic
2010년 9월 18일 토요일
Webkit
HTML
JavaScriptCSS
Kroll
2010년 9월 18일 토요일
Bridge Kroll=
2010년 9월 18일 토요일
Kroll Process is a pyrometallurgical industrial processused to produce metallic titanium
2010년 9월 18일 토요일
Titanium APIs
2010년 9월 18일 토요일
ui APITitanium.UI.*
320 x 480Vertical Resolution
Carrier 12:34 PMWeb Page Title
http://host.domain.tld
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean consectetuer.
Optional instructions for this pane go here
Pane LabelCancel Save
HTML text field
HTML <select>
HTML radio button (off)
HTML radio button (on)
HTML Button
HTML checkbox (off)
HTML checkbox (on)
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean consectetuer.
Option 1 Optional Status
Option 2 Optional Status
Tab ThreeTab One Tab Two
Item 1 ON
Example as a form label
Item 3 Optional Status
Item 2 OFF
Carrier 12:34 PM
rhio.kimBack Button Button
Confirmation MessageOptional explanation of what is the
system is asking
Secondary Primary
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean consectetuer.
Optional instructions for this pane go here
Pane LabelCancel Save
1 2 3 4 5 6 7 8 9 0
- / : ; ( ) $ & @
. , ? ! ’#+=
spaceABC return
”
First Name Example Text here
Last Name Example Text here
Phone Number Example Text here
low high
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean consectetuer.
Item 1 ON
Item 3 Optional Status
Item 4 Optional Status
ICN ICN
Option 1 Optional Status
Option 2 Optional Status
Item 2 OFF
WebDevMobileBack Button
Carrier 12:34 PM
2010년 9월 18일 토요일
Desktop API, Phone APITitanium.Platform
Titanium.FileSystemTitanium.Geolocation
Titanium.GestureTitanium.Contact
Titanium.AccelerometerTitanium.Media
Titanium.Network
Titanium.CodecTitanium.Desktop
Titanium.JSONTitanium.Notification
Titanium.ProcessTitanium.Worker
Titanium.UpdaterManager
2010년 9월 18일 토요일
Optional ModulesTitanium.Analytics
Titanium.MapTitanium.Yahoo
Titanium.Facebook
2010년 9월 18일 토요일
So what’s Titanium?
• Titanium is a rapid application development platform(HTML, CSS and JavaScript)
• The framework also has support for Python, Ruby and PHP
• Seamlessly create desktop web applications(your favorites back-end and front-end web technologies)
• One source Multi platform(Window,MAC,Linux,iOS,Android)
2010년 9월 18일 토요일
Adobe Air Junior?
• free/open source Apache license, for ultimate compatibility with your workflow, and infinite extensibility
• Support Python, Ruby, and without needing to learn Flash or ActionScript
• Cloud publishing features to compile and publish your application for multiple platforms.
• And much more!!
2010년 9월 18일 토요일
How it all works
• Full filesystem access
• Internal SQLite database access
• AJAX is still avaiable, Network API allows to interface with HTTP at a much lower level, open socket connections to other service
• Wrapping Desktop features such as notifications, tray icons, window menu
• HTML5, CSS3, Web APIs
2010년 9월 18일 토요일
Development
2010년 9월 18일 토요일
System Spec
2010년 9월 18일 토요일
Desktop
• Window
• Mac
• Linux
2010년 9월 18일 토요일
Mobile
• iPhoneLastest iPhone SDK 3.2 for iPhone/iPad
• AndroidAndroid SDK - http://developer.android.com/sdk/index.htmlSDK platform Android 1.6 API 4(recommand)
Google APIs package for KitchenSinkJava Development Kit 6(java 1.6)
2010년 9월 18일 토요일
Introduce Interface
2010년 9월 18일 토요일
2010년 9월 18일 토요일
2010년 9월 18일 토요일
2010년 9월 18일 토요일
2010년 9월 18일 토요일
2010년 9월 18일 토요일
2010년 9월 18일 토요일
Usage
2010년 9월 18일 토요일
New Project
2010년 9월 18일 토요일
Launch & Testing
2010년 9월 18일 토요일
Package
2010년 9월 18일 토요일
Distribution
2010년 9월 18일 토요일
Run Emulator
2010년 9월 18일 토요일
Run Emulator
2010년 9월 18일 토요일
Online platform
2010년 9월 18일 토요일
2010년 9월 18일 토요일
2010년 9월 18일 토요일
2010년 9월 18일 토요일
Show Case
2010년 9월 18일 토요일
resource : http://www.appcelerator.com/showcase/applications-showcase/
2010년 9월 18일 토요일
Demo
2010년 9월 18일 토요일
• Usage Demo
• Desktop uTube Deck Demo
• iPhone/iPad KitchenSink Demo
2010년 9월 18일 토요일
Appendix
2010년 9월 18일 토요일
PhoneGap
• http://www.phonegap.com/
2010년 9월 18일 토요일
Corona
• http://www.anscamobile.com/
2010년 9월 18일 토요일
QuickConnect
• http://quickconnect.pbworks.com/
2010년 9월 18일 토요일
Reference
• Appcelerator Titaniumhttp://www.appcelerator.com
• Wikipediahttp://en.wikipedia.org/wiki/Appcelerator_Titanium
• Titanium tutorialhttp://www.sergemeunier.com/blog/tutorials/titanium-tutorials/
• Compare with othershttp://stackoverflow.com/questions/1482586/comparison-between-corona-phonegap-titanium
2010년 9월 18일 토요일
endingAuthor : rhio.kim
@rhiokim
http://rhio.tistory.com
NHN/Ajax UI Developer
FRENDS.kr
2010년 9월 18일 토요일
Thanks );
2010년 9월 18일 토요일