Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

htmlとjsだけでチャットが実装できちゃった話

1,362 views

Published on

Firebase introduction

Published in: Technology
  • Be the first to comment

htmlとjsだけでチャットが実装できちゃった話

  1. 1. HTMLとJSだけで チャットが実装できちゃった話
  2. 2. $ whoami 知花 司 ちばな つかさ ! twitter: @chibana_555 #スバヲタではありません ! 癖: なんでもhogehoge ! 苦手: 日本語 ※お断り:この資料は私個人の偏見の集大成であり、私が所属する会社とは一切関係ございませんw
  3. 3. JSでチャット (な∼んだnodejsの話しか)
  4. 4. Firebaseのお話です 知ってる人∼ 違いま∼す! 残念でした∼
  5. 5. デモ
  6. 6. これ、AWSのS3 で動いてます ※ S3: AWSが提供しているストレージサービス (ただのファイルサーバー) は? 何がすごいの?
  7. 7. チャットって メッセージ送信
  8. 8. チャットって 他のユーザーに 通知しないといけない
  9. 9. チャットって ぬるぽ!
  10. 10. チャットって ぬるぽ? ぬるぽ?ぬるぽ? ぬるぽ? ぬるぽ?
  11. 11. チャットって ガッ ガッガッ ガッ ガッ
  12. 12. チャットって 他のユーザーに 通知しないといけない
  13. 13. これを実現するには 双方向通信 プロトコル サーバーサイドAP フロントエンドAP
  14. 14. これを実現するには 冗長化 ※意外にめんどくさい
  15. 15. Firebaseの何が嬉しいか さっきのデモの構成はどうだったか?
  16. 16. さっきのデモ Google Platform
  17. 17. チャットの実装 メッセージ表示してるところ メッセージ取得してるところ Factory Controller データが更新される都度 呼ばれる
  18. 18. チャットの実装 メッセージ送信してるところ さっきのコレクションに 追加してるだけ
  19. 19. チャットの実装 メッセージ送信してるところ 送信時に認証処理してる
  20. 20. 単なるデータ同期だけでなく こういうSSOの実装 まともにやると地味にめんどくさい
  21. 21. SSO選択のところ controller service facebook とか twitter とかの識別子 利用するSSOの識別子を 渡すだけ 単なるデータ同期だけでなく 数行で実装可能!
  22. 22. 宗教上の理由でng使いましたが ※サイト転載はちゃんと許可とってます 主要FW向けにいろいろ提供されてます
  23. 23. しかもiOS, Android対応 ※サイト転載はちゃんと許可とってます
  24. 24. 実はHostingも提供 ※サイト転載はちゃんと許可とってます 独自ドメイン使わなければ 無料の範囲内でも使えます
  25. 25. ちょっと試したくなりました? 一応今回のデモGitHubに置いてます https://github.com/hogehoge-banana/firebaseDemo ! ・・・が、公式のチュートリアルがものすごく充実してる のでそちらをご利用くださいw https://www.firebase.com/tutorial/#gettingstarted
  26. 26. とまぁ、 Firebaseゴリ押しなんですが
  27. 27. ※私はgoogleの回し者 ではありませんのであしからず・・・ 知ってるわ!
  28. 28. ご清聴ありがとうございました

×