SlideShare a Scribd company logo
1 of 89
End of Native ?
Sencha Touch : HTML5 + CSS3 + JavaScript
            Web




                                Ext Japan, LLC (@extjapan)

                                               (@naotori)
End of Native or rise of web app
End of Native Application
End of Native Application
•

• HTML5 Web
End of Native Application
•

• HTML5 Web

     Native App      Web App
My iPhone
My iPhone
My iPhone
Web Application
Web Application
•   Web           Web

•   HTML5

•
•   1990



•
•          Web
    •
•   1990



•
•          Web
    •
•   URL

•
•
•
•
•
•
•
•   Time to Market

•
•
•
•
•
•
•
HTML5
HTML5
•
•          API

•   CSS3
HTML5
•   http://www.apple.com/html5/                                  •   http://mrdoob.com/projects/chromeexperiments/ball_pool/

•   http://www.apple.com/html5/showcase/transitions/             •   http://mrdoob.com/119/Zoom_blur_HTML5

•   http://www.apple.com/html5/showcase/typography/              •   http://mrdoob.com/97/Depth_of_Field_HTML5

•   http://www.apple.com/html5/showcase/gallery/                 •   http://mrdoob.com/92/Google_Gravity_HTML5

•   http://www.apple.com/html5/showcase/threesixty/              •   http://onecm.com/projects/canopy/

•   http://www.effectgames.com/demos/canvascycle/                •   http://calinmocanu.webs.com/the_canvas/fish.htm

•   http://tech.kayac.com/data/html5_and_css3/demo/index.html#   •   http://www.andrew-hoyer.com/experiments/cloth/

•   http://www.chromeexperiments.com/                            •   http://www.zynaps.com/jslab.xml?id=envmap

•   http://balldroppings.com/js/                                 •   http://hakim.se/experiments/html5/trail/03/



                                                   Safari/Chrome
•   8

•   HTML5   HTML5
HTML5 ~
HTML5 ~
•   IE9

•         IE6/7/8

•
HTML5 ~
HTML5 ~
•   JavaScript

•   HTML5? CSS3?   ?
HTML5 ~   /
HTML5 ~                              /

•   iOS   Android BlackBerry WebOS

•   Windows Phone
•
•
    API

•
About Sencha
Ext JS is now Sencha
Ext JS is now Sencha
•   2006

•   2007       Ext JS

•   2010   6      VC

•          Sencha       jQTouch Raphaël
Ext JS is now Sencha
•   2006

•   2007       Ext JS

•   2010   6      VC

•          Sencha           jQTouch Raphaël


                    JavaScript
Sencha
Ext JS
Ext GWT
Sencha Touch
Ext Core
Ext Designer
jQTouch
Raphael
Sencha
 Ext Designer


                               Ext Core
                  Ext JS
                               jQTouch

                Sencha Touch
                               Raphael


                 Ext GWT
Sencha
 Ext Designer


                               Ext Core
                  Ext JS
                               jQTouch

                Sencha Touch
                               Raphael


                 Ext GWT
Sencha
 Ext Designer


                               Ext Core
                  Ext JS
                               jQTouch

                Sencha Touch
                               Raphael


                 Ext GWT
Sencha
 Ext Designer   JavaScript

                               Ext Core
                  Ext JS
                               jQTouch

                Sencha Touch
                               Raphael


                 Ext GWT
Sencha
  Ext Designer


                                Ext Core
                   Ext JS
                                jQTouch

                 Sencha Touch
                                Raphael
 Java

                  Ext GWT
JavaScript
JavaScript

•
•   Ext JS

•
•   HTML/CSS/JavaScript



•
DOM
DOM
•   DOM   Document Object Model

•     JavaScript     DOM



•                  DOM
Ext JS
Ext JS
•   HTML

•
•
•
About me
•   2008       Ext Japan @extjapan

•              Sencha

•   Ext JS / Sencha Touch

•   @naotori
Sencha Touch beta
Coming Soon: BlackBerry 6 & WebOS
Demo


                                                                             http://www.bitsoflove.be/
                           http://m.echo2010.com/                            cactusfestival/web/




http://m.skicrystal.com/                            http://nils-dehl.de/m/
WebKit Rocks!
•   HTML5 + CSS3
•   Transforms, Transitions, and
    Animations
