100915 HTML5とか勉強会発表資料

•Download as KEY, PDF•

19 likes•4,924 views

Yuki Naotori

Sencha Touchの紹介

Technology

End of Native ?
Sencha Touch : HTML5 + CSS3 + JavaScript
Web

Ext Japan, LLC (@extjapan)

(@naotori)

Ext JS is now Sencha

• jQTouch Raphaël Connect

Ext JS is now Sencha

• jQTouch Raphaël Connect

• Sencha Touch

Ext JS is now Sencha

• jQTouch Raphaël Connect

• Sencha Touch

• VC

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 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

FAQ

• Ext JS4.0 Sencha Touch jQTouch Raphaël

FAQ

• Ext JS4.0 Sencha Touch jQTouch Raphaël

• Sencha Touch jQTouch

FAQ

• Ext JS4.0 Sencha Touch jQTouch Raphaël

• Sencha Touch jQTouch

• jQTouch Raphaël GPL

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

GUI
• Lists
Nested

Grouped

Sortable

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

Video

GeoLocation

FAQ

• Sencha Touch Ext JS

• jQuery

• AppStore/Android Market

FAQ

• Sencha Touch Ext JS

• jQuery

• AppStore/Android Market

• Ext Designer

FAQ

• Sencha Touch Ext JS

• jQuery

• AppStore/Android Market

• Ext Designer

• Windows Phone

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?

Demos
http://twimap.net/
http://github.com/naotori/twimap

3
TwiMap
BookmarkForm
HistoryPanel
MapPanel

Sencha Touch

• Version: 0.95β

•
• Android

• API

•

• Ext JS / Sencha Touch

•
• JavaScript+HTML+CSS iOS Android

• Ext JS / Sencha Touch

•
• JavaScript+HTML+CSS iOS Android

• PhoneGap

Objective-C

JavaScript
Ext Japan, LLC (@extjapan)

(@naotori)

Similar to 100915 HTML5とか勉強会発表資料

html5和移动web应用麦哥UE

Filling the HTML5 Gaps with Polyfills and Shimsreybango

Sencha Touch入門～HTMLとJavascriptだけでスマホ向けアプリ&サイトを作る！～Akiyuki Nomura

Welcome! RGBAEven Wu

Building Pistachio with Sencha Touch 2 (introductory)Luis Merino

Mobile html5ElanaBoehm

HTML5 - Let’s make the WEB more powerfulNaga Harish M

baidu开发者大会 - Web App开发框架介绍以及分析joylite

HTML5 History & FeaturesDave Ross

WHAT IS HTML5? (at CSS Nite Osaka)Shumpei Shiraishi

FocusOnLearning Conference 2016 Austin, TXKirsten Rourke

Workflow RefactoringKevin Cao

Cross platform native development with appcelerator titanium (2014 devnexus)Stephen Feather

Looking into HTML5 + CSS3Christopher Schmitt

Dojo & HTML5Mike Wilcox

WHAT IS HTML5?(20100510)Shumpei Shiraishi

OSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web SimulatorGail Frederick

An Introduction to Microsoft EdgeChris Love

Exploring Ketai Library, Droidconsriram_iyengar

Dive Into HTML5Doris Chen

Similar to 100915 HTML5とか勉強会発表資料 (20)

html5和移动web应用

Filling the HTML5 Gaps with Polyfills and Shims

Sencha Touch入門～HTMLとJavascriptだけでスマホ向けアプリ&サイトを作る！～

Welcome! RGBA

Building Pistachio with Sencha Touch 2 (introductory)

Mobile html5

HTML5 - Let’s make the WEB more powerful

baidu开发者大会 - Web App开发框架介绍以及分析

HTML5 History & Features

WHAT IS HTML5? (at CSS Nite Osaka)

FocusOnLearning Conference 2016 Austin, TX

Workflow Refactoring

Cross platform native development with appcelerator titanium (2014 devnexus)

Looking into HTML5 + CSS3

Dojo & HTML5

WHAT IS HTML5?(20100510)

OSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web Simulator

An Introduction to Microsoft Edge

Exploring Ketai Library, Droidcon

Dive Into HTML5

Recently uploaded

"Federated learning: out of reach no matter how close",Oleksandr LapshynFwdays

E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxnull - The Open Security Community

