おれおれブログシステムにServiceWorkerを導入してみた #serviceworker

1. おれおれブログシステムにServiceWorkerを導入してみた #serviceworker Toshiaki Maki (チーム一人@making) 2015-04-04 Service Workerハッカソン

2. おれおれblog https://github.com/making/categolj2-backend フルREST APIなブログシステムフロントエンドを好きに作れる (JenkinsやGitBucketのように簡単に起動できる)

3. http://blog.ik.am 自分用ブログに使われている

4. システム構成 Backend API (Java) Frontend SPA (React.js) Backend SPA (Backbone.js) REST API REST API デフォルト画面デフォルト画面

5. 今日やりたかったこと • オフラインでも管理画面で記事を作成・保存する • 新しい記事が投稿されたら通知する

6. 今日やりたかったこと Backend API (Java) Frontend SPA (React.js) Backend SPA (Backbone.js) REST API REST API 投稿があれば通知オフラインの場合に、Service Worker経由で作業内容をキャッシュする

7. 今日できたこと Backend API (Java) Frontend SPA (React.js) Backend SPA (Backbone.js) REST API REST API 投稿があれば通知オフラインの場合に、Service Worker経由で作業内容をキャッシュする

8. 流れ Backend API (Java) Frontend SPA (React.js) Backend SPA (Backbone.js) REST API REST API 購読ボタンクリックユーザー

9. 流れ Backend API (Java) Frontend SPA (React.js) Backend SPA (Backbone.js) REST API REST API 購読者情報保存ユーザー

10. 流れ Backend API (Java) Frontend SPA (React.js) Backend SPA (Backbone.js) REST API REST API 記事投稿ユーザーぼく

11. 流れ Backend API (Java) Frontend SPA (React.js) Backend SPA (Backbone.js) REST API REST API GCMに送信 GCM ユーザーぼく

12. 流れ Backend API (Java) Frontend SPA (React.js) Backend SPA (Backbone.js) REST API REST API 購読者に通知 GCM ユーザーぼく

13. 流れ Backend API (Java) Frontend SPA (React.js) Backend SPA (Backbone.js) REST API REST API 購読者に通知 GCM ユーザーぼくブログのユーザーエンゲージメント向上 !!!

14. デモ

15. できてないこと • 購読中止ボタン • https対応 • 本番デプロイ • オフライン対応！！うちに帰って続きをやる！

16. 興味がわいたら試してみてください https://github.com/making/categolj2-backend フルREST APIなブログシステムフロントエンドを好きに作れる (JenkinsやGitBucketのように簡単に起動できる) きっとService Worker対応します！

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

おれおれブログシステムにServiceWorkerを導入してみた #serviceworker

Toshiaki Maki

Transcript