デブサミ2014【13-D-2】川田寛氏...

HTML5がSIに与えた衝撃エンジニアは何を学ぶべきか？

川田寛

#devsumiD13-D-2Developers Summit 2014 Story!

@kawada_hiroshiNTTコムウェア株式会社技術SE部

川田寛 Hiroshi Kawada

・エンタープライズITxWeb標準技術「ふろしき.js」ライター

・技術評論社 Software Design 2014年2月号寄稿　「IT業界はどう変わるのか？」

・翔泳社 Developers Summit 2014 コンテンツ委員

・NTTコムウェア株式会社技術SE部

・html5j エンタープライズ部部長

講演者プロフィール

1985.02.23

HTML5というキーワードについて少しおさらい

Developers Summit 2014 - Story

「テクノロジ」としてのHTML5とは？

HTML5HTML5 ＝

イノベーションパラダイムシフト

ドキュメント記述機能

アプリ実装機能

ドキュメント記述機能

アプリ実装機能

Web標準

他の方法

Web標準

≒


「ムーブメント」としてのHTML5とは？

実現方法の変化

ユーザビリティの変化

プレイヤーの変化

・ソフトウェアアーキテクチャ・Webブラウザ/JavaScriptの進化

・マルチデバイス・アクセシビリティ

・電子書籍、車載(組込み)など

なぜ、HTML5が扱えるようになることが求められているのか？


モバイルの増加が意味することは？

2016年、エンタープライズ分野で、 50%以上のモバイルアプリが

HTML5を活用したハイブリットアプリにhttp://www.gartner.com/ newsroom/id/2324917

2013年2月、Gartnerいわく

モバイルファースへの批判も露骨に… UX or コストという議論が起こる

1年後

http://www.gartner.com/newsroom/id/2324917


マイクロソフトが起こした破壊とは？

OSが生きている間は IE上のアプリも面倒見ます

ソフトウェアライフサイクルの考え方の変化常にアップグレードを要求 IEも同バージョンが3年持たない

IE依存のアプリ作りを許容 Web標準準拠しかダメ

SP1SP1 SP2 SP3SP2 SP3SP2 SP3

IE6～IE10

Windows XP / 7

Web系システム

IE10

Windows 8系

Web系システム

Win8 Win8.1 Win8.2

IE11 IE12


Appleショックは何を変えたのか？

Web標準はドキュメント記述アプリ的な機能は勝手にどうぞ

プラグインベースRIAの封印アプリ的な機能も

Web標準で引き受けます

プラグインやIE独自機能にガンガン依存しましょう

Web標準(HTML5)で汎用的に作りましょう

IE独自

アプリ

Flash Silverlight

アプリアプリ

Webブラウザ

アプリアプリアプリ

Webブラウザ

HTML5の問題点


多様過ぎる情報・・

エンタープライズ？

ゲーム業界？

TV業界？

デザイン業界？

組込み？

電子書籍？

公共向け？

メディアメディアメディアメディア

どこにリーチ？まずはそこを理解


開発プロセス/ツールの不在

・JavaScriptの歴史的背景から来る課題・CSSのメンテナンス

・セキュリティ・アーキテクチャの変化

HTML5はプラットフォーム側から始まった

・設計フェーズでの扱い方

・品質管理方法、対策方法　等

HTML5だけを見ていると何も解決できない！

これから、なにを学ぶべきか？

ツール＋プラットフォーム 2つの知識


ツール・JSフレームワーク・JSライブラリ等

サーバサイドアプリクライアントサイドアプリ

プラットフォーム

ハードウェアハードウェア


オープン系

ミドル・フレームワークフレームワーク/ライブラリ

ツールの理解とは？

ツール

例）脱IEプログラマしたい


プラットフォームへ依存しない開発手法

脱IE特化アプリするには？・Modernizr ・・・ Feature Detectionの考え方を身につける

Webアプリ

Webブラウザ



脱IE特化アプリするには？・Compat Inspector ・・・ IE依存機能は使わない

Webアプリ

Webブラウザ



脱IE特化アプリするには？・modern.IE ・・・ IE8以下は割り切る。マルチブラウザテストする

Webアプリ

Webブラウザ


ツールの選定は奥が深い！！

OSSでは？ベンダ製品では？

Grunt

ColdFusion

ツール＋プラットフォーム 2つの知識


Web標準技術(=HTML5)のことです！

プラットフォーム？

サーバサイドアプリクライアントサイドアプリ


ハードウェアハードウェア


オープン系

ミドル・フレームワークフレームワーク/ライブラリ

ツール


何がどう動くのかを理解する

仕様実装プラットフォーム(ブラウザ等)フレームワーク等

ソースコード


何がどう動くのかを理解する

仕様実装

・canvas？

・Selector API？

・sound要素？

プラットフォーム(ブラウザ等)フレームワーク等

ソースコード


Web標準技術(=HTML5)を学ぶための試験

ちなみに、こんなの作ってます

プラットフォームの本質をつかむ！理解している技術者を客観的に判断できる材料となる！そうなるよう、頑張ってます

ご清聴、ありがとうございました

@kawada_hiroshi

デブサミ2014【13-D-2】川田寛氏...

Technology

Transcript of デブサミ2014【13-D-2】川田寛氏...