レガシーなフロントエンド環境で心理的安全性を確保する / RecoChoku Tech Night #08

Transcript

1. ϨΨγʔͳϑϩϯτΤϯυ؀ڥͰ ৺ཧత҆શੑΛ֬อ͢Δ Futoshi Iwashita / RecoChoku Tech Night #08
2. • 岩下 太 (jaxx2104) • 2017年5⽉ 中途⼊社 • フロントエンドエンジニア • 前職：某ネットニュースサイト
4. 今⽇話したいこと • レストランボードのフロントエンドチームが 向き合う課題 • チーム全員で⼼理的安全性を確保している話
5. ⾃分たちのチームが 向き合っている課題
6. 機能開発をしていて課題に感じること • 業務⽀援アプリなので機能の優位さが重視さ れ、要望に応えていく必要がある • ホットペッパーグルメやAirとのシステム間 の連携が多く仕様が複雑で納期マストも多い
7. Delivery > Quality になってしまいがち
8. あとジョブチェンジ組が多い
9. 「この機能のドキュメントが存在しません」 「全く同じ処理(1000⾏)が2つあります」 「この画⾯だけES2015で書かれてません」
11. 機能開発をチーム全員が不安なく 進められるようにしなくては
12. 技術的に⼼理的安全性を確保する
13. フロントエンドの改善するとしても • ϨΨγʔͳ؀ڥͰը໘ଆΛ୯७ʹվ ળͯ͠΋ϓϩμΫτӨڹ͕େ͖͍ɻɻ 5FTU
    %PDT #VJME 6* 'SBNFXPSL 4FSWJDF
14. ビルドツールから改善 5FTU
    %PDT #VJME 6* 'SBNFXPSL 4FSWJDF • ϏϧυπʔϧͷҠߦ • λεΫվળʹΑΔϏϧυ࣌ؒ୹ॖ • ඇػೳཁ݅Ͱͷվળ͕Մೳʹ • linter ΍ formatter ͷ੔උ • ࣮૷ɾϨϏϡʔίετͷ࡟ݮ • ༨৒࣌ؒͰ඼࣭վળ͠΍͘͢
15. 次にテスト,ドキュメントの改善 5FTU
    %PDT #VJME 6* 'SBNFXPSL 4FSWJDF • Framework ͷҠߦΛݟਾ࣮͑ͯࢪ • Jest ΁ͷҠߦ • ը໘ଆͷςετ͕Մೳʹ • ػೳ։ൃ΋औΓ૊Έ͠΍͘͢ • Storybook ͷಋೖ • ίϯϙʔωϯτͷϞοΫԽ • ϑϥδϟΠϧͳϑϩϯτಛੑʹ߹Θ ͤͯը໘͔Βίϯϙʔωϯτ୯Ґ΁
16. 6* 'SBNFXPSL 4FSWJDF 画⾯側の改善 5FTU
    %PDT #VJME • Vue.js ͷಋೖ • ϏϧυͱςετͷվળʹΑΓߴ͍ SLAͰ࣮૷͕ՄೳͱͳΔΑ͏ઃܭ • ৽نը໘Ͱಋೖ • ࠓޙͷػೳ։ൃͰಋೖࣄྫΛ૿΍ ͍ͯ͘͠
17. あとはチーム全員で 「改善」をまわす
18. 全員で「改善」をまわすと • FEチームとして個⼈をサポートする体制づくり • 個⼈としてチーム貢献できるモチベーション⤴ • レガシー環境だけでなく最新フレームワークの機 能や設計を学習できる機会を⽤意する✍
19. 「改善」は参画者のインプットにも • 参画者にはテストケースを追加の改善 • アサイン予定の画⾯仕様を事前に把握 • フロントエンドの技術に慣れてもらう
20. もちろんフォローも必要 • いきなり改善をまわせる⼈は少ない • 改善フローの進め⽅はもくもく会とレビュー 会を実施してチームとしてサポート • 技術⾯ではFE横断で⽀援
22. チーム全員が事業成⻑のために 機能開発しながら改善に取り組める
23. 改善やっていきましょう！
24. ありがとうございました！