LINE エンジニアインターンシップ 2017 成果発表

1. Webアプリケーション上で
起きている問題の可視化

2. Webトラッキングシステムが
あることをご存知ですか？

3. Webトラッキングシステム「torimochi」
• フロントエンドで使われているエラー検知、ログ収集システム。
• 取得できるデータはPVやセッション数の他に…

4. 背景
• 取得したデータはkibana上で確認しているが、日常的に確認してい
る開発者は限られている。
• エラーログからどこで問題が起きているのか推測するのが難しい。

5. 目標
• torimochiのデータを活用したプロダクトが増えること。
• リリース直後などに起きた問題を素早く解決できること。
• 見やすいこと。

7. mochigome
• torimochi専用ダッシュボード
• 一覧性が担保されており、エラー発生率の高いサービスを俯瞰して
把握できる
• 少ないステップで自分のサービスまでたどり着ける
• 問題が発生してしまった時に、どんな問題で、どんな環境で起きてい
るのかがわかる

8. #機能1 プロダクトで起きている問題を
俯瞰して把握できるView

9. #機能2 プロダクトの詳細を
素早く確認できるOverview

10. #機能3 プロダクトで起きているエラーを
確認できるErrorListView

11. #機能4 起きているエラーの該当箇所を
ハイライトしてくれるFileView

12. #機能5
エラー発生率が閾値を超えた際に
通知してくれるLINE Notify

13. デモ

14. アーキテクチャ
express(NodeJS)
elasticsearch
mochigome(web)
:Nuxt.js
mochigome(backend)
API server
Websocket server
elastic query(x6)

15. 作ってみて
• 機能要件は一通り満たしたので、満足。
• しかし、このツールが果たして使われるのか？
• 自分が使ってないのに人にすすめることなんてできない！！
LINE newstabに送ったプルリクがマージされました

16. 結果
• 当初27.12%のエラー発生率だったnewstabが0.55%まで改善

17. 結果
• ピーク時に起きている1777429件のエラーが0件になりました

18. 🎉

19. 感想
• LINEのログを生で見ることができ良い体験になりました。
• JavaScriptやElasticSearchの知見を沢山得ることができました。
• ServerSideRenderingはつらい。

20. 最後に
• UIT室でディスプレイしてもら
いました！

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