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
150
Angularを採用したプロダクトで表記ゆれを撲滅したはなし
rettar5
2
2.4k
カベを壊せ!「機械学習」×「グラフデータベース」×「チャット」で繋ぐヒューマンリレーションシップ!!
rettar5
0
1.2k
Other Decks in Programming
See All in Programming
Rubyでやりたい駆動開発 / Ruby driven development
chobishiba
1
710
Blazing Fast UI Development with Compose Hot Reload (droidcon New York 2025)
zsmb
1
290
20250704_教育事業におけるアジャイルなデータ基盤構築
hanon52_
5
790
第9回 情シス転職ミートアップ 株式会社IVRy(アイブリー)の紹介
ivry_presentationmaterials
1
320
10 Costly Database Performance Mistakes (And How To Fix Them)
andyatkinson
0
340
XP, Testing and ninja testing
m_seki
3
240
Hack Claude Code with Claude Code
choplin
4
2.1k
iOS 26にアップデートすると実機でのHot Reloadができない?
umigishiaoi
0
130
PostgreSQLのRow Level SecurityをPHPのORMで扱う Eloquent vs Doctrine #phpcon #track2
77web
2
530
Quand Symfony, ApiPlatform, OpenAI et LangChain s'allient pour exploiter vos PDF : de la théorie à la production…
ahmedbhs123
0
190
0626 Findy Product Manager LT Night_高田スライド_speaker deck用
mana_takada
0
170
PHP 8.4の新機能「プロパティフック」から学ぶオブジェクト指向設計とリスコフの置換原則
kentaroutakeda
2
900
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.9k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Facilitating Awesome Meetings
lara
54
6.4k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.4k
The Cost Of JavaScript in 2023
addyosmani
51
8.5k
We Have a Design System, Now What?
morganepeng
53
7.7k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
281
13k
The Pragmatic Product Professional
lauravandoore
35
6.7k
How STYLIGHT went responsive
nonsquared
100
5.6k
Gamification - CAS2011
davidbonilla
81
5.4k
Balancing Empowerment & Direction
lara
1
430
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 求 ⼈ ⼀ 覧