My INSURER PTE LTD - Insurtech Innovation Award 2024The Digital Insurer

Story boards and shot lists for my a level piececharlottematthew16

Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada

Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos

Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticscarlostorres15106

AI as an Interface for Commercial BuildingsMemoori

Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Wonjun Hwang

APIForce Zurich 5 April Automation LPDGMarianaLemus7

Hot Sexy call girls in Panjabi Bagh 🔝 9953056974 🔝 Delhi escort Service9953056974 Low Rate Call Girls In Saket, Delhi NCR

DMCC Future of Trade Web3 - Special EditionDubai Multi Commodity Centre

SQL Database Design For Developers at php[tek] 2024Scott Keck-Warren

Advanced Test Driven-Development @ php[tek] 2024Scott Keck-Warren

Gen AI in Business - Global Trends Report 2024.pdfAddepto

Connect Wave/ connectwave Pitch Deck PresentationSlibray Presentation

Are Multi-Cloud and Serverless Good or Bad?Mattias Andersson

Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar

Unraveling Multimodality with Large Language Models.pdfAlex Barbosa Coqueiro

Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 3652toLead Limited

Recently uploaded (20)

"Federated learning: out of reach no matter how close",Oleksandr Lapshyn

E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx

My INSURER PTE LTD - Insurtech Innovation Award 2024

Story boards and shot lists for my a level piece

Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024

Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)

Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics

AI as an Interface for Commercial Buildings

Bun (KitWorks Team Study 노별마루 발표 2024.4.22)

APIForce Zurich 5 April Automation LPDG

Hot Sexy call girls in Panjabi Bagh 🔝 9953056974 🔝 Delhi escort Service

DMCC Future of Trade Web3 - Special Edition

SQL Database Design For Developers at php[tek] 2024

Advanced Test Driven-Development @ php[tek] 2024

Gen AI in Business - Global Trends Report 2024.pdf

Connect Wave/ connectwave Pitch Deck Presentation

Are Multi-Cloud and Serverless Good or Bad?

Unleash Your Potential - Namagunga Girls Coding Club

Unraveling Multimodality with Large Language Models.pdf

Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 365

100915 HTML5とか勉強会発表資料

1. End of Native ? Sencha Touch : HTML5 + CSS3 + JavaScript Web Ext Japan, LLC (@extjapan) (@naotori)

3. Ext JS is now Sencha

4. Ext JS is now Sencha • jQTouch Raphaël Connect

5. Ext JS is now Sencha • jQTouch Raphaël Connect • Sencha Touch

6. Ext JS is now Sencha • jQTouch Raphaël Connect • Sencha Touch • VC

7. Sencha Ext JS Ext GWT Sencha Touch Ext Core Ext Designer jQTouch Raphael

8. Sencha Ext Designer Ext Core Ext JS jQTouch Sencha Touch Raphael Ext GWT

9. Sencha Ext Designer Ext Core Ext JS jQTouch Sencha Touch Raphael Ext GWT

10. Sencha Ext Designer Ext Core Ext JS jQTouch Sencha Touch Raphael Ext GWT

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

12. Sencha Ext Designer Ext Core Ext JS jQTouch Sencha Touch Raphael Java Ext GWT

13. FAQ

14. FAQ • Ext JS4.0 Sencha Touch jQTouch Raphaël

15. FAQ • Ext JS4.0 Sencha Touch jQTouch Raphaël • Sencha Touch jQTouch

16. FAQ • Ext JS4.0 Sencha Touch jQTouch Raphaël • Sencha Touch jQTouch • jQTouch Raphaël GPL

17. Sencha Touch beta

18. Coming Soon: BlackBerry 6 & WebOS

19. WebKit Rocks! • HTML5 + CSS3 • Transforms, Transitions, and Animations • Canvas • SQLite • Cache Manifest • Geo-Location

20. WebKit Rocks! • HTML5 + CSS3 • Transforms, Transitions, and Animations • Canvas • SQLite • Cache Manifest • Geo-Location

21. • WebKit • • • Orientation • • • • • GUI

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

23. • • WebKitCSSMatrix • GUI

24. GUI • Lists Nested Grouped Sortable • Carousel • Picker • Overlay • Toolbars & buttons • HTML5 Audio Video GeoLocation

25. <75k miniﬁed & gzipped

26. FAQ

