Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ダッシュボード作ってみた
Search
yamamotoshota
November 19, 2024
1
73
ダッシュボード作ってみた
2024/11/19 NRUG沖縄でLT発表
yamamotoshota
November 19, 2024
Tweet
Share
Featured
See All Featured
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
Gamification - CAS2011
davidbonilla
80
5.1k
Building Your Own Lightsaber
phodgson
103
6.1k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
44
9.3k
Docker and Python
trallard
43
3.2k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
171
50k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.7k
Automating Front-end Workflow
addyosmani
1366
200k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.1k
Being A Developer After 40
akosma
89
590k
How To Stay Up To Date on Web Technology
chriscoyier
789
250k
Thoughts on Productivity
jonyablonski
68
4.4k
Transcript
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. ダッシュボード作ってみた 株式会社ドリーム・アーツ 山本将大 2024年11月19日
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. 自己紹介+会社紹介
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. 自己紹介 株式会社ドリーム・アーツ サービス&プロダクト開発本部 SRE推進グループ 山本
将大 Yamamoto Shota 出身 勤務地 入社年度 趣味 広島 - > 福岡(大学から) 東京 2023年4月 新卒として入社 総合格闘技 読書(Audible率高め) 最近読んだ面白かった本 ・方舟⋯めちゃおもろミステリ ・三体シリーズ…特に第二部が好き
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. 会社紹介 社 名 株式会社ドリーム・アーツ 東京本社
東京都渋谷区恵比寿4-20-3 恵比寿ガーデンプレイス29F 広島本社 広島県広島市中区大手町1-2-1 おりづるタワー6F 那覇 沖縄県那覇市前島3-25-1 泊ふ頭旅客ターミナルビルディング2F 石垣 沖縄県石垣市字登野城9-4 ICT文化ホール4F 関 連 会 社 夢創信息(大連)有限公司 (ドリーム・アーツ China) 設 立 1996年(平成8年)12月 事 業 概 要 大企業向けクラウド製品の企画・開発・販売 コンサルティング及びシステム開発サービスの提供 4
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. 沖縄での思い出 2024年2月初頭に初めて沖縄の那覇オフィスに出張 A&Wのルートビア。美味しかった 首里城修復中だったけど見に行った。とりあえず守禮門を撮影
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. New Relicダッシュボードで手動テストを助けたい
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. 背景 ・自分が担当する製品の開発では手動テストが行われる。 ・手動テストではCLIを使ってログを確認する機会が多い。
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. コンセプト テストエンジニアがNew Relic見ながらテストできるようにしたい! テストエンジニアのバックボーンは様々。 CLIが得意な人は少ない。
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. 目標 誰でも簡単にログ確認できるようにしたい (できればCLIよりNew Relicが便利だと思われたい)
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. 実際に作ってみた
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. どんな感じのダッシュボードになったか 条件入力 条件にあったログが出力される ログがいつどのくらいでていたのかのグラフ
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. 頑張ったところ 条件を入力してログの絞り込みを行いたい 悩んだところ ・AP選択を複数選択にしたら書き方がわからなくなった ・class.nameを入力していない状態だと絞り込みを行わないようにしたかった。
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. AP選択を複数選択にしたら書き方がわからなくなった APサーバーを複数選択可能にした host.hostname = {{ap}}
知ってるやつで試してみた。まあ無理か… host.hostname LIKE {{ap}} 悩んだ過程 知ってるやつで試してみたver.2 host.hostname IN {{ap}} 公式で、IN使うらしいって見かけた host.hostname IN ({{ap}}) AIに提案してもらった
DreamArts Confidential 2024/11/19 ©DreamArts Corporation. テキストボックスを入力していない状態だと絞り込みを行わないようにしたかった 入力されているclass.nameと一致するものがあれば絞り込む。 何も入力していなかったら絞り込まない。 テキストボックスに入力されたクラス名で絞り込む 悩んだ過程
class.name LIKE {{class_name}} (class.name LIKE {{class_name}} OR {{class_name}} = ‘’) class_nameが未入力のとき、class.nameがブランクになっているログを絞り込んで表示 class.nameに入力が無いときは絞り込みたくない… 「AIに聞きまくって上手くいくまで入力する戦法」でたどり着いた