HTML5 Conference
2017年9月24日(日)AM10:00〜
東京電機大学 千住キャンパス

セッション

6トラック30セッションで開催します。
なお、セッション時間や内容は予告なく変更することがあります。ご了承ください。

タイムテーブル

時間ホール(1号館2F)#html5j_hルームA(5号館2F)#html5j_aルームB(5号館3F)#html5j_bルームC(5号館3F)#html5j_cルームD(5号館3F)#html5j_dルームE(5号館3F)#html5j_e
10:00 - 10:50

基調講演

※ 基調講演はホール会場で行います。 定員500名(先着順)

詳細を見る
11:20 - 12:00

Nintendo SwitchとWeb

詳細を見る

Deep dive into TypeScript

詳細を見る

Microservices入門

詳細を見る

実践 WebRTC 〜最新事例と開発ノウハウの紹介〜

詳細を見る

続・Webエンジニアのためのスマートホームハック ~ Node.js で IoT プロトコルハック

詳細を見る

Webフォント最新事情2017~導入事例も一挙紹介~

詳細を見る
お昼休み(80分)
【ルームA】先着198名に無料でお弁当を配布します!
カンファレンススポンサーによるライトニングトーク大会
※ 教室内ではお食事できませんのでご注意ください。
13:20 - 14:00

最近の Web パフォーマンス改善について知っておきたいコト

詳細を見る

これからはじめるAngular

詳細を見る

大規模運用で見えるWebプロトコルの理想と現実、そして今後

詳細を見る

TV・車・ゲームに搭載されているブラウザってどうなってるの?

詳細を見る

WebGL、実践編

詳細を見る

Webと出版が融合する新しい標準 Web Publications〈ウェブ出版物〉ができることで、Webと本の未来はどうなる?

詳細を見る
休憩(20分)
14:20 - 15:00

Web技術でネイティブアプリを開発する話

詳細を見る

ECMAScript and Babel's role

詳細を見る

これさえあれば大丈夫!Visual Studio Code 徹底解説!

詳細を見る

AMPで加速するモバイルウェブアプリケーション

詳細を見る

デザインカンプの限界 - Adobe XDで実現するプロトタイプ駆動ワークフロー

詳細を見る

詳解 WebRTC

詳細を見る
休憩(20分)
15:20 - 16:00

Web 技術とブラウザ ーいま知っておくべき Web 最新動向ー

詳細を見る

React v16 and beyond React Fiber

詳細を見る

“モダン” ウェブアプリケーション 〜アメブロ5ヶ年計画〜

詳細を見る

コンセプトのつくりかた — アイデアをかたちにする技術

詳細を見る

多様なユーザーニーズに応えるフロントエンドデザインパターン〜書籍「インクルーシブ HTML + CSS & JavaScript」より

詳細を見る

WebGLの今とこれから ~今のWeb開発で使うからこそ知っておきたい周辺技術~

詳細を見る
休憩(20分)
16:20 - 17:00

まあまあ最近のCSSと、これからつらくなくなるために(仮)

詳細を見る

The State of Web Components

詳細を見る

ウェブのための次世代決済法

詳細を見る

W3CのWeb標準化: Web開発者は国際標準化の夢を見るか

詳細を見る

WebAssembly MVPまとめと、今の議論の内容からいくつか

詳細を見る

テクニックではなく、今、本気で取り組むべきWebパフォーマンス

詳細を見る
休憩(30分)
17:30 - 18:30

スペシャルセッション(ライトニングトーク大会)