27. FAQ • Sencha Touch Ext JS

28. FAQ • Sencha Touch Ext JS • jQuery

29. FAQ • Sencha Touch Ext JS • jQuery • AppStore/Android Market

30. FAQ • Sencha Touch Ext JS • jQuery • AppStore/Android Market • Ext Designer

31. FAQ • Sencha Touch Ext JS • jQuery • AppStore/Android Market • Ext Designer • Windows Phone

32. HTML5?

33. HTML5? • HTML5 CSS3

34. HTML5? • HTML5 CSS3 • HTML5

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

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

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

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

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

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

41. • ¥9,900/ • • GPLv3

42. Demos http://twimap.net/ http://github.com/naotori/twimap

43.

44.

45. viewport meta/link

46.

47.

48. UI

49.

50.

51. 3 TwiMap BookmarkForm HistoryPanel MapPanel

52. “xtype”

53. MapPanel

54.

55.

56.

57. localStorage

58.

59.

60.

61.

62.

63.

64.

65. Sencha Touch • Version: 0.95β • • Android • API •

66.

67. • Ext JS / Sencha Touch

68. • Ext JS / Sencha Touch •

69. • Ext JS / Sencha Touch • • JavaScript+HTML+CSS iOS Android

70. • Ext JS / Sencha Touch • • JavaScript+HTML+CSS iOS Android • PhoneGap

71. Objective-C JavaScript Ext Japan, LLC (@extjapan) (@naotori)

Editor's Notes

