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
[Home NOC Operators' Group] User Dashboardを作ってみた話
Search
yoneyan
August 14, 2021
Programming
0
300
[Home NOC Operators' Group] User Dashboardを作ってみた話
e-ZUKA Tech Night vol.52 -コロナ禍を支えるITインフラ-
発表資料
yoneyan
August 14, 2021
Tweet
Share
More Decks by yoneyan
See All by yoneyan
20250830_本社にみんなの公園を作ってみた
yoneyan
0
80
NREに向けた取り組みと さくらのサービス別通信状況(β)について / about NRE and sakura service network status beta
yoneyan
0
51
IPアドレス管理指定事業者における業務自動化の取り組みと活用例
yoneyan
0
110
Other Decks in Programming
See All in Programming
プロパティベーステストによるUIテスト: LLMによるプロパティ定義生成でエッジケースを捉える
tetta_pdnt
0
270
Laravel Boost 超入門
fire_arlo
2
210
旅行プランAIエージェント開発の裏側
ippo012
2
880
知っているようで知らない"rails new"の世界 / The World of "rails new" You Think You Know but Don't
luccafort
PRO
1
100
AI Coding Agentのセキュリティリスク:PRの自己承認とメルカリの対策
s3h
0
170
RDoc meets YARD
okuramasafumi
4
170
Zendeskのチケットを Amazon Bedrockで 解析した
ryokosuge
3
290
個人軟體時代
ethanhuang13
0
320
アプリの "かわいい" を支えるアニメーションツールRiveについて
uetyo
0
210
[FEConf 2025] 모노레포 절망편, 14개 레포로 부활하기까지 걸린 1년
mmmaxkim
0
1.6k
詳解!defer panic recover のしくみ / Understanding defer, panic, and recover
convto
0
230
Vue・React マルチプロダクト開発を支える Vite
andpad
0
110
Featured
See All Featured
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.8k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
It's Worth the Effort
3n
187
28k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
RailsConf 2023
tenderlove
30
1.2k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Imperfection Machines: The Place of Print at Facebook
scottboms
268
13k
[RailsConf 2023] Rails as a piece of cake
palkan
57
5.8k
Transcript
User Dashboardを作っ てみた話 Yuto Yoneda 8/12 e-ZUKA Tech Night
自己紹介 米田 悠人 • 大阪 • 大阪工業大学 情報科学部 情報ネットワーク学科 4年
• 最近の趣味はインフラ歩きやNTTと電電公社の社歌を聴くこと GitHub: https://github.com/yoneyan Twitter: https://twitter.com/yoneyan_ja
ユーザのみなさんとのやり取り(一年前) メールOnly。。。。
例)
わからん。。。
メールのメリット • 対応人数が少ない場合は、割と楽 • 誰でも使える
メールのデメリット • 運営委員の負担がかなり高い ◦ 運営委員が忙しく、いつの間にか忘れてしまう ◦ スパムメールが大量に受信されるため、埋もれる ◦ netboxや内部Wiki、Configから情報を読み取る必要があり、ユーザの識別に時間が非常にかかる •
他の運営委員と内容の共有が難しい
2020/03 後半頃~ ユーザ管理システムを作ってみよう
2020/04 ~ 言語選定 • Angular(Firebase関連を少しだけ触ってみたかったから ) Firebase + Angularで作ってみようとなった
2020/04 緊急事態宣言中~ HomeNOC operators’ Groupでは関係のないアプリケーション開発をしまくる • vmmgr • シフト表ぽいもの
2020/04 緊急事態宣言中~ HomeNOC operators’ Groupでは関係のないアプリケーション開発をしまくる • vmmgr • シフト表ぽいもの
2020/05 ~ • 開発スタート
v1.0 Release 2020/07/06
None
None
仕組み 使用技術 • Firestore Database • Authentication • Functions
Firebase Functions
問題点 • 従量課金制になる ◦ 内側から外側への通信にはお金がかかる • オンプレにしたいという意見が多い+したかった • チャット機能自体がなく、ユーザとのやり取りは結局メールになる •
HomeNOCの本来のサービスコードでは対応できないことが判明
バグなどの多さも課題。。。 • 入力に対するチェック機能が実装しきれていなかった • 単純に管理者が使いづらい
v2.x 2020/11 密かにリリース
サービスコードを一新(これまで) Static BGPによるEther IP接続の場合、3SE2020001 • グループ毎に割り当てられる ◦ グループIDがService Code •
拡張不可 • 複数拠点で異なる接続方法で結ぶとサービスコードが不一致になる
サービスコードを一新(現在) GroupID: 1でStatic BGPによるEther IP接続の場合、1-3S00001-EIP001 Groupのみ定義: 1 サービス情報のみ定義: 1-3S00001 接続も含めた定義:
1-3S00001-EIP001 • サービス品目の複数対応 • 接続品目の複数対応
特徴 • バックエンドを内製化 ◦ 従量課金ではなくなった • グループの概念を実装 • チャット機能の実装 •
サービスコードの大幅な変更
構成
DB構造
問題点 エラー内容がようわからん
v3.xは2021/05 こっそりリリース UIの変更はまったくないため省略
変更点 • ログ取得の実装(ログインユーザなどがわかるようにする) • 個人情報扱いの変更による大幅な DBの変更 • いらないTableは修正、削除を実施する • Production用のDBを生で触らなくてもいいように
dwebadmを充実させる(時間はかなりかか る) • DBアクセス頻度を減らす
問題点 • WebフレームワークとしてAngularを使っていたが扱える人が少ない • ユーザ側のサーバに不要な APIが存在していた • gorm(O/Rマッパー)のライブラリがv1だった(最新はv2)
v4.x Release (latest)
None
None
変更点 • WebフレームワークをAngularからReactに変更 • サポートチャットにてMarkdownが使用可能 • ユーザ単位でもチャットできるように変更 • ユーザ、グループ、サービス情報、接続情報の各追加ページにて文字数制限やチェック機能の強化を実施 •
不必要なAPIを削除し、よりセキュアにした • 不要なレスポンスを削り、セキュリティの強化 • 各リストにて、検索機能の追加 • ユーザページにてサーバアクセスの頻度を少なくした • UIの大幅改修 • TokenデータをSessionStorageからCookieに変更 • 申請手続きページの改修 • 通知機能の改修 • 寄付の仕組みを追加 • 会費徴収の仕組みを追加 • タグ機能の追加
DB構造 •
チャットの仕組み
実は。。。
チャットが届くまで
チャットが届くまで その1
チャットが届くまで その2
チャットが届くまで その3
バグ報告はgithubから https://github.com/homenoc
バグ報告
これからも、User First ....