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
320
レガシーなフロントエンド環境で心理的安全性を確保する / RecoChoku Tech Night #08
jaxx2104
July 24, 2018
Tweet
Share
More Decks by jaxx2104
See All by jaxx2104
Relative CI が気になっている話
jaxx2104
0
480
デザインファイルにおける継続的インテグレーション
jaxx2104
2
390
漸進的な変更を支えるフロントエンド設計
jaxx2104
5
2.1k
価値あるフロントエンドデザイン領域開拓
jaxx2104
0
320
Gatsby と Netlify で JAMstack なメディア開発
jaxx2104
0
650
サイレントヒーローを作らない取り組み
jaxx2104
1
140
開発組織のメンバーからリーダーになって
jaxx2104
0
100
Nikuman
jaxx2104
0
340
Vue.jsとLambdaの導入
jaxx2104
0
350
Other Decks in Technology
See All in Technology
テスト”ケース”駆動開発 で手戻りをなくそう
ryohma0510
0
330
LLVM/ASMを使った有限体の高速実装
herumi
0
120
とあるOSSを継続可能にするための取り組みについて / OSS Refactoring Process
bun913
1
210
QAに対する超個人的な解釈 / Personal Take on QA
toma_sm
1
140
『GRANBLUE FANTASY Relink』キャラクターの魅力を支えるリグ・シミュレーション制作事例
cygames
0
170
技術的負債解消の取り組みと専門チームのお話
bengo4com
0
340
Tricentisにおけるテスト自動化へのAI活用ご紹介/20240910Shunsuke Katakura
shift_evolve
0
210
事前準備が肝!AI活用のための業務改革
layerx
PRO
1
400
忙しい人のためのLangGraph概要まとめ
__ymgc__
1
200
『GRANBLUE FANTASY: Relink』クオリティと物量の両立に挑戦したフェイシャルアニメーション事例 ~カットシーンからランタイムまで~
cygames
0
120
プロダクトエンジニアを支えるための開発生産性向上施策
tsukakei
0
150
OCI で始める!! Red Hat OpenShift / Get Started OpenShift on OCI
oracle4engineer
PRO
1
190
Featured
See All Featured
The Straight Up "How To Draw Better" Workshop
denniskardys
230
130k
The Invisible Customer
myddelton
119
13k
Music & Morning Musume
bryan
46
6k
How to Ace a Technical Interview
jacobian
274
23k
Designing Experiences People Love
moore
138
23k
Why You Should Never Use an ORM
jnunemaker
PRO
53
8.9k
Designing on Purpose - Digital PM Summit 2013
jponch
114
6.8k
Large-scale JavaScript Application Architecture
addyosmani
508
110k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
103
48k
The Pragmatic Product Professional
lauravandoore
31
6.2k
Thoughts on Productivity
jonyablonski
66
4.2k
For a Future-Friendly Web
brad_frost
174
9.3k
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
チーム全員が事業成⻑のために 機能開発しながら改善に取り組める
改善やっていきましょう!
ありがとうございました!