•   Canvas
•   SQLite
•   Cache Manifest
•   Geo-Location
WebKit Rocks!
•   HTML5 + CSS3
•   Transforms, Transitions, and
    Animations
•   Canvas
•   SQLite
•   Cache Manifest
•   Geo-Location
•   WebKit
•



•



•   Orientation
•



•



•



•



•          GUI
•



•



    Tap
    Double tap
    Tap and hold
    Swipe
    Pinch
    Drag & drop
•



•   WebKitCSSMatrix
•        GUI
GUI
•   Lists
    Nested

    Grouped

    Sortable

•   Carousel
•   Picker
•   Overlay
•   Toolbars & buttons
•   HTML5
    Audio

    Video

    GeoLocation
<75k
minified & gzipped
FAQ
FAQ

•   Sencha Touch   Ext JS
FAQ

•   Sencha Touch   Ext JS

•   jQuery
FAQ

•   Sencha Touch      Ext JS

•   jQuery

•   AppStore/Android Market
HTML5?
HTML5?
•   HTML5   CSS3
HTML5?
•   HTML5   CSS3

•            HTML5
HTML5?
•   HTML5        CSS3

•                   HTML5

    •       input[type=search] video audio
HTML5?
•   HTML5               CSS3

•                          HTML5

    •              input[type=search] video audio
    •   webstorage session/local
HTML5?
•   HTML5                  CSS3

•                             HTML5

    •                 input[type=search] video audio
    •   webstorage session/local
    •   geolocation
HTML5?
•   HTML5                  CSS3

•                             HTML5

    •                 input[type=search] video audio
    •   webstorage session/local
    •   geolocation


•                                      HTML5
HTML5?
•   HTML5                  CSS3

•                             HTML5

    •                 input[type=search] video audio
    •   webstorage session/local
    •   geolocation


•                                      HTML5

    •   WebSockets?
HTML5?
•   HTML5                  CSS3

•                             HTML5

    •                 input[type=search] video audio
    •   webstorage session/local
    •   geolocation


•                                      HTML5

    •   WebSockets?
    •   SVG?
Sencha Touch

•   Version: 0.95β

•
•   Android

•   API

•
•           ¥9,900/

•
•   GPLv3
• HTML5
• HTML5
• JavaScript+HTML+CSS   iOS   Android
• HTML5
• JavaScript+HTML+CSS   iOS   Android



•   PhoneGap
• HTML5
• JavaScript+HTML+CSS   iOS   Android



•   PhoneGap

•
Objective-C




              Ext Japan, LLC (@extjapan)

                             (@naotori)
Objective-C




  JavaScript
               Ext Japan, LLC (@extjapan)

                              (@naotori)

More Related Content

Similar to End of native?

HTML5 History & Features
HTML5 History & FeaturesHTML5 History & Features
HTML5 History & FeaturesDave Ross
 
Filling the HTML5 Gaps with Polyfills and Shims
Filling the HTML5 Gaps with Polyfills and ShimsFilling the HTML5 Gaps with Polyfills and Shims
Filling the HTML5 Gaps with Polyfills and Shimsreybango
 
WHAT IS HTML5? (at CSS Nite Osaka)
WHAT IS HTML5? (at CSS Nite Osaka)WHAT IS HTML5? (at CSS Nite Osaka)
WHAT IS HTML5? (at CSS Nite Osaka)Shumpei Shiraishi
 
Welcome! RGBA
Welcome! RGBAWelcome! RGBA
Welcome! RGBAEven Wu
 
HTML5 - Let’s make the WEB more powerful
HTML5 - Let’s make the WEB more powerfulHTML5 - Let’s make the WEB more powerful
HTML5 - Let’s make the WEB more powerfulNaga Harish M
 
html5和移动web应用
html5和移动web应用html5和移动web应用
html5和移动web应用麦哥UE
 
HTML5のご紹介
HTML5のご紹介HTML5のご紹介
HTML5のご紹介yoshikawa_t
 
A Holistic Approach to HTML5 Game Design & Development
A Holistic Approach to HTML5 Game Design & DevelopmentA Holistic Approach to HTML5 Game Design & Development
A Holistic Approach to HTML5 Game Design & DevelopmentKarl Bunyan
 
FocusOnLearning Conference 2016 Austin, TX
FocusOnLearning Conference 2016 Austin, TXFocusOnLearning Conference 2016 Austin, TX
FocusOnLearning Conference 2016 Austin, TXKirsten Rourke
 
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There TodayHTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There Todaydavyjones
 
