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

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

$ whoami
知花司
ちばなつかさ
!
twitter: @chibana_555
#スバヲタではありません
!
癖: なんでもhogehoge
!
苦手: 日本語
※お断り：この資料は私個人の偏見の集大成であり、私が所属する会社とは一切関係ございませんw

JSでチャット
(な∼んだnodejsの話しか)

Firebaseのお話です
知ってる人∼
違いま∼す！
残念でした∼

これ、AWSのS3
で動いてます
※ S3: AWSが提供しているストレージサービス
(ただのファイルサーバー)
は？何がすごいの？

チャットって
メッセージ送信

チャットって
他のユーザーに
通知しないといけない

チャットって
ぬるぽ！

チャットって
ぬるぽ？
ぬるぽ？ぬるぽ？
ぬるぽ？
ぬるぽ？

チャットって
ｶﾞｯ
ｶﾞｯｶﾞｯ
ｶﾞｯ
ｶﾞｯ

これを実現するには
双方向通信
プロトコル
サーバーサイドAP
フロントエンドAP

これを実現するには
冗長化
※意外にめんどくさい

Firebaseの何が嬉しいか
さっきのデモの構成はどうだったか？

さっきのデモ
Google Platform

チャットの実装
メッセージ表示してるところ
メッセージ取得してるところ
Factory
Controller
データが更新される都度
呼ばれる

メッセージ送信してるところさっきのコレクションに
追加してるだけ

メッセージ送信してるところ
送信時に認証処理してる

単なるデータ同期だけでなく
こういうSSOの実装
まともにやると地味にめんどくさい

SSO選択のところ
controller
service
facebook とか twitter
とかの識別子
利用するSSOの識別子を
渡すだけ
単なるデータ同期だけでなく
数行で実装可能！

宗教上の理由でng使いましたが
※サイト転載はちゃんと許可とってます
主要FW向けにいろいろ提供されてます

しかもiOS, Android対応

実はHostingも提供
独自ドメイン使わなければ
無料の範囲内でも使えます

ちょっと試したくなりました？
一応今回のデモGitHubに置いてます
https://github.com/hogehoge-banana/ﬁrebaseDemo
!
・・・が、公式のチュートリアルがものすごく充実してる
のでそちらをご利用くださいw
https://www.ﬁrebase.com/tutorial/#gettingstarted

とまぁ、
Firebaseゴリ押しなんですが

※私はgoogleの回し者
ではありませんのであしからず・・・
知ってるわ！

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

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

More Related Content

Viewers also liked (7)

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