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
38sawa
June 08, 2023
Business
1
440
開発者体験から見える技術的負債
合同会社DMM.com イノベーション本部オンラインサロン事業部
価値提供スピードを上げるための技術的負債への向き合い方
https://dmm.connpass.com/event/284374/
38sawa
June 08, 2023
Tweet
Share
More Decks by 38sawa
See All by 38sawa
新規事業Meetup MENUS
38sawa
2
2.6k
Other Decks in Business
See All in Business
ビジネスマナー研修用スライド
chibanba1982
PRO
0
130
採用ピッチ資料
beglobal_document
0
680
IT業界向けグループワーク「THEクリティカルパス カード版」
chibanba1982
PRO
0
120
株式会社ispec 会社紹介資料
emikamihara
0
6k
20240119_pmconf2024_落選セッションお披露目会_駄菓子屋PM的「PMネクストキャリア」3つの誤解
mindman
1
1.2k
ゲーム型メンタルヘルス研修「ストマネ」
chibanba1982
PRO
0
430
危機管理コンセンサスゲーム「船長の決断 カード版」
chibanba1982
PRO
0
500
akippa株式会社 - 会社紹介資料
akippa
4
61k
企業向け謎解きゲーム「消えた提案書の謎」
chibanba1982
PRO
0
230
株式会社B4A 会社紹介
b4a
0
6k
セルフケア研修用カードゲーム「攻略! きみのストレスを発見せよ!」
chibanba1982
PRO
0
120
サステナビリティレポート2023
hamayacorp
0
170
Featured
See All Featured
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
45
2.3k
Keith and Marios Guide to Fast Websites
keithpitt
410
22k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
127
18k
How STYLIGHT went responsive
nonsquared
96
5.3k
Fireside Chat
paigeccino
34
3.1k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.7k
Automating Front-end Workflow
addyosmani
1366
200k
Transcript
© DMM 開発者体験から見える 技術的負債 オンラインサロン事業部 澤 道人
© DMM 自己紹介 2015年入社 2021年08月からオンラインサロン事業部にエンジニアとし て参画 趣味:走ったり、山に登ったり 2 澤 道人
© DMM 今日お話しすること • 技術的負債って? • 実例紹介(どのような機能か) • 開発を進める上でどんな課題があるか? •
なぜこの構成になってる? • 開発はどうやって対応してる? • 今後どうしていきたいか • まとめ 3
© DMM 技術的負債って? 4 • コード負債 • 設計負債 • テスト負債
• 要件負債...etc 開発プロセスの中で生じた課題に対して 簡単な(限定的な)解決策を選択した 結果生み出されるもの 今回は開発を進めている中で良くないな、効率悪いなと感じる部分を実例を見ながらご紹 介します。 時間がかかるより良いアプローチを使用する代わりに、今すぐ簡単な(限定的な)解決策を 選択することで生じる追加の手直しの暗黙のコストを反映したものである(引用元: wikipedia)
© DMM 実例紹介(どのような機能か) 5 オンラインサロン開きたいんです! 運営スタッフ どのようなサロンかをユーザーに伝え て、入会してもらうためのページを作成 してみましょう。 管理画面から入力してみたけど実際の
ユーザーにはどのように見えるんです か? 管理画面から入会ページのプレビュー を見ることができます。 プレビュー機能をご利用ください。 実際の入会ページ 運営スタッフ PC SP サロンオーナー サロンオーナー
© DMM 入会画面に変更が加わると都度、管理画面に取り込む必要性がある 取り込みの手間、処理の変更 開発者体験の悪化 コード管理が分割されているが、 オーナー管理画面からユーザーが利用する入会画面をプレビューとして閲覧してもらいたい。 開発を進める上でどんな課題があるか? 6 前提として、コード管理( gitのリポジトリ)が分割されています。
• オーナーが利用する管理画面 • ユーザーが利用する入会画面 変更内容 ユーザーが利用する入会画面の変更 オーナーが利用する管理画面に取り込み 取り込み時に処理を変更(元データの取得など) HTML/CSS/JS/画像 HTML/CSS/JS/画像 取り込み忘 れがち...
© DMM なぜこの構成になってるのか? 7 開発当時のエンジニアは異動、または退職済みのため分からない。。。 • リリースに向けて時間がなかった • 入会画面に更新が入ると思っていなかった •
コード取り込みなんて簡単だ もしかしたら他に何か理由があったのかもしれない。 分からないことに悩んでも時間が過ぎるだけなので意味はなさそう。
© DMM 1. 取り込み漏れを発生させないために、タスクのテンプレートに以下のチェックを入れている 以下の観点で影響範囲調査を実施したか プレビュー修正要否(入会画面変更時、サロン詳細変更時) 2. 対象画面に変更があった場合はタスクにプレビュー修正タスクを追加 例え入会ページに関係ないタスクでもプレビューのことを一瞬考えなくてはいけない。。。 タスク作成時の体験悪化
現在はどうやって対応してる? 8 • 入会ページの変更があるたびにオーナー管理画面のプレビュー機能に変更を取り込む • 急ぎの変更が入会画面にあると取り込み漏れが発生することもある この課題に向き合うためにやってること
© DMM 少し考えただけでプレビュー機能という単純な言葉の裏にこれだけの要件が出てくる。 開発当初もさまざま検討した結果、現在の解決策を取るしかなかったのかもしれない … 課題の大枠は見えてきたので少しずつ課題を潰して、効率的に開発を進めていきたい。 コードを取り込むのではなく、オーナー管理画面から入会ページを直接参照する仕組みにする? コードの2重管理はなくなりそうだが、他の課題が見つかりそう。 今後どうしていきたいか 9
• 管理画面へのコード取り込みをやめたい ◦ コードの2重管理の廃止 ◦ 取り込み漏れ発生の抑制 ◦ タスク作成時の影響調査の廃止 • 複数の異なるオーナーがいるので他のオーナーのプレビューは見せてはいけない • ユーザーに作りかけのプレビューページを見られたくない(検索エンジンにも) • あくまでプレビューだけで入会ボタンやリンクはクリックできないようにしたい • PC/スマホのプレビューを1画面で切り替えたい
© DMM 技術的負債を残したいエンジニアはいない 要件を決めるときに課題を洗い出そう 限定的な解決策を選ぶと後に響くことはよくあるし、開発者体験を悪化させる • コードを2重管理したいと思っているエンジニアはいない • コードの2重管理は開発者体験を悪化させる(対応コスト、影響範囲の確認 ...etc)
• 要件は単純な言葉でも当たり前の要件が隠れている • 当たり前の要件が課題になって簡単な(限定的な)解決策を選択した可能性がある まとめ 10