[2010]我有一个梦想
[2010]我有一个梦想[2010]我有一个梦想
[2010]我有一个梦想Twinsen Liang
 
HTML5 Trends + Cascade Server CMS by Uzo Okafor
HTML5 Trends + Cascade Server CMS by Uzo OkaforHTML5 Trends + Cascade Server CMS by Uzo Okafor
HTML5 Trends + Cascade Server CMS by Uzo Okaforhannonhill
 
Mobile App Development
Mobile App DevelopmentMobile App Development
Mobile App DevelopmentChris Morrell
 
Building Pistachio with Sencha Touch 2 (introductory)
Building Pistachio with Sencha Touch 2 (introductory)Building Pistachio with Sencha Touch 2 (introductory)
Building Pistachio with Sencha Touch 2 (introductory)Luis Merino
 
HTML5 and the Mobile Web
HTML5 and the Mobile WebHTML5 and the Mobile Web
HTML5 and the Mobile WebMrJ1971
 

Similar to End of native? (20)

HTML5 History & Features
HTML5 History & FeaturesHTML5 History & Features
HTML5 History & Features
 
Mobile html5
Mobile html5Mobile html5
Mobile html5
 
Filling the HTML5 Gaps with Polyfills and Shims
Filling the HTML5 Gaps with Polyfills and ShimsFilling the HTML5 Gaps with Polyfills and Shims
Filling the HTML5 Gaps with Polyfills and Shims
 
WHAT IS HTML5? (at CSS Nite Osaka)
WHAT IS HTML5? (at CSS Nite Osaka)WHAT IS HTML5? (at CSS Nite Osaka)
WHAT IS HTML5? (at CSS Nite Osaka)
 
Welcome! RGBA
Welcome! RGBAWelcome! RGBA
Welcome! RGBA
 
HTML5 - Let’s make the WEB more powerful
HTML5 - Let’s make the WEB more powerfulHTML5 - Let’s make the WEB more powerful
HTML5 - Let’s make the WEB more powerful
 
Looking into HTML5 + CSS3
Looking into HTML5 + CSS3Looking into HTML5 + CSS3
Looking into HTML5 + CSS3
 
InfoTalk#17 1st
InfoTalk#17 1stInfoTalk#17 1st
InfoTalk#17 1st
 
html5和移动web应用
html5和移动web应用html5和移动web应用
html5和移动web应用
 
HTML5のご紹介
HTML5のご紹介HTML5のご紹介
HTML5のご紹介
 
A Holistic Approach to HTML5 Game Design & Development
A Holistic Approach to HTML5 Game Design & DevelopmentA Holistic Approach to HTML5 Game Design & Development
A Holistic Approach to HTML5 Game Design & Development
 
FocusOnLearning Conference 2016 Austin, TX
FocusOnLearning Conference 2016 Austin, TXFocusOnLearning Conference 2016 Austin, TX
FocusOnLearning Conference 2016 Austin, TX
 
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There TodayHTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
 
WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)WHAT IS HTML5?(20100510)
WHAT IS HTML5?(20100510)
 
[2010]我有一个梦想
[2010]我有一个梦想[2010]我有一个梦想
[2010]我有一个梦想
 
HTML5 Trends + Cascade Server CMS by Uzo Okafor
HTML5 Trends + Cascade Server CMS by Uzo OkaforHTML5 Trends + Cascade Server CMS by Uzo Okafor
HTML5 Trends + Cascade Server CMS by Uzo Okafor
 
Mobile App Development
Mobile App DevelopmentMobile App Development
Mobile App Development
 
Building Pistachio with Sencha Touch 2 (introductory)
Building Pistachio with Sencha Touch 2 (introductory)Building Pistachio with Sencha Touch 2 (introductory)
Building Pistachio with Sencha Touch 2 (introductory)
 
Html5 public
Html5 publicHtml5 public
Html5 public
 
HTML5 and the Mobile Web
HTML5 and the Mobile WebHTML5 and the Mobile Web
HTML5 and the Mobile Web
 

More from Yuki Naotori

120611 html5とか勉強会 st2
120611 html5とか勉強会 st2120611 html5とか勉強会 st2
120611 html5とか勉強会 st2Yuki Naotori
 
