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
高い開発生産性を実現するために取り組んだMagicPodの利活用
Search
t-jimbo
July 14, 2023
Technology
3.2k
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
高い開発生産性を実現するために取り組んだMagicPodの利活用
MagicPodユーザーLT会
https://trident-qa.connpass.com/event/283709/
t-jimbo
July 14, 2023
More Decks by t-jimbo
See All by t-jimbo
React / TypeScriptでのカラーピッカーの実装戦略
jimbo
0
170
Other Decks in Technology
See All in Technology
41歳でAWSが好きすぎてITエンジニアになったおっさんの話
yama3133
1
730
AI_Dev_Day_製造業領域でのAI活用から見た活用の罠と成功に導く実践知.pdf
kintotechdev
0
160
AI、CDK と協働する Full TypeScript アプリケーション開発 / Full TypeScript Application with AI and CDK
geekplus_tech
2
480
AICoEでAIネイティブ組織への進化
yukiogawa
0
210
JAWS_ICEBERG_BASECAMP
iqbocchi
2
110
AIエージェントがあれば技術書なんてすぐ書けるでしょ→無理でした
watany
2
170
“それは自分の仕事じゃない"を越えて行け
yuukiyo
1
520
非定型なドキュメントを効率よくリファクタする 〜えぇ!?仕様書27本の移行が1日で終わったって!?〜
subroh0508
2
610
_NIKKEI_Tech_Talk__勉強会は熱量では続かない___17回続いた輪読会の設計術.pdf
_awache
1
100
Jitera Company Deck
jitera
0
270
文字起こし基盤の信頼性
abnoumaru
0
120
AmplifyHostingConstructからSSRフレームワークのためのホスティング設計を考察する/amplify-hosting-construct
fossamagna
1
300
Featured
See All Featured
Designing Powerful Visuals for Engaging Learning
tmiket
1
460
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
370
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
420
Music & Morning Musume
bryan
47
7.3k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
67k
Done Done
chrislema
186
16k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
220
Java REST API Framework Comparison - PWX 2021
mraible
34
9.5k
The Cost Of JavaScript in 2023
addyosmani
55
10k
Designing for Performance
lara
611
70k
Designing Experiences People Love
moore
143
24k
Marketing to machines
jonoalderson
1
5.6k
Transcript
高い開発生産性を実現するために 取り組んだMagicPodの利活用 MagicPodユーザーLT会 2023.07.14 1
神保 拓眞(t-jimbo) 2 ▪ BuySell Technologies 所属 ▪ フロントエンドエンジニア ▪
店舗買取システム「Store」の開発 https://twitter.com/ce_mm スライドアップしてます!
プロダクトの紹介
買取 から 販売 まで、総合リユースビジネスを展開 4
リユースプラットフォーム「Cosmos」 ▪ リユースのあらゆる課題を、テクノロジーで解決する。 5
リユースプラットフォーム「Cosmos」 ▪ リユースのあらゆる課題を、テクノロジーで解決する。 6
リユースプラットフォーム「Cosmos」 ▪ リユースのあらゆる課題を、テクノロジーで解決する。 7
店舗買取システム「Store」 8 https://newswitch.jp/p/37111 ステップ形式で操作に迷わず買取業務を進める iPad用のWebアプリ
フィードバック 全国で運用中=障害は出せない 9 昨年9月にリリース 店舗買取を行うグループ会社へも展開 Storeの障害 = 買取機会損失 New!! 新機能リリース
バイセルグループ3社にまたがって利用 ▪ バイセル、TIMELESS、WAKABAで利用 ▪ 会社によって業務フローが異なるため、求められる機能が異なる • 機能の表示・非表示、用語の切り替えなど 10
安全かつ高速なデリバリーを実現する ▪ featureフラグを活用したトランクベース開発 • 小さく高頻度でリリース • 開発、テスト、デプロイのサイクルを高速に回していく • PR数が1日10件を超える日も! 11
自動テストが安全性を担保 ▪ CI/CDでテストを回しまくる • 単体テスト • 画像回帰テスト • インタラクションテスト •
E2Eテスト 12
自動テストが安全性を担保 ▪ CI/CDでテストを回しまくる • 単体テスト • 画像回帰テスト • インタラクションテスト •
E2Eテスト • MagicPod をフル活用 13
こんな風にMagicPodを使っています
コードベースのE2Eテストに課題 ▪ 壊れやすいE2Eテストをコードで書くのはつらい • メンテナンスコストが大きく、開発体験が悪化 • 属人化しがち ▪ 結果としてテストが書かれなくなってしまう... 15
MagicPodの嬉しいところ 16 ノーコードでテスト作成 AIによる自動修復機能 iOSのエミュレータ テストケースのバージョン管理など、日々 嬉しい機能がアップデートされています
MagicPodの嬉しいところ ▪ テストケースの作成がかんたん ▪ メンテナンスコストが低い ▪ 開発とQAのエンジニアを分離できる 17
StoreでのMagicPodの利用 とにかくたくさん実行して品質チェックする!! けどテスト待ちで開発スピードを落としたくはない 18
StoreでのMagicPodの利用 3種類の実行方法を使い分けています 19 定期実行で PR時点でも(New) デプロイ前に
定期実行でMagicPodを回す ▪ 3時間に1回の実行 • 実行数が無制限! ▪ ここであらゆるケースをカバー • 基本フロー •
中止や特殊なフロー 20
デプロイ前にMagicPodを回す ▪ 本番環境へのデプロイ前にstaging環境でE2Eテストを自動実行 • 変更による障害を防ぐ • 詳細は バイセル Tech Blog
を参照! 21
デプロイ前にMagicPodを回す ▪ (余談)ワークフローはさらに進化中... • buildの並列化 • CODEOWNERによる承認フローの追加 • リリースノートの自動作成 22
PR時点でもMagicPodを回す ▪ デプロイ直前にしかテストが実行できないのが課題だった • マージ前にCIでもテストを実行したい! 23 Merge テスト失敗 Revert
PR時点でもMagicPodを回す ▪ PRを作成すると自動でプレビュー環境を立てる 24 PR作成 Cloud Runへデプロイ PR番号でURL生成 https://pr-1234-an.a.run.app/
PR時点でもMagicPodを回す ▪ MagicPod API Client をGitHub Actionsで利用する ▪ 環境変数で渡すことで任意のURLに対応 25
MagicPod API Client 渡されたURLに遷移
実行方法 定期実行 デプロイ前(CD) PR時点(CI) テスト内容 全フロー 基本フローのみ 実行時間 長(合計30~40分) 短(約5分)
役割 完全な品質の担保 デプロイ時の障害防止 変更時の自動テスト ▪ 定期実行で全フローのテストを行い恒常的な品質を担保 ▪ CI/CDでは開発スピード重視で軽量な基本フローのみを実行 StoreでのMagicPodの利用まとめ 26
開発生産性の向上にかなり寄与しています
MagicPodを回しまくることで... ▪ 安心・安全が得られる! • 障害の未然防止 ▪ 人間の確認作業を最小限に抑えられる!! ▪ エンジニアがテスト作成や機能開発に集中できる!!! 28
使い倒しましょう!!!!
B U Y S E L L T E C
H N O L O G I E S B U Y S E L L T E C H N O L O G I E S リユース業界 No.1テックカンパニーへ