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
レガシーなフロントエンド環境で心理的安全性を確保する / RecoChoku Tech Nig...
Search
jaxx2104
July 24, 2018
Technology
0
340
レガシーなフロントエンド環境で心理的安全性を確保する / RecoChoku Tech Night #08
jaxx2104
July 24, 2018
Tweet
Share
More Decks by jaxx2104
See All by jaxx2104
Relative CI が気になっている話
jaxx2104
0
500
デザインファイルにおける継続的インテグレーション
jaxx2104
2
430
漸進的な変更を支えるフロントエンド設計
jaxx2104
5
2.2k
価値あるフロントエンドデザイン領域開拓
jaxx2104
0
400
Gatsby と Netlify で JAMstack なメディア開発
jaxx2104
0
740
サイレントヒーローを作らない取り組み
jaxx2104
1
170
開発組織のメンバーからリーダーになって
jaxx2104
0
120
Nikuman
jaxx2104
0
410
Vue.jsとLambdaの導入
jaxx2104
0
380
Other Decks in Technology
See All in Technology
SRE不在の開発チームが障害対応と 向き合った100日間 / 100 days dealing with issues without SREs
shin1988
1
250
ABEMAの本番環境負荷試験への挑戦
mk2taiga
3
130
使いたいMCPサーバーはWeb APIをラップして自分で作る #QiitaBash
bengo4com
0
2k
オーティファイ会社紹介資料 / Autify Company Deck
autifyhq
10
130k
タイミーのデータモデリング事例と今後のチャレンジ
ttccddtoki
6
2.4k
united airlines ™®️ USA Contact Numbers: Complete 2025 Support Guide
flyunitedhelp
1
420
CRE Camp #1 エンジニアリングを民主化するCREチームでありたい話
mntsq
1
140
American airlines ®️ USA Contact Numbers: Complete 2025 Support Guide
airhelpsupport
0
390
Delta airlines®️ USA Contact Numbers: Complete 2025 Support Guide
airtravelguide
0
340
データ基盤からデータベースまで?広がるユースケースのDatabricksについて教えるよ!
akuwano
3
130
american airlines®️ USA Contact Numbers: Complete 2025 Support Guide
supportflight
1
110
freeeのアクセシビリティの現在地 / freee's Current Position on Accessibility
ymrl
2
230
Featured
See All Featured
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
Six Lessons from altMBA
skipperchong
28
3.9k
Become a Pro
speakerdeck
PRO
29
5.4k
Building an army of robots
kneath
306
45k
Typedesign – Prime Four
hannesfritz
42
2.7k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Designing for humans not robots
tammielis
253
25k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
960
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
Facilitating Awesome Meetings
lara
54
6.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Transcript
ϨΨγʔͳϑϩϯτΤϯυڥͰ ৺ཧత҆શੑΛ֬อ͢Δ Futoshi Iwashita / RecoChoku Tech Night #08
• 岩下 太 (jaxx2104) • 2017年5⽉ 中途⼊社 • フロントエンドエンジニア •
前職:某ネットニュースサイト
None
今⽇話したいこと • レストランボードのフロントエンドチームが 向き合う課題 • チーム全員で⼼理的安全性を確保している話
⾃分たちのチームが 向き合っている課題
機能開発をしていて課題に感じること • 業務⽀援アプリなので機能の優位さが重視さ れ、要望に応えていく必要がある • ホットペッパーグルメやAirとのシステム間 の連携が多く仕様が複雑で納期マストも多い
Delivery > Quality になってしまいがち
あとジョブチェンジ組が多い
「この機能のドキュメントが存在しません」 「全く同じ処理(1000⾏)が2つあります」 「この画⾯だけES2015で書かれてません」
None
機能開発をチーム全員が不安なく 進められるようにしなくては
技術的に⼼理的安全性を確保する
フロントエンドの改善するとしても • ϨΨγʔͳڥͰը໘ଆΛ୯७ʹվ ળͯ͠ϓϩμΫτӨڹ͕େ͖͍ɻɻ 5FTU %PDT #VJME 6* 'SBNFXPSL 4FSWJDF
ビルドツールから改善 5FTU %PDT #VJME 6* 'SBNFXPSL 4FSWJDF • ϏϧυπʔϧͷҠߦ •
λεΫվળʹΑΔϏϧυ࣌ؒॖ • ඇػೳཁ݅Ͱͷվળ͕Մೳʹ • linter formatter ͷඋ • ࣮ɾϨϏϡʔίετͷݮ • ༨࣌ؒͰ࣭վળ͘͢͠
次にテスト,ドキュメントの改善 5FTU %PDT #VJME 6* 'SBNFXPSL 4FSWJDF • Framework ͷҠߦΛݟਾ࣮͑ͯࢪ
• Jest ͷҠߦ • ը໘ଆͷςετ͕Մೳʹ • ػೳ։ൃऔΓΈ͘͢͠ • Storybook ͷಋೖ • ίϯϙʔωϯτͷϞοΫԽ • ϑϥδϟΠϧͳϑϩϯτಛੑʹ߹Θ ͤͯը໘͔Βίϯϙʔωϯτ୯Ґ
6* 'SBNFXPSL 4FSWJDF 画⾯側の改善 5FTU %PDT #VJME • Vue.js ͷಋೖ
• ϏϧυͱςετͷվળʹΑΓߴ͍ SLAͰ࣮͕ՄೳͱͳΔΑ͏ઃܭ • ৽نը໘Ͱಋೖ • ࠓޙͷػೳ։ൃͰಋೖࣄྫΛ૿ ͍ͯ͘͠
あとはチーム全員で 「改善」をまわす
全員で「改善」をまわすと • FEチームとして個⼈をサポートする体制づくり • 個⼈としてチーム貢献できるモチベーション⤴ • レガシー環境だけでなく最新フレームワークの機 能や設計を学習できる機会を⽤意する✍
「改善」は参画者のインプットにも • 参画者にはテストケースを追加の改善 • アサイン予定の画⾯仕様を事前に把握 • フロントエンドの技術に慣れてもらう
もちろんフォローも必要 • いきなり改善をまわせる⼈は少ない • 改善フローの進め⽅はもくもく会とレビュー 会を実施してチームとしてサポート • 技術⾯ではFE横断で⽀援
None
チーム全員が事業成⻑のために 機能開発しながら改善に取り組める
改善やっていきましょう!
ありがとうございました!