101125 sencha con2010報告
101125 sencha con2010報告101125 sencha con2010報告
101125 sencha con2010報告Yuki Naotori
 
SpreadOfficeとSencha Touch
SpreadOfficeとSencha TouchSpreadOfficeとSencha Touch
SpreadOfficeとSencha TouchYuki Naotori
 
Sencha touchのはじめかた
Sencha touchのはじめかたSencha touchのはじめかた
Sencha touchのはじめかたYuki Naotori
 
Sencha touch とyubizo engineで作るネイティブアプリ
Sencha touch とyubizo engineで作るネイティブアプリSencha touch とyubizo engineで作るネイティブアプリ
Sencha touch とyubizo engineで作るネイティブアプリYuki Naotori
 
Ext Designerについて
Ext DesignerについてExt Designerについて
Ext DesignerについてYuki Naotori
 
Ext Direct 入門 II
Ext Direct 入門 IIExt Direct 入門 II
Ext Direct 入門 IIYuki Naotori
 
Ext.util.Observableについて
Ext.util.ObservableについてExt.util.Observableについて
Ext.util.ObservableについてYuki Naotori
 
Ext.Directについて
Ext.DirectについてExt.Directについて
Ext.DirectについてYuki Naotori
 
Ext Jsで柔軟に開発仕事をこなす
Ext Jsで柔軟に開発仕事をこなすExt Jsで柔軟に開発仕事をこなす
Ext Jsで柔軟に開発仕事をこなすYuki Naotori
 
ExtJS 事例  2ちゃんビューアー「Cromartie49」
ExtJS 事例  2ちゃんビューアー「Cromartie49」ExtJS 事例  2ちゃんビューアー「Cromartie49」
ExtJS 事例  2ちゃんビューアー「Cromartie49」Yuki Naotori
 
090422 第10回勉強会(公開用)
090422 第10回勉強会(公開用)090422 第10回勉強会(公開用)
090422 第10回勉強会(公開用)Yuki Naotori
 
Prototyping tool "Degino"
Prototyping tool "Degino"Prototyping tool "Degino"
Prototyping tool "Degino"Yuki Naotori
 
第9回勉強会 開発の基本
第9回勉強会 開発の基本第9回勉強会 開発の基本
第9回勉強会 開発の基本Yuki Naotori
 
第9回勉強会(Ext3.0について)
第9回勉強会(Ext3.0について)第9回勉強会(Ext3.0について)
第9回勉強会(Ext3.0について)Yuki Naotori
 
第8回Ext勉強会プレゼン - 石丸
第8回Ext勉強会プレゼン - 石丸第8回Ext勉強会プレゼン - 石丸
第8回Ext勉強会プレゼン - 石丸Yuki Naotori
 
第8回 Ext JS / Ext GWT 勉強会 - 小堤氏資料
第8回 Ext JS / Ext GWT 勉強会 - 小堤氏資料第8回 Ext JS / Ext GWT 勉強会 - 小堤氏資料
第8回 Ext JS / Ext GWT 勉強会 - 小堤氏資料Yuki Naotori
 

More from Yuki Naotori (20)

120611 html5とか勉強会 st2
120611 html5とか勉強会 st2120611 html5とか勉強会 st2
120611 html5とか勉強会 st2
 
101125 sencha con2010報告
101125 sencha con2010報告101125 sencha con2010報告
101125 sencha con2010報告
 
SpreadOfficeとSencha Touch
SpreadOfficeとSencha TouchSpreadOfficeとSencha Touch
SpreadOfficeとSencha Touch
 
Sencha touchのはじめかた
Sencha touchのはじめかたSencha touchのはじめかた
Sencha touchのはじめかた
 
Sencha touch とyubizo engineで作るネイティブアプリ
Sencha touch とyubizo engineで作るネイティブアプリSencha touch とyubizo engineで作るネイティブアプリ
Sencha touch とyubizo engineで作るネイティブアプリ
 
Ext JS→Sencha
Ext JS→SenchaExt JS→Sencha
Ext JS→Sencha
 
Ext Designerについて
Ext DesignerについてExt Designerについて
Ext Designerについて
 
Ext Direct 入門 II
Ext Direct 入門 IIExt Direct 入門 II
Ext Direct 入門 II
 
Ext JS & HTML5
Ext JS & HTML5Ext JS & HTML5
Ext JS & HTML5
 
