おれおれブログシステムにserviceworkerを導入してみた #serviceworker
TRANSCRIPT
おれおれブログシステム にServiceWorkerを
導入してみた #serviceworker
Toshiaki Maki (チーム一人@making) 2015-04-04 Service Workerハッカソン
おれおれbloghttps://github.com/making/categolj2-backend
フルREST APIなブログシステム フロントエンドを好きに作れる
(JenkinsやGitBucketのように簡単に起動できる)
システム構成
Backend API (Java)
Frontend SPA
(React.js)
Backend SPA
(Backbone.js)
REST API
REST API
デフォルト画面
デフォルト画面
今日やりたかったこと
• オフラインでも管理画面で記事を作成・保存する
• 新しい記事が投稿されたら通知する
今日やりたかったこと
Backend API (Java)
Frontend SPA
(React.js)
Backend SPA
(Backbone.js)
REST API
REST API
投稿があれば通知
オフラインの場合に、Service Worker経由で 作業内容をキャッシュする
今日できたこと
Backend API (Java)
Frontend SPA
(React.js)
Backend SPA
(Backbone.js)
REST API
REST API
投稿があれば通知
オフラインの場合に、Service Worker経由で 作業内容をキャッシュする
流れ
Backend API (Java)
Frontend SPA
(React.js)
Backend SPA
(Backbone.js)
REST API
REST API
購読ボタンクリック
ユーザー
流れ
Backend API (Java)
Frontend SPA
(React.js)
Backend SPA
(Backbone.js)
REST API
REST API
購読者情報保存
ユーザー
流れ
Backend API (Java)
Frontend SPA
(React.js)
Backend SPA
(Backbone.js)
REST API
REST API
記事投稿
ユーザー
ぼく
流れ
Backend API (Java)
Frontend SPA
(React.js)
Backend SPA
(Backbone.js)
REST API
REST API
GCMに送信
GCM
ユーザー
ぼく
流れ
Backend API (Java)
Frontend SPA
(React.js)
Backend SPA
(Backbone.js)
REST API
REST API
購読者に通知
GCM
ユーザー
ぼく
流れ
Backend API (Java)
Frontend SPA
(React.js)
Backend SPA
(Backbone.js)
REST API
REST API
購読者に通知
GCM
ユーザー
ぼく
ブログの ユーザーエンゲージメント
向上 !!!
デモ
できてないこと
• 購読中止ボタン
• https対応
• 本番デプロイ
• オフライン対応！！
うちに帰って続きをやる！
興味がわいたら 試してみてください
https://github.com/making/categolj2-backend
フルREST APIなブログシステム フロントエンドを好きに作れる
(JenkinsやGitBucketのように簡単に起動できる)
きっとService Worker対応します！