たんたんとがんばる

ruby, Ruby on Rails, React etc.

HTML5 Conference 2016感想

9/3(土)にHTML5 Conference 2016に参加してきたので簡単に所感とメモをまとめます。
資料と動画はほとんど↓にあがってます。

qiita.com

参加セッション

  1. Reactの最新動向とベストプラクティス
  2. HTMLスナップショット2016
  3. Material Design を使ったマルチデバイスに対応するデザインの作り方
  4. Progressive Web Apps の次の一歩 〜 アイデンティティとペイメント
  5. Progressive Web Apps の導入基礎

1. Reactの最新動向とベストプラクティス

所感

むずかしい…
全体的にReact.jsの知識がある方向けという感じでした。
また、サンプルコードがアロー関数だったことがムズカシさの拍車をかけた印象(意識低くてすみません…)

メモ

2. HTMLスナップショット2016

所感

HTML Standardのマニュアルの各種翻訳者による、ここ最近のHTML界隈の動向。 いろいろな意味でガチ、って感じ。

3. Material Design を使ったマルチデバイスに対応するデザインの作り方

所感

大盛況(Googleブランドかなー)
Googleのマニュアルを見れば早い、という意見もありますが、
やはりこうした場で生でデモを見るとテンション上がるので意味があると思います。

メモ

  • マテリアルデザインは「紙」が持つ情報伝達による柔軟性や効率性をお手本にしたデザイン(古くて新しい気がする)
  • Googleが提供するMaterial Design Liteを使えば、フレームワークによらず簡単にマテリアルデザインが試せる
  • アニメーションを利用することで、現実の時間軸をアプリに取り入れ、よりユーザが馴染みやすいUIになる(→コミュニケーションコストの低下)
  • エラー画面に力を入れているサイトはよいサイト

4. Progressive Web Apps の次の一歩 〜 アイデンティティとペイメント

所感

一言で言えばChromeに記録されたIDやクレジットカード情報を利用して、
Webアプリでもよりログインや決済を簡素化しようとするもの。
スピーカーいわく「セキュリティが不安でしょうが、むしろ普通よりも安全」
ということでしたが、やはりセキュリティは不安に感じました。
早く実装してみたい。

メモ

  • クレジットカード決済処理はサーバ側で実装する必要がある

5. Progressive Web Apps の導入基礎

所感

プレゼン上手。 また、実際のSUUMOサイトを例に説明されていたので非常にわかりやすかった。

メモ

  • push通信のフローをおさえることが重要
  • SUUMOではpush通信後に、ひそかにデータを再取得してLocal Storageにキャッシュする、そうするとユーザがアクセスした時にネイティブアプリ並みに早く起動できる
  • The Offline cookbook というオフライン処理のわかりやすいパターン集がネットにあるとのこと