Ext.util.Observableについて
Ext.util.ObservableについてExt.util.Observableについて
Ext.util.Observableについて
 
Ext.Directについて
Ext.DirectについてExt.Directについて
Ext.Directについて
 
Ext Jsで柔軟に開発仕事をこなす
Ext Jsで柔軟に開発仕事をこなすExt Jsで柔軟に開発仕事をこなす
Ext Jsで柔軟に開発仕事をこなす
 
ExtJS 事例  2ちゃんビューアー「Cromartie49」
ExtJS 事例  2ちゃんビューアー「Cromartie49」ExtJS 事例  2ちゃんビューアー「Cromartie49」
ExtJS 事例  2ちゃんビューアー「Cromartie49」
 
090422 第10回勉強会(公開用)
090422 第10回勉強会(公開用)090422 第10回勉強会(公開用)
090422 第10回勉強会(公開用)
 
Ext.ux.google
Ext.ux.googleExt.ux.google
Ext.ux.google
 
Prototyping tool "Degino"
Prototyping tool "Degino"Prototyping tool "Degino"
Prototyping tool "Degino"
 
第9回勉強会 開発の基本
第9回勉強会 開発の基本第9回勉強会 開発の基本
第9回勉強会 開発の基本
 
第9回勉強会(Ext3.0について)
第9回勉強会(Ext3.0について)第9回勉強会(Ext3.0について)
第9回勉強会(Ext3.0について)
 
第8回Ext勉強会プレゼン - 石丸
第8回Ext勉強会プレゼン - 石丸第8回Ext勉強会プレゼン - 石丸
第8回Ext勉強会プレゼン - 石丸
 
第8回 Ext JS / Ext GWT 勉強会 - 小堤氏資料
第8回 Ext JS / Ext GWT 勉強会 - 小堤氏資料第8回 Ext JS / Ext GWT 勉強会 - 小堤氏資料
第8回 Ext JS / Ext GWT 勉強会 - 小堤氏資料
 

Recently uploaded

SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero
 
The Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfThe Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfSeasiaInfotech2
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticscarlostorres15106
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Mattias Andersson
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsMiki Katsuragi
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!Manik S Magar
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxNavinnSomaal
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsSergiu Bodiu
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...Fwdays
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLScyllaDB
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024Stephanie Beckett
 

Recently uploaded (20)

SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
 
The Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfThe Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdf
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
DMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special EditionDMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special Edition
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering Tips
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptx
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platforms
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQL
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024
 

End of native?

  • 1.
  • 2. End of Native ? Sencha Touch : HTML5 + CSS3 + JavaScript Web Ext Japan, LLC (@extjapan) (@naotori)
  • 3. End of Native or rise of web app
  • 4. End of Native Application
  • 5. End of Native Application • • HTML5 Web
  • 6. End of Native Application • • HTML5 Web Native App Web App
  • 11. Web Application • Web Web • HTML5 •
  • 12.
  • 13. 1990 • • Web •
  • 14. 1990 • • Web •
  • 15.
  • 16. URL • • •
  • 17.
  • 19.
  • 20. Time to Market • • •
  • 21.
  • 23. HTML5
  • 24. HTML5 • • API • CSS3
  • 25. HTML5 • http://www.apple.com/html5/ • http://mrdoob.com/projects/chromeexperiments/ball_pool/ • http://www.apple.com/html5/showcase/transitions/ • http://mrdoob.com/119/Zoom_blur_HTML5 • http://www.apple.com/html5/showcase/typography/ • http://mrdoob.com/97/Depth_of_Field_HTML5 • http://www.apple.com/html5/showcase/gallery/ • http://mrdoob.com/92/Google_Gravity_HTML5 • http://www.apple.com/html5/showcase/threesixty/ • http://onecm.com/projects/canopy/ • http://www.effectgames.com/demos/canvascycle/ • http://calinmocanu.webs.com/the_canvas/fish.htm • http://tech.kayac.com/data/html5_and_css3/demo/index.html# • http://www.andrew-hoyer.com/experiments/cloth/ • http://www.chromeexperiments.com/ • http://www.zynaps.com/jslab.xml?id=envmap • http://balldroppings.com/js/ • http://hakim.se/experiments/html5/trail/03/ Safari/Chrome
  • 26. 8 • HTML5 HTML5
  • 28. HTML5 ~ • IE9 • IE6/7/8 •
  • 30. HTML5 ~ • JavaScript • HTML5? CSS3? ?
  • 31. HTML5 ~ /
  • 32. HTML5 ~ / • iOS Android BlackBerry WebOS • Windows Phone
  • 33.
  • 34. • • API •
  • 36.
  • 37. Ext JS is now Sencha
  • 38. Ext JS is now Sencha • 2006 • 2007 Ext JS • 2010 6 VC • Sencha jQTouch Raphaël
  • 39. Ext JS is now Sencha • 2006 • 2007 Ext JS • 2010 6 VC • Sencha jQTouch Raphaël JavaScript
  • 40. Sencha Ext JS Ext GWT Sencha Touch Ext Core Ext Designer jQTouch Raphael
  • 41. Sencha Ext Designer Ext Core Ext JS jQTouch Sencha Touch Raphael Ext GWT
  • 42. Sencha Ext Designer Ext Core Ext JS jQTouch Sencha Touch Raphael Ext GWT
  • 43. Sencha Ext Designer Ext Core Ext JS jQTouch Sencha Touch Raphael Ext GWT
  • 44. Sencha Ext Designer JavaScript Ext Core Ext JS jQTouch Sencha Touch Raphael Ext GWT
  • 45. Sencha Ext Designer Ext Core Ext JS jQTouch Sencha Touch Raphael Java Ext GWT
  • 47. JavaScript • • Ext JS •
  • 48.
  • 49. HTML/CSS/JavaScript •
  • 50. DOM
  • 51. DOM • DOM Document Object Model • JavaScript DOM • DOM
  • 53. Ext JS • HTML • • •
  • 55.
  • 56. 2008 Ext Japan @extjapan • Sencha • Ext JS / Sencha Touch • @naotori
  • 59. Demo http://www.bitsoflove.be/ http://m.echo2010.com/ cactusfestival/web/ http://m.skicrystal.com/ http://nils-dehl.de/m/
  • 60. WebKit Rocks! • HTML5 + CSS3 • Transforms, Transitions, and Animations • Canvas • SQLite • Cache Manifest • Geo-Location
  • 61. WebKit Rocks! • HTML5 + CSS3 • Transforms, Transitions, and Animations • Canvas • SQLite • Cache Manifest • Geo-Location
  • 62. WebKit • • • Orientation • • • • • GUI
  • 63. • • Tap Double tap Tap and hold Swipe Pinch Drag & drop
  • 64. • • WebKitCSSMatrix • GUI
  • 65. GUI • Lists Nested Grouped Sortable • Carousel • Picker • Overlay • Toolbars & buttons • HTML5 Audio Video GeoLocation
  • 67. FAQ
  • 68. FAQ • Sencha Touch Ext JS
  • 69. FAQ • Sencha Touch Ext JS • jQuery
  • 70. FAQ • Sencha Touch Ext JS • jQuery • AppStore/Android Market
  • 72. HTML5? • HTML5 CSS3
  • 73. HTML5? • HTML5 CSS3 • HTML5
  • 74. HTML5? • HTML5 CSS3 • HTML5 • input[type=search] video audio
  • 75. HTML5? • HTML5 CSS3 • HTML5 • input[type=search] video audio • webstorage session/local
  • 76. HTML5? • HTML5 CSS3 • HTML5 • input[type=search] video audio • webstorage session/local • geolocation
  • 77. HTML5? • HTML5 CSS3 • HTML5 • input[type=search] video audio • webstorage session/local • geolocation • HTML5
  • 78. HTML5? • HTML5 CSS3 • HTML5 • input[type=search] video audio • webstorage session/local • geolocation • HTML5 • WebSockets?
  • 79. HTML5? • HTML5 CSS3 • HTML5 • input[type=search] video audio • webstorage session/local • geolocation • HTML5 • WebSockets? • SVG?
  • 80. Sencha Touch • Version: 0.95β • • Android • API •
  • 81. ¥9,900/ • • GPLv3
  • 82.
  • 83.
  • 86. • HTML5 • JavaScript+HTML+CSS iOS Android • PhoneGap
  • 87. • HTML5 • JavaScript+HTML+CSS iOS Android • PhoneGap •
  • 88. Objective-C Ext Japan, LLC (@extjapan) (@naotori)
  • 89. Objective-C JavaScript Ext Japan, LLC (@extjapan) (@naotori)