※ スペシャルセッション(ライトニングトーク大会)はホール会場で行います。 定員500名(先着順)

    詳細を見る

    オープニングセッション(10:00-10:50)

    基調講演

    ※ 会場は定員500名(先着順)となります。

    ホール

    11:20 - 12:00

    Nintendo SwitchとWeb

    keywords

      Nintendo Switchで任天堂がWebをどのように活用しているのか紹介致します。またその中で、グローバルに展開しているニンテンドーeショップのフロントエンドについてどういう開発基盤を作ってきたか、プロジェクトの運営とフロントエンドの作り方の観点から紹介致します。

      13:20 - 14:00

      最近の Web パフォーマンス改善について知っておきたいコト

      keywords
      • Web Performance

      みんな大好き Web のパフォーマンス改善について。主にクライアントサイドの視点から、ベーシックな話を少々と、最近の動向を踏まえて開発者が知っておきたいトピックをご紹介します。

      14:20 - 15:00

      Web技術でネイティブアプリを開発する話

      keywords
      • Electron
      • Cordova
      • React Native
      • NativeScript
      • Weex

      Electron、Cordova、React Native、NativeScript、Weex… Web技術を用いたネイティブアプリ開発ツールが広がっています。このセッションではアプリ開発を実際に行いながら、各種ツールの特徴や作り方を解説します。

      15:20 - 16:00

      Web 技術とブラウザ ーいま知っておくべき Web 最新動向ー

      keywords
      • Web標準
      • ブラウザ

      Web 技術とブラウザは進化を続け、Web に新たな革新と機会をもたらし続けています。数週間〜数ヶ月毎に更新される Chrome, Edge, Firefox, Safari でどのような新技術が導入され、どのような機能が廃止されてきたかご存じでしょうか。

      各ブラウザベンダーが最新情報を発信していますが、それをすべて追うのは大変です。本セッションでは昨年からのブラウザ実装状況の変化をまとめ、その中でも注目の技術、ブラウザベンダーや業界の動向、すぐに使える技術と使用に注意が必要な技術などをお伝えします。

      HTML5 の激動を越え、段階的な進化が行われるいま、止め処なく進化を続ける Web とブラウザの最新状況を振り返る機会としていただければ幸いです。

      16:20 - 17:00

      まあまあ最近のCSSと、これからつらくなくなるために(仮)

      keywords
      • CSS

      ブラウザが継続的に進化しており、数年前は夢に思えた機能が実装されてきています。今回はCSSやレイアウトの技術に注目し、それらを使うとどう嬉しいのか、また、それらを使うためにどう変わらなければならないだろうか、最近考えていることをお話します。

      ルームA

      11:20 - 12:00

      Deep dive into TypeScript

      keywords
      • TypeScript
      • ECMAScript

      このセッションでは主にTypeScriptの紹介・Ecmascriptとの関わり方・これからの展望といったお話をさせていただければと思います。

      13:20 - 14:00

      これからはじめるAngular

      keywords
      • Angular

      これからAngularをはじめる上で知っておくべきことについて、Angularの最新動向とベストプラクティスを交えながら解説します。

      14:20 - 15:00

      ECMAScript and Babel's role

      keywords
      • ECMAScript
      • Babel

      A look into the ECMAScript evolution process, how Babel fits into it, and into some upcoming language features.

      ECMAScriptの仕様はどのような手続きを経て進化を続けているのか、Babelはそれをどのようにサポートしているのか、また、ECMAScriptの新しい言語機能についてご紹介します。

      ※ セッションは日本語で行います。

      15:20 - 16:00

      React v16 and beyond React Fiber

      keywords
      • React

      間もなくリリースされる、約1年振りのメジャーバージョンアップであるReact v16の変更点についてと、v16から組み込まれるReact Fiberについて解説します。

      React Fiberとは何なのか、どうしてコア部分の再実装が必要だったのか、その目的や可能性をお話しします。

      16:20 - 17:00

      The State of Web Components

      keywords
      • Web Components
      • Polymer

      ようやくまともに使えるようになりそうな Web Components について、コンセプトと仕様を振り返りつつ周辺ツールやアーキテクチャについてお話します。

      ルームB

      11:20 - 12:00

      Microservices入門

      keywords
      • エンプラ部
      • Microservice
      • SpringBoot

      SPA開発者でも知っておきたいMicroservices。Microservicesの概要とSpringBootを使った作り方、エンプラ系への適用について解説します。

      13:20 - 14:00

      大規模運用で見えるWebプロトコルの理想と現実、そして今後

      keywords
      • HTTP/2
      • QUIC

      大規模なWebサービスを全てHTTPS+HTTP/2化した経験から、運用現場で見えるWebのプロトコルの理想と現実について話をします。

      そしてTLS1.3やQUICなど今後現れる新しいWebプロトコルでサービスはどうなっていくのか、その見込みと課題についても述べます。

      14:20 - 15:00

      これさえあれば大丈夫!Visual Studio Code 徹底解説!

      keywords
      • Visual Studio Code

      Visual Studio Codeは拡張機能を追加することで、さまざまな開発スタイルに対応することができます。本セッションではVisual Studio Codeについて、デモを中心に新機能、既存機能をふくめ、あますところなく使いこなせるよう徹底解説します。

      15:20 - 16:00

      “モダン” ウェブアプリケーション 〜アメブロ5ヶ年計画〜

      keywords
      • Web開発事例

      ウェブアプリケーションを “モダン” な状態に整えておくことは、その品質・モチベーション・人材など様々な点において重要です。このセッションでは、アメブロの “モダン化” 実例にそってその考え方や、技術採用事例、今後の展望をお伝えします。Isomorphic JavaScript (SSRとSPA), AMP, Service Worker, パフォーマンスモニタリング, 早すぎる最適化問題, CDN, HTTPS, HTTP/2, アクセシビリティといった項目に触れる予定です。

      16:20 - 17:00

      ウェブのための次世代決済法

      keywords
      • Web Payments

      今後フォームに代わってウェブ上でのお金の支払い機能を提供する Web Payments についてご紹介します。

      ルームC

      11:20 - 12:00

      実践 WebRTC 〜最新事例と開発ノウハウの紹介〜

      keywords
      • WebRTC
      • Web開発事例

      2017年、WebRTCは幅広いユースケース(コンタクトセンター、教育、IoT、医療、ライブ配信、ゲームなど)で既に活用されています。そしてこの秋、SafariがWebRTCに対応するため、今後も利用シーンは増えていくと予想されています。また、WebRTCのブラウザ実装やAPI仕様の進化は早く、WebRTCに関わる開発者は常に最新情報のキャッチアップすることが必須となっています。

      セッションの前半では、WebRTC活用のヒントを見つけてもらうために、最新事例をいくつか紹介します。後半は、WebRTC開発者向けPaaSの導入支援とテクニカルサポートを約4年間担当してきた自身の経験に基づき、最新のブラウザ実装やAPI仕様にあわせた開発方法や、実際にWebRTCをアプリやサービスに導入するにあたってのティップスなどを紹介します。

      13:20 - 14:00

      TV・車・ゲームに搭載されているブラウザってどうなってるの?

      keywords
      • ブラウザ

      ブラウザはPCやスマートフォンだけでなくテレビ、車載、ゲームと様々な機器に搭載されています。

      数少ない組込ブラウザベンダーならではの苦労やNonPCの世界でのHTML5アプリ開発について紹介します

      14:20 - 15:00

      AMPで加速するモバイルウェブアプリケーション

      keywords
      • AMP

      AMPは公開から現在まで少しずつ着実に進化を遂げています。このセッションではAMPで実現できる機能と、AMPにとどまらないウェブテクノロジーと連携することで、高速なウェブ体験を実現できることを紹介いたします。

      15:20 - 16:00

      コンセプトのつくりかた — アイデアをかたちにする技術

      keywords
      • コンセプト・メイキング

      コンセプト・メイキングは、そんなに難しいことじゃない!

      本講演では、技術系セッションが目白押しの本カンファレンスで、ちょっと異色な「技術」について語ってみたいと思います。

      イベントやコミュニティ、サービスなど、モノ/コトづくりのハードルは今や限りなく下がり、誰もがプロデューサーになれる時代です。そんな時代に必要とされるのは、アイデアをかたちにしてリリースする力ではないでしょうか。

      本講演では、数多くのイベントやコミュニティを企画してきたエンジニアが、自身の経験を元に、「アイデアをかたちにする『技術』」について語ります。イベントやコミュニティを主宰したい、サービスやプロダクトを作りたいと思っている方に、何かのヒントになれば幸いです。

      16:20 - 17:00

      W3CのWeb標準化: Web開発者は国際標準化の夢を見るか

      keywords
      • W3C
      • Web標準

      Webが発明されてから28年。近年では、Webは単なる情報配信サービスを超え、アプリケーションやシステム構築のための共通プラットフォームになってきています。本セッションでは、Web技術国際標準化に取り組むW3Cの活動内容について、「Webとメディア配信」、「Webとクルマ」そして「WebとIoT」といった、Web技術の様々な産業応用についてご紹介するとともに、今後の展望について議論します。

      ルームD

      11:20 - 12:00

      続・Webエンジニアのためのスマートホームハック ~ Node.js で IoT プロトコルハック

      keywords
      • IoT

      昨今、IoT が流行っている割には、通信プロトコルが公開されておらず、Webエンジニアが IoT に関わることは容易ではない。本セッションでは、昨年に引き続き、Webエンジニアでも入手可能な製品で、かつ、プロトコルが公開されたデバイスを厳選し、スマートホームハックに必要なさまざまな家庭内無線方式の概要、各種デバイス操作のためのプロトコルの概要を紹介する。そして、各種 BLE センサーデバイスの情報取得、ネットワークカメラの遠隔操作、自動車の診断情報など、Node.js やブラウザーを使って、どうやってスマートホームをハックできるのかを解説する。

      13:20 - 14:00

      WebGL、実践編

      keywords
      • グラフィクス部
      • WebGL
      • vue.js
      • three.js
      • Shader

      1. WebAppフレームワークとWebGLライブラリ (Vueとthree.js)

      Webアプリケーションフレームワークは、DOMでそのビューを作ることがほとんどです。WebGLやCanvasは一見相性が悪く感じますが、いくつかのポイントを抑えれば、これらの技術はフレームワークとシームレスに利用することができます。このセッションでは、WebGLライブラリーをWebアプリケーションフレームワークと組み合わせて利用する際のポイントをご紹介します。

      2. 今日からはじめるShader(仮)

      Shaderを気軽に始めるためのあれやこれや

      14:20 - 15:00

      デザインカンプの限界 - Adobe XDで実現するプロトタイプ駆動ワークフロー

      keywords
      • デザイン
      • Adobe XD

      印刷業務の延長上で未だにWeb制作の現場でも作り続けられているデザインカンプ。スマホによるトラフィック量の増加、ピクセルパーフェクトの崩壊、という変化の中で、クライアントとの合意や制作チーム内での認識合わせの最適解として、プロトタイプをプロセスに応じて使い分けるワークフローをAdobe XDでどのように実現できそうか検証していきます。

      15:20 - 16:00

      多様なユーザーニーズに応えるフロントエンドデザインパターン〜書籍「インクルーシブ HTML + CSS & JavaScript」より

      keywords

        今秋発売予定の書籍『インクルーシブHTML+CSS & JavaScript』より、Webアプリケーションでよく用いられるUIである商品リスト、絞り込み、登録フォームなどの実装例をご紹介。これらのコードから、動的なウィジェットをアクセシブルに実装するための具体的なパターンを学びます。また、多様なニーズに応えるUIをプロトタイピングするためのインクルーシブ・プロトタイピングという技法についてもご紹介します。

        16:20 - 17:00

        WebAssembly MVPまとめと、今の議論の内容からいくつか

        keywords
        • Web Assembly

        ついにモダンなブラウザーでWebAssembly(WASM)が使える時代がやってまいりました。コンパイラやUnityのようなツールのWASM対応が進んでいることもあって、CやC++、C#の資産をWebというオープンな世界へ展開しやすくなりつつあります。とはいっても、実現済みなのはWASMの世界の一部です。JavaScriptが毎年進化するように、WASMも進化しています。今回の講演では、WASMがすでに達成していること、WASMの利用状況、WASMのこれからの3点について概観します。WASMを追ってない方の助けになれば幸いです。

        ルームE

        11:20 - 12:00

        Webフォント最新事情2017~導入事例も一挙紹介~

        keywords
        • WebFonts

        当たり前のように使われはじめた「日本語Webフォント」。Webフォントを採用している企業サイトを一挙に紹介しつつ、導入効果も解説します。また、直近トレンドでは、CSSプロパティ writing-mode を活用して、縦書き横書き混在のWebサイトが増えてきました。

        縦書きWebの事例も紹介します。 Webフォントは普及期に入ったとはいえ、Web制作現場から、「Webフォントはどうやって導入するの?」「データが重くなり表示に時間が掛かるのでは?」「どれくらいの費用が掛かるの?」「文字詰め(カーニング)はできるの?」「どうやって提案したらいいの?」「どんな書体を使ったらいいの?」等の質問がまだまだ多いです。それらの疑問にすべてお答えします。

        13:20 - 14:00

        Webと出版が融合する新しい標準 Web Publications〈ウェブ出版物〉ができることで、Webと本の未来はどうなる?

        keywords
        • 電子出版部

        Webと出版が融合する新しい標準 Web Publications〈ウェブ出版物〉ができることで、Webと本の未来はどうなる?

        • IDPFと統合したW3Cが進めるWeb・電子出版標準化の最新動向紹介

        • Web+出版をもっと面白くするためのパネルディスカッション

        基調トーク:村上 真雄 /「APL」紹介:下川 和男

        パネリスト:松島 智、田嶋 淳、安藤 一博、伊藤 俊輔 /モデレーター:木枝 祐介

        14:20 - 15:00

        詳解 WebRTC

        keywords
        • WebRTC

        WebRTC をプロトコルレベルで解説します。WebRTC 今後についてもお話します。

        15:20 - 16:00

        WebGLの今とこれから ~今のWeb開発で使うからこそ知っておきたい周辺技術~

        keywords
        • WebGL

        昔は開発コストが高く、デザインへの活かし方もわからずゲームでの活用しかなかったWebGLもWebだからこその活用例が様々なところで出てきました。WebGLはOpenGLESの移植版にすぎませんが、Webであるからこその様々な価値があります。そんなWebだからこそのCG表現をWebGLでやるなら知らなければいけないことはOpenGLと同じではありません。

        本セッションでは、WebGLだからこそ知っておくべき、ライブラリやエンジン問わず活用できる様々な周辺技術やそれらのトレンド、そこから見通せるWebGLの未来について触れさせていただきます。

        16:20 - 17:00

        テクニックではなく、今、本気で取り組むべきWebパフォーマンス

        keywords
        • パフォーマンス部

        民法債権法改正が国会で成立し、品質保証が請負やサービスなど、全てに適用されるようになります。私達が、普段、商品や食品に対して品質保証を求めるように、Webサイト制作や、Webサービスにも品質保証が要求されるのです。「自分達を損害賠償から守るために品質保証をしなくては」というよりも、「自分達の仕事の価値、提供するサービスの価値を高め、差別化するための品質保証」として積極的に活用しませんか?今まで、「テクニック」として語られる事が多かった「Webパフォーマンス」ですが、「品質管理」として本気で取り組みませんか?

        このセッションでは、Webサイト制作や、Webサービスの現場で、DevOpsの三本柱の一つである「品質保証」を実行していくために必要な、Webパフォーマンス管理・改善に必要な基礎知識を解説します。

        スペシャルセッション(17:30-18:30)

        ライトニングトーク大会

        ※ 会場は定員500名(先着順)となります。