&#x6700;&#x521D;&#x306B;&#x30D6;&#x30E9;&#x30F3;&#x30C9;&#x5909;&#x66F4;&#x306B;&#x3064;&#x3044;&#x3066;&#x7C21;&#x5358;&#x306B;&#x8AAC;&#x660E;
jQTouch&#x3001;Raphael&#x306E;&#x30C7;&#x30E2;
jQTouch&#x3001;Raphael&#x306E;&#x30C7;&#x30E2;
jQTouch&#x3001;Raphael&#x306E;&#x30C7;&#x30E2;
&#x4ECA;&#x65E5;&#x306F;jQTouch&#x306E;&#x8A71;&#x3082;&#x3042;&#x308B;&#x307F;&#x305F;&#x3044;&#x306A;&#x306E;&#x3067;&#x3001;&#x30E9;&#x30A4;&#x30BB;&#x30F3;&#x30B9;&#x306B;&#x3064;&#x3044;&#x3066;&#x8A71;&#x3092;&#x3057;&#x3066;&#x304A;&#x304D;&#x307E;&#x3059;
&#x4ECA;&#x65E5;&#x306F;jQTouch&#x306E;&#x8A71;&#x3082;&#x3042;&#x308B;&#x307F;&#x305F;&#x3044;&#x306A;&#x306E;&#x3067;&#x3001;&#x30E9;&#x30A4;&#x30BB;&#x30F3;&#x30B9;&#x306B;&#x3064;&#x3044;&#x3066;&#x8A71;&#x3092;&#x3057;&#x3066;&#x304A;&#x304D;&#x307E;&#x3059;
&#x4ECA;&#x65E5;&#x306F;jQTouch&#x306E;&#x8A71;&#x3082;&#x3042;&#x308B;&#x307F;&#x305F;&#x3044;&#x306A;&#x306E;&#x3067;&#x3001;&#x30E9;&#x30A4;&#x30BB;&#x30F3;&#x30B9;&#x306B;&#x3064;&#x3044;&#x3066;&#x8A71;&#x3092;&#x3057;&#x3066;&#x304A;&#x304D;&#x307E;&#x3059;
Beta
&#x5168;&#x3066;WebKit&#x30D9;&#x30FC;&#x30B9;
opacity, corners, shadows, gradients &#x2014;&#xA0;rotate, scale, depth, hardware accelerated. Unfortunately, some iPhone specific now. Geo-location + SVG are diff on Android.
opacity, corners, shadows, gradients &#x2014;&#xA0;rotate, scale, depth, hardware accelerated. Unfortunately, some iPhone specific now. Geo-location + SVG are diff on Android.
opacity, corners, shadows, gradients &#x2014;&#xA0;rotate, scale, depth, hardware accelerated. Unfortunately, some iPhone specific now. Geo-location + SVG are diff on Android.
&#x3068;&#x3044;&#x3046;&#x3053;&#x3068;&#x3067;&#x3001;&#x73FE;&#x6642;&#x70B9;&#x3067;&#x306F;WebKit&#x306B;&#x6700;&#x9069;&#x5316;&#x3055;&#x308C;&#x3066;&#x3044;&#x307E;&#x3059; &#x30CD;&#x30A4;&#x30C6;&#x30A3;&#x30D6;&#x30A2;&#x30D7;&#x30EA;&#x4E26;&#x307F;&#x306E;&#x3082;&#x306E;&#x3092;&#x4F5C;&#x308B;&#x306E;&#x306B;&#x5FC5;&#x8981;&#x306A;&#x30AF;&#x30E9;&#x30B9;&#x304C;&#x4E00;&#x901A;&#x308A;&#x305D;&#x308D;&#x3063;&#x3066;&#x3044;&#x307E;&#x3059;
&#x30CD;&#x30A4;&#x30C6;&#x30A3;&#x30D6;&#x306E;&#x30A4;&#x30D9;&#x30F3;&#x30C8;&#x306F;&#x4F7F;&#x3044;&#x306B;&#x304F;&#x3044;&#x306E;&#x3067;&#x3001;
&#x5B9F;&#x969B;&#x306B;&#x30E9;&#x30A4;&#x30D6;&#x30B3;&#x30FC;&#x30C7;&#x30A3;&#x30F3;&#x30B0;&#x3057;&#x3066;&#x307F;&#x308B;
&#x30B5;&#x30F3;&#x30D7;&#x30EB;&#x306E;&#x30C7;&#x30E2;
&#x30A2;&#x30D7;&#x30EA;&#x306E;&#x7D39;&#x4ECB; &#x3053;&#x306E;&#x30D7;&#x30EC;&#x30BC;&#x30F3;&#x7528;&#x306B;&#x4F5C;&#x3063;&#x3066;&#x305F;&#x3089;&#x3001;&#x52E2;&#x3044;&#x4F59;&#x3063;&#x3066;&#x30C9;&#x30E1;&#x30A4;&#x30F3;&#x307E;&#x3067;&#x3068;&#x3063;&#x3066;&#x3057;&#x307E;&#x3063;&#x305F;
Web&#x30A4;&#x30F3;&#x30B9;&#x30DA;&#x30AF;&#x30BF;&#x3092;&#x898B;&#x308B; Web&#x30A4;&#x30F3;&#x30B9;&#x30DA;&#x30AF;&#x30BF;&#x3044;&#x3044;&#x3067;&#x3059;&#x3088; manifest&#x306B;&#x3064;&#x3044;&#x3066;&#x3082;&#x8A00;&#x53CA; &#x30C7;&#x30D7;&#x30ED;&#x30A4;&#x6642;&#x306B;&#x306F;JS&#x30D5;&#x30A1;&#x30A4;&#x30EB;&#x306F;&#x307E;&#x3068;&#x3081;&#x308B;
google map&#x306E;&#x30ED;&#x30FC;&#x30C7;&#x30A3;&#x30F3;&#x30B0;&#x306B;&#x5BFE;&#x5FDC;&#x3059;&#x308B;&#x305F;&#x3081;&#x306B;&#x3053;&#x3046;&#x3044;&#x3046;&#x66F8;&#x304D;&#x65B9;&#x3057;&#x3066;&#x308B;&#xFF08;&#x30AD;&#x30E3;&#x30C3;&#x30B7;&#x30E5;&#x3092;&#x8272;&#x3005;&#x3084;&#x3063;&#x3066;&#x3044;&#x3066;&#xFF09;
google map&#x306E;&#x30ED;&#x30FC;&#x30C7;&#x30A3;&#x30F3;&#x30B0;&#x306B;&#x5BFE;&#x5FDC;&#x3059;&#x308B;&#x305F;&#x3081;&#x306B;&#x3053;&#x3046;&#x3044;&#x3046;&#x66F8;&#x304D;&#x65B9;&#x3057;&#x3066;&#x308B;&#xFF08;&#x30AD;&#x30E3;&#x30C3;&#x30B7;&#x30E5;&#x3092;&#x8272;&#x3005;&#x3084;&#x3063;&#x3066;&#x3044;&#x3066;&#xFF09;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x7D99;&#x627F;&#x3057;&#x3066;&#x4F7F;&#x3046;&#x306E;&#x304C;&#x9244;&#x5247; &#x30AB;&#x30FC;&#x30C9;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x306E;&#x8AAC;&#x660E;&#xFF08;&#x4ED6;&#x306B;&#x3082;&#x8272;&#x3005;&#x306A;&#x30EC;&#x30A4;&#x30A2;&#x30A6;&#x30C8;&#x304C;&#x3042;&#x308B;&#xFF09; xtype&#x306E;&#x8AAC;&#x660E;&#xFF08;JSON&#x3067;&#x30B5;&#x30FC;&#x30D0;&#x30FC;&#x3068;&#x3084;&#x308A;&#x53D6;&#x308A;&#x53EF;&#x80FD;&#x3001;&#x3068;&#x3044;&#x3046;&#x30E1;&#x30EA;&#x30C3;&#x30C8;&#xFF09; dockedItems&#x306E;&#x8AAC;&#x660E;
&#x3053;&#x306E;&#x30A2;&#x30D7;&#x30EA;&#x3067;&#x306F;3&#x3064;&#x306E;&#x30B9;&#x30C8;&#x30A2;&#x3092;&#x4F7F;&#x3063;&#x3066;&#x3044;&#x308B; localstorage&#x3078;&#x306E;&#x683C;&#x7D0D;&#x65B9;&#x6CD5;&#xFF08;Web&#x30A4;&#x30F3;&#x30B9;&#x30DA;&#x30AF;&#x30BF;&#x3092;&#x898B;&#x308B;&#xFF09; &#x30E2;&#x30C7;&#x30EB;&#x306F;&#x30E1;&#x30BD;&#x30C3;&#x30C9;&#x3082;&#x5B9A;&#x7FA9;&#x53EF;&#x80FD;
&#x3053;&#x306E;&#x30A2;&#x30D7;&#x30EA;&#x3067;&#x306F;3&#x3064;&#x306E;&#x30B9;&#x30C8;&#x30A2;&#x3092;&#x4F7F;&#x3063;&#x3066;&#x3044;&#x308B; localstorage&#x3078;&#x306E;&#x683C;&#x7D0D;&#x65B9;&#x6CD5;&#xFF08;Web&#x30A4;&#x30F3;&#x30B9;&#x30DA;&#x30AF;&#x30BF;&#x3092;&#x898B;&#x308B;&#xFF09; &#x30E2;&#x30C7;&#x30EB;&#x306F;&#x30E1;&#x30BD;&#x30C3;&#x30C9;&#x3082;&#x5B9A;&#x7FA9;&#x53EF;&#x80FD;
&#x3053;&#x306E;&#x30A2;&#x30D7;&#x30EA;&#x3067;&#x306F;3&#x3064;&#x306E;&#x30B9;&#x30C8;&#x30A2;&#x3092;&#x4F7F;&#x3063;&#x3066;&#x3044;&#x308B; localstorage&#x3078;&#x306E;&#x683C;&#x7D0D;&#x65B9;&#x6CD5;&#xFF08;Web&#x30A4;&#x30F3;&#x30B9;&#x30DA;&#x30AF;&#x30BF;&#x3092;&#x898B;&#x308B;&#xFF09; &#x30E2;&#x30C7;&#x30EB;&#x306F;&#x30E1;&#x30BD;&#x30C3;&#x30C9;&#x3082;&#x5B9A;&#x7FA9;&#x53EF;&#x80FD;
&#x3053;&#x306E;&#x30A2;&#x30D7;&#x30EA;&#x3067;&#x306F;3&#x3064;&#x306E;&#x30B9;&#x30C8;&#x30A2;&#x3092;&#x4F7F;&#x3063;&#x3066;&#x3044;&#x308B; localstorage&#x3078;&#x306E;&#x683C;&#x7D0D;&#x65B9;&#x6CD5;&#xFF08;Web&#x30A4;&#x30F3;&#x30B9;&#x30DA;&#x30AF;&#x30BF;&#x3092;&#x898B;&#x308B;&#xFF09; &#x30E2;&#x30C7;&#x30EB;&#x306F;&#x30E1;&#x30BD;&#x30C3;&#x30C9;&#x3082;&#x5B9A;&#x7FA9;&#x53EF;&#x80FD;
&#x3053;&#x306E;&#x30A2;&#x30D7;&#x30EA;&#x3067;&#x306F;3&#x3064;&#x306E;&#x30B9;&#x30C8;&#x30A2;&#x3092;&#x4F7F;&#x3063;&#x3066;&#x3044;&#x308B; localstorage&#x3078;&#x306E;&#x683C;&#x7D0D;&#x65B9;&#x6CD5;&#xFF08;Web&#x30A4;&#x30F3;&#x30B9;&#x30DA;&#x30AF;&#x30BF;&#x3092;&#x898B;&#x308B;&#xFF09; &#x30E2;&#x30C7;&#x30EB;&#x306F;&#x30E1;&#x30BD;&#x30C3;&#x30C9;&#x3082;&#x5B9A;&#x7FA9;&#x53EF;&#x80FD;
&#x3053;&#x306E;&#x30A2;&#x30D7;&#x30EA;&#x3067;&#x306F;3&#x3064;&#x306E;&#x30B9;&#x30C8;&#x30A2;&#x3092;&#x4F7F;&#x3063;&#x3066;&#x3044;&#x308B; localstorage&#x3078;&#x306E;&#x683C;&#x7D0D;&#x65B9;&#x6CD5;&#xFF08;Web&#x30A4;&#x30F3;&#x30B9;&#x30DA;&#x30AF;&#x30BF;&#x3092;&#x898B;&#x308B;&#xFF09; &#x30E2;&#x30C7;&#x30EB;&#x306F;&#x30E1;&#x30BD;&#x30C3;&#x30C9;&#x3082;&#x5B9A;&#x7FA9;&#x53EF;&#x80FD;
autoSave&#x306B;&#x306A;&#x3063;&#x3066;&#x3044;&#x308B;&#x306E;&#x3067;&#x3001;add&#x5F8C;&#x306B;&#x81EA;&#x52D5;&#x7684;&#x306B;localstorage&#x306B;&#x683C;&#x7D0D;&#x3055;&#x308C;&#x308B;
autoSave&#x306B;&#x306A;&#x3063;&#x3066;&#x3044;&#x308B;&#x306E;&#x3067;&#x3001;add&#x5F8C;&#x306B;&#x81EA;&#x52D5;&#x7684;&#x306B;localstorage&#x306B;&#x683C;&#x7D0D;&#x3055;&#x308C;&#x308B;
&#x30A4;&#x30D9;&#x30F3;&#x30C8;&#x9023;&#x643A;&#x304C;&#x91CD;&#x8981;
&#x30A4;&#x30D9;&#x30F3;&#x30C8;&#x9023;&#x643A;&#x304C;&#x91CD;&#x8981;
&#x30A4;&#x30D9;&#x30F3;&#x30C8;&#x9023;&#x643A;&#x304C;&#x91CD;&#x8981;
&#x30A4;&#x30D9;&#x30F3;&#x30C8;&#x9023;&#x643A;&#x304C;&#x91CD;&#x8981;
&#x30A4;&#x30D9;&#x30F3;&#x30C8;&#x9023;&#x643A;&#x304C;&#x91CD;&#x8981;
&#x30A4;&#x30D9;&#x30F3;&#x30C8;&#x9023;&#x643A;&#x304C;&#x91CD;&#x8981;
&#x30A4;&#x30D9;&#x30F3;&#x30C8;&#x9023;&#x643A;&#x304C;&#x91CD;&#x8981;
Beta
&#x30A2;&#x30C3;&#x30D7;&#x30B0;&#x30EC;&#x30FC;&#x30C9;&#x3067;&#x3088;&#x304F;&#x58CA;&#x308C;&#x308B; 9&#x6708;&#x4E2D;&#x306E;&#x30EA;&#x30EA;&#x30FC;&#x30B9;&#x304C;&#x76EE;&#x6A19;&#x3060;&#x3060;

100915 HTML5とか勉強会発表資料

Recommended

Recommended

More Related Content

Similar to 100915 HTML5とか勉強会発表資料

Similar to 100915 HTML5とか勉強会発表資料 (20)

More from Yuki Naotori

More from Yuki Naotori (20)

Recently uploaded

Recently uploaded (20)

100915 HTML5とか勉強会発表資料

Editor's Notes