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

DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDropbox
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdflior mazor
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024The Digital Insurer
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfOverkill Security
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century educationjfdjdjcjdnsjd
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CVKhem
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...Zilliz
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)wesley chun
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWERMadyBayot
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyKhushali Kathiriya
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesrafiqahmad00786416
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodJuan lago vázquez
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxRustici Software
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Jeffrey Haguewood
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingEdi Saputra
 

Recently uploaded (20)

DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdf
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 

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)