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
atama plusでのAngular×ionicプロダクトのバージョンアップとの付き合い方 ...
Search
Shogo Ichinose
November 26, 2021
Programming
0
1.5k
atama plusでのAngular×ionicプロダクトのバージョンアップとの付き合い方 / ng_startup2
Startup Angular #2
Angularを採用しているスタートアップの裏側を徹底公開
セッション2
https://voicy.connpass.com/event/229367/
Shogo Ichinose
November 26, 2021
Tweet
Share
More Decks by Shogo Ichinose
See All by Shogo Ichinose
Wow students.を支えるatama plusのデザインシステム
rettar5
0
180
Angularを採用したプロダクトで表記ゆれを撲滅したはなし
rettar5
2
2.4k
カベを壊せ!「機械学習」×「グラフデータベース」×「チャット」で繋ぐヒューマンリレーションシップ!!
rettar5
0
1.2k
Other Decks in Programming
See All in Programming
Swift Concurrency - 状態監視の罠
objectiveaudio
2
510
Devoxx BE - Local Development in the AI Era
kdubois
0
130
開発生産性を上げるための生成AI活用術
starfish719
3
450
All About Angular's New Signal Forms
manfredsteyer
PRO
0
120
なぜあの開発者はDevRelに伴走し続けるのか / Why Does That Developer Keep Running Alongside DevRel?
nrslib
3
400
Writing Better Go: Lessons from 10 Code Reviews
konradreiche
0
950
大規模アプリのDIフレームワーク刷新戦略 ~過去最大規模の並行開発を止めずにアプリ全体に導入するまで~
mot_techtalk
1
430
Server Side Kotlin Meetup vol.16: 内部動作を理解して ハイパフォーマンスなサーバサイド Kotlin アプリケーションを書こう
ternbusty
3
180
Things You Thought You Didn’t Need To Care About That Have a Big Impact On Your Job
hollycummins
0
220
Introducing ReActionView: A new ActionView-Compatible ERB Engine @ Kaigi on Rails 2025, Tokyo, Japan
marcoroth
3
1k
『毎日の移動』を支えるGoバックエンド内製開発
yutautsugi
2
240
ソフトウェア設計の実践的な考え方
masuda220
PRO
4
560
Featured
See All Featured
Building a Scalable Design System with Sketch
lauravandoore
463
33k
Building Applications with DynamoDB
mza
96
6.7k
The Invisible Side of Design
smashingmag
302
51k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.6k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
9.7k
Making the Leap to Tech Lead
cromwellryan
135
9.6k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
How STYLIGHT went responsive
nonsquared
100
5.8k
Code Reviewing Like a Champion
maltzj
526
40k
Transcript
Angular×ionicプロダクトの バージョンアップとの付き合い⽅ ⼀ ノ 瀬 翔 吾 ( 友 利
奈 緒 ) 2021.11.26
⾃⼰紹介 atama plus株式会社 Product Engineer ⾃称 CDO (Chief Design System
Development Officer) Angular歴 4-5年ぐらい 友利奈緒@rettar5 2 ⼀ ノ 瀬 翔 吾
ⓒ 2021 atama plus Inc. ⾃⼰紹介 3 Angular×ionicプロダクトのバージョンアップとの付き合い⽅
ⓒ 2021 atama plus Inc. ⾃⼰紹介 4 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ atama plus
→ 会社名 atama+ →プロダクト名 スライド内で混在しますが 表記ゆれではないです
atama plus
教育に、⼈に、社会に、 次の可能性を。 教育を新しくすること。それは、社会のまんなかを新しくする こと。私たちは学びのあり⽅を進化させます。 学習を⼀⼈ひとり最適化し、「基礎学⼒」を最短で⾝につける。 そのぶん増える時間で、「社会でいきる⼒」を伸ばす。 それが私たちの⽬指すもの。⾃分の⼈⽣を⽣きる⼈を増やし、 これからの社会をつくっていきます。 M i
s s i o n atama plus
ⓒ 2021 atama plus Inc. 7 従来の勉強だけではない学びを提供する 基礎学⼒ 社会で いきる⼒
ⓒ 2021 atama plus Inc. atama plusのミッション 8 atama plus
「基礎学⼒」の習得 「基礎学⼒」の習得 「社会でいきる⼒」の習得
AI教材「atama+」を 全国の塾・予備校にSaaSモデルで提供しています。 atama+は、⼀⼈ひとりの得意、苦⼿、伸び、 つまずき、忘却度などの情報を収集・分析して、 ⼀⼈ひとりに合った「⾃分専⽤カリキュラム」を提供します。 学習をPersonalize「atama+」
ⓒ 2021 atama plus Inc. atama plusのプロダクト 10 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ Aurora/S3/CloudFront
etc Hug+Zappa AWS Lambda Cloud Functions オンライン模試 / API server contents editor micro service dev tool
ⓒ 2021 atama plus Inc. atama plusのプロダクト 11 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ atama
plusでは創業(2017年)から Angular×ionicを採⽤
ⓒ 2021 atama plus Inc. atama plusのプロダクト 12 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ atama
plusでは 3プロダクト 3プラットフォーム 合計9アプリの⾯倒を⾒てる
Angularのバージョンアップと atama plus
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 14 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ Angularバージョンアップ追従
こんな感じで進めてた
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 15 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 最近体制が変わって
ちょっと進め⽅が変わった
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 16 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 半年前までは
EOLドリブン バージョンアップ
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 17 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ いわゆる20%ルールで
有志がやってた
ⓒ 2020 atama plus Inc. 18 2017 2018 2019 2020
2021 2022 Angular 4 Angular 5 Angular 6 Angular 7 Angular 8 Angular 9 Angular 10 Angular 11 Angular 12
ⓒ 2020 atama plus Inc. 19 2017 2018 2019 2020
2021 2022 Angular 4 Angular 5 Angular 6 Angular 7 Angular 8 Angular 9 Angular 10 Angular 11 Angular 12 2 4 Angular 5 Angular 7 Angular 8 11 9 10
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 20 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 半年前の体制変更で
新しい役割のチームが爆誕
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 21 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ ※PO:プロダクトオーナー、QA:Quality
Assurance の略です スクラムマスター デザイナー エンジニア QA PO
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 22 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 開発基盤チーム
開発効率を上げるための開発や 技術中⼼で解ける課題に専念する アプリ開発チームのサブチーム
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 23 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ POで技術的課題の優先度を
判断することが難しく 技術的な課題に取り組むと デザイナーが取り組む仕事が 浮いてしまう
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 24 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ Angularのバージョンアップは
開発基盤チームがリードしてる
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 25 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ この半年で
8→9 9→10 10→11 と1つずつ上げていった
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 26 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 困ったこと
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 27 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ バージョンアップ対応の
期間が⻑いので 起票されたバグが 全部開発基盤チーム担当になる
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 28 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ atama
plusでは起票されたバグを 毎朝どのチームが担当するか 割り振り(トリアージ)してる
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 29 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 「このバグはバージョンアップの
影響じゃない?」 という理由で 開発基盤チームに回ってくる
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 30 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ しょうがないので調査して
修正までやったり (ほぼバージョンアップ 関係なかった)
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 31 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 今後こう変えていきたい
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 32 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 負債を溜めない
ちゃんとバージョンアップに 追従していく
ⓒ 2021 atama plus Inc. Angularのバージョンアップとatama plus 33 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ Angularの最新バージョン
‒ 1に 追従する⽅針なので これからAngular12にあげていきます
ionicのバージョンアップと atama plus
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 35 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ ionicのバージョンアップのためだけに
プロダクトの新規機能開発を 1ヶ⽉⽌めた
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 36 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ ionic3
→ ionic4に上げたときに めちゃくちゃ⼤変ということが 社内で認知されていたので しっかり計画⽴てて バージョンアップすることになった
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 37 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 最初に実装・テストの進め⽅や
テスト観点や 作業の並列化など バージョンアップを計画
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 38 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 1アプリだけ先⾏して
ionicのバージョンを上げ アプリを起動できる状態にする (リスクの洗い出し)
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 39 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 新規機能開発停⽌の
社内周知
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 40 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 新規機能開発停⽌期間に⼊ってから
残り2アプリの ionicをバージョンを上げ 起動できる状態にする
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 41 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ ありとあらゆる画⾯を
バージョンアップ前後で⽐較して スクショをMiroにまとめる スクショ祭りを開催
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 42 Angular×ionicプロダクトのバージョンアップとの付き合い⽅
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 43 Angular×ionicプロダクトのバージョンアップとの付き合い⽅
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 44 Angular×ionicプロダクトのバージョンアップとの付き合い⽅
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 45 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ スクショから要対応な
項⽬をチケット化し、 チームで分担して修正
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 46 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 1ヶ⽉後
新規機能開発停⽌解除 & リリース
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 47 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 今後こう変えていきたい
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 48 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ E2Eの拡充と
スクリーンショットでの差分検出
ⓒ 2021 atama plus Inc. ionicのバージョンアップとatama plus 49 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ 近々
新規機能開発停⽌ & スクショ祭り 開催予定
今⽇のおはなしのまとめ
ⓒ 2021 atama plus Inc. 今⽇のおはなしのまとめ 51 Angular×ionicプロダクトのバージョンアップとの付き合い⽅ Angularのバージョンアップを リードするチームがいる
ionicのバージョンアップは 新規機能開発を⽌めてる
ⓒ 2020 atama plus Inc. 52 @atamaplus_dev
© atama plus Inc. atama plusは、Mission driven company. ミッションの実現に向けて、常識にとらわれずに考え、議論し、 互いを尊重しながら楽しむ集団です。
⼈が全てなので、採⽤にはとてもとてもこだわってきました。 開発チームはもとより、ビジネスチームもコーポレートチームも、 全員で良いプロダクトを創る。 ⼀つの⼤きなチームとして意⾒をぶつけあいながら ⽣徒が熱狂する学びを創っていく。 そんな想いの船に⼀緒に乗って、 新しい教育を創り、社会を変えていく仲間を募集しています。 We are hiring ! 参考リンク 3 分 で わ か る a t a m a p l u s 求 ⼈ ⼀ 覧