管理画面チラ見せナイトの資料です

1. ツクリンクの管理画面
管理画面チラ見せ♥ナイト #7
#admin_night
株式会社ハンズシェア
湯本 明信
admin night #7

2. アジェンダ
1. 自己紹介
2. サービス紹介
3. 管理画面♥

3. アジェンダ
1. 自己紹介
2. サービス紹介
3. 管理画面♥

4. あっきー（@kuronekopunk)
【所属】
株式会社ハンズシェア＠六本木
エンジニア × PR
筋トレ部、ボドゲ部
【趣味】
Twitter、お酒、着物、社交ダンス
ボードゲーム、b-monster、筋肉体操

5. 毎日16時から
オフィスで筋肉体操

6. 個人開発の話

7. Facebook Messenger

8. Messenger Ninja

9. アジェンダ
1. 自己紹介
2. サービス紹介
3. 管理画面♥

10. 建設業WEBマッチングプラットフォーム

11. 技術スタック
・サーバーアプリケーション
Ruby(2.5.0)、Ruby on Rails(5.2.0)
Heroku、Postgres
・管理画面
Mountable Engine
・ログ収集、分析
Logentries、New Relic、Redash

12. 管理画面の役割
• グロース・ビジネスサイド用管理画面
KPIチェック
（会員登録数、DAU、ｘｘの登録数、ｘｘしたユーザー率…）
• CS用管理画面
リソース管理
（会員情報・投稿案件などの登録情報）

13. アジェンダ
1. 自己紹介
2. サービス紹介
3. 管理画面♥

14. 管理画面チラ見せ♥

16. 有料Bootstrapテンプレート（INSPINIA）

17. テンプレートを使うメリット
• 実装するまでが早い
• エンジニアだけでも作りやすい
• かっこいい！テンション上がる！
早い！安い！美味い！

18. Chart.js
グラフ

21. 月次数値

22. クエリ激重…💀
（Herokuは30秒でタイムアウト）

23. 改善
1．集計結果テーブルを用意
2．API用意
→Ajaxで非同期読み込み
3．Redashで集計
→スプレッドシートで管理

24. Redash

25. Redash + スプレッドシート

26. Before

27. Redash + スプレッドシート

28. =IMPORTDATA("RedashAPIのURL")

29. スプレッドシート
IMPORTDATAの罠💀
• 更新タイミングを制御できない
• 大量のAPIを利用するとタイムアウト

30. Google App Scriptで解決

32. Redash + スプレッドシート

33. CS用管理画面をチラ見せ♥

34. 会員情報の編集

35. CS用管理画面の役割
• ユーザー情報の確認、編集
• 投稿内容の確認、編集

36. サポートのため情報にすぐに辿り着けるように

39. チラ見せ♥おわり

40. まとめ
• 作るものは最小限に
• テンプレやライブラリを使う
• 外部サービスを使う
• データ量増加に対応できるように（できれば）
• 関連するデータをすぐ参照できるようリンク
を貼る