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
Angular 4→8対応にて学んだAngularでのバージョン追従作法 / Classi A...
Search
OKUNOKENTARO
October 03, 2019
Programming
0
1.7k
Angular 4→8対応にて学んだAngularでのバージョン追従作法 / Classi Angular Night 4
2019/10/3、Classi Angular Night #4 にて発表した資料です。
OKUNOKENTARO
October 03, 2019
Tweet
Share
More Decks by OKUNOKENTARO
See All by OKUNOKENTARO
トレタO/X アーキテクチャ移行記 Next.js App Router化への道のり / TORETA TECH UPDATE 1
okunokentaro
5
11k
Podcastを継続する技術 / refactoradio-240119
okunokentaro
1
160
Webアプリケーション設計の第一歩は ディレクトリの整理から / Encraft 1
okunokentaro
34
10k
JSONとJSON Schemaを改めて理解する / tokyo_study
okunokentaro
9
2.3k
それでもどうしてRecoilを使うのか / Harajuku.ts Meetup Recoil
okunokentaro
19
5.5k
TypeScriptは10年でこんなに進化しました / TechFeed Experts Night 11
okunokentaro
6
1.7k
Hasura.io RDBをサクサク作る方法はARやO/RMだけじゃなくなりました/hasura-io
okunokentaro
5
640
コードには型アノテーションよりも要件アノテーションを増やせ!/harajukuts2
okunokentaro
14
6.3k
10年と3ヶ月でWebサービスを作った話 / Piyogrammer Conference 2021
okunokentaro
2
1k
Other Decks in Programming
See All in Programming
ISUCON14感想戦で85万点まで頑張ってみた
ponyo877
1
730
生成AIでGitHubソースコード取得して仕様書を作成
shukob
0
640
Fibonacci Function Gallery - Part 2
philipschwarz
PRO
0
220
20241217 競争力強化とビジネス価値創出への挑戦:モノタロウのシステムモダナイズ、開発組織の進化と今後の展望
monotaro
PRO
0
310
Package Traits
ikesyo
2
220
Simple組み合わせ村から大都会Railsにやってきた俺は / Coming to Rails from the Simple
moznion
3
2.9k
最近のVS Codeで気になるニュース 2025/01
74th
1
210
サーバーゆる勉強会 DBMS の仕組み編
kj455
1
310
php-conference-japan-2024
tasuku43
0
440
良いユニットテストを書こう
mototakatsu
13
3.6k
AWS Lambda functions with C# 用の Dev Container Template を作ってみた件
mappie_kochi
0
190
GitHub CopilotでTypeScriptの コード生成するワザップ
starfish719
26
6k
Featured
See All Featured
Large-scale JavaScript Application Architecture
addyosmani
510
110k
How GitHub (no longer) Works
holman
312
140k
Bootstrapping a Software Product
garrettdimon
PRO
305
110k
Java REST API Framework Comparison - PWX 2021
mraible
28
8.3k
Keith and Marios Guide to Fast Websites
keithpitt
410
22k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
20
2.4k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
6
500
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
127
18k
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
BBQ
matthewcrist
85
9.4k
The Cost Of JavaScript in 2023
addyosmani
46
7.2k
Bash Introduction
62gerente
610
210k
Transcript
"OHVMBSˠରԠʹֶͯΜͩ "OHVMBSͰͷόʔδϣϯै࡞๏ 0DU $MBTTJ"OHVMBS/JHIU !PLVOPLFOUBSP
୭ w Ԟݡଠ!PLVOPLFOUBSP w ΫϨεΣΞද w ϑϩϯ τΤϯ υ ɾ
όοΫΤϯ υ ɾ ΤϯδχΞ w "OHVMBSຊϢʔβʔձ OHLZPUPΦʔΨφΠβ
͜Ε·Ͱͷొஃ༰
ຊͷ༰ w ϨΨγʔΞϓϦέʔγϣϯͷϞμϯԽΛ࣮ࢪͨ͠ w ͲͷΑ ͏ʹܭըཱͯͯϨΨγʔΞϓϦέʔγϣϯΛҠ২͔ͨ͠ w ࠓޙͲ͏ ͍͖͍͔ͯͨ͠ɺ ԿΛݟਾ͑ͯखΛೖΕΔ͔
ϨΨγʔΞϓϦέʔγϣϯͷϞμϯԽ
ϨΨγʔΞϓϦέʔγϣϯͱ wʮϨΨγʔίʔ υվળΨΠ υʯ ͰϨΨγʔίʔ υΛ ςε τͷͳ͍ίʔ υͱఆ͍ٛͯ͠Δ w
ࠓճड़ΔϨΨγʔΞϓϦέʔγϣϯԼهΛࢦ͢ͷͱ͢Δ w ςε τ͕͋ͬͨΓͳ͔ͬͨΓ ͭͭ͠ w ͱʹ͔͘ݹ͘ w ͍ؒ୭ͷखՃΘͬͯͳ͍ͷ
ରͳʹ͔ w Նʹ։ൃ͕։࢝͞Εͨɺ ͱ͋Δཧը໘ w "OHVMBSΛར༻ w ࣌ͷݶΒΕͨਓһ ɾ Ͱָ͠
͘։ൃ ʢਪଌʣ w ࣗՆ·Ͱؔ༩͍ͯ͠ͳ͍
͔ͳΓ߈ΊͯΔ "OHVMBSͷϦ Ϧʔε݄
࣌ͷࣄ͕·͔ͬͨ͘ΒΜ w ελʔ τΞοϓ͋Δ͋Δ w ιϩϓϨʔ w ίϛ ο τϩά୭ಡ·ͳ͍ͷͰ؆ૉ
w ͦͦίʔ υ ϨϏϡʔ͢ΔΤϯδχΞ͕͍ͳ͍ w ͦͦࣾʹΤϯδχΞ͕Γͳ͍
ख͕ೖΒͳ͘ͳͬͨ w ʹͳΔʹͭΕίϛ ο τ͕ݮ͍ͬͯ͘ w ݄Λ࠷ޙʹ࣮ͦͷ·· w ݄ʹ"OHVMBS͔Βɽ ɽ
ʹରԠ w ͻͬͦ Γ ͱͰӡ༻͞Εଓ͚Δ
ϑϧϦ ϓϨʔε͔ɺ ϚΠάϨʔγϣϯ͔ w ݹ͗͢Δͷͱɺ ଞͷ༷ʑͳࣄ͋Γ৽όʔδϣϯͷ։ൃ͕ܾఆ w େͷػೳϑϧϦ ϓϨʔεͰ࣮ࢪ w
ίʔ υͷ৽Α Γ ɺ αʔϏε ɾ ཧը໘ࣗମͷ৽͕త w ͔͠͠Ұ෦ը໘Ϧ ϓϨʔεͷΛݟੵΔͱॏ͍ʜ w खೖΕ͞Ε͍ͯͳ͍͕ɺ ϚΠάϨʔγϣϯͰ͖ΔͳΒͦͷු͘ ʁ w ϚΠάϨʔγϣϯ ɾ ίε τͱ Ϧ ϓϨʔε ɾ ίε τͷఱṝʜ
ͬͯͯΑ͔ͬͨ"OHVMBS w "OHVMBS Ξοϓσʔ τʹؔ͢Δެࣜͷใɺ มߋհ͕ͱͯखް͍ϑ ϨʔϜϫʔΫ w Ͳͷόʔδϣϯ͔Βɺ Ͳͷόʔδϣϯʹ্͛Δͱ
Կ͕มΘͬͯԿΛ͖͢ͳͷ͔͕ཏ͞Ε͍ͯΔ
VQEBUFBOHVMBSJP https://update.angular.io/
ϚΠάϨʔγϣϯޭ ʂ w Ϧ ϓϨʔε͠ͳ͍Ұ෦ػೳɺ ϦχϡʔΞϧલޙͰఏڙ༰͕มΘΒͳ͍ͨΊ ϚΠάϨʔγϣϯͷ࠾༻Մೳੑ͕͋ͬͨ w "OHVMBSΛ࠾༻͍͓͔ͯͨ͛͠ͰˠՄೳͱஅ w
༷ॻͷແ͍ػೳͷ༷Ѳ͔Β࢝ΊͯϦ ϓϨʔε͢ΔΑ Γ ϚΠάϨʔγϣϯ͕ͩΖ͏ ͱஅ w ݁Ռతʹݱࡏ"OHVMBSͰݩؾʹಈ͍ͯ·͢
ϚΠάϨʔγϣϯܭը
Ͳ͏ͬͯਐΊΔ͔ w ͬͯͯΑ͔ͬͨ"OHVMBS w ͱݴ͏ ͷͷɺ ҰےೄͰ͍͔ͳ͍ w ܭըΛ࿅Δඞཁ͕͋Δ
खͰؤுΔ w ࣌"OHVMBS$-* ʢ݄ʣ w ࣗಈϚΠάϨʔγϣϯͯ͘͠ΕΔศརίϚϯ υ ng updateͷఏڙ"OHVMBS$-*
ʢ݄ʣ ͔Β w "OHVMBSˠා͍ w "OHVMBSˠ ˠΛܦͯҰ୴"OHVMBSܥʹண͢Δ w ౖ౭ͷίϛ ο τΛ͝հ
"OHVMBSˠͦͷલʹʜ w ͦͦ࣌ /PEFKTͷόʔδϣϯ͍ͭ͘ɺ OQN͍ͭ͘Ͱಈ͍͍ͯͨͷ͔͢Βෆ໌ w ։ൃڥͷ࠶ݱ͢Βࠔ w ͱ Γ͋͑ͣ։ൃ͕ࢭ·ͬͨ࣌ظ͔Βٯࢉͯ͠
ʮ/PEFKT͜ΕͩΖ͏ɺ ͦͷͱ͖ʹಉࠝ͞ΕΔOQN͜Εͷͣʯ ͱ͍͏ԾఆͰߏங w ڭ܇ ɿ .node-version, package.json engine, README.md ͳͲΛ ࠒ͔Βϝϯς͓ͯ͘͠
ΞʔΩςΫνϟͷζϨ w ϨΨγʔΞϓϦͷׂͷػೳ (JU)VCͷผϦϙδτ ϦʹͯϦ ϓϨʔε։ൃΛਐΊ͍ͯΔ w ཧը໘ͷ͏ ͪΘ͔ͣը໘͚ͩΛϚΠάϨʔγϣϯ͍ͨ͠ w
ͨͩ͠ Ϧ ϓϨʔεଆͷΞʔΩςΫνϟͱͷ߹ੑօແ
Ϟϊ Ϩϙ͔Βͷϋʔ υϑΥʔΫઓུ w ϨΨγʔΞϓϦ͔ΒࢠΞϓϦΛ࡞ΓϞϊ ϨϙߏΛऔΔ w ࢠΞϓϦͷΈ"OHVMBS
ͱਐΊΔ w ࢠΞϓϦ͕"OHVMBSʹϚΠάϨʔγϣϯྃͨ͠Β ৽ ɾ ΞϓϦͷࢠʹͳΔΑ ͏ϋʔ υϑΥʔΫ w ৽ ɾ ΞϓϦ͕ࢠΞϓϦͷίϯϙʔωϯ τΛ෦తʹऔΓࠐΉ w ʂ ʂ
ਤղ ϨΨγʔ Ϧ ϓϨʔε ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ
ਤղ ϨΨγʔ ϨΨγʔࢠ ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF Ϧ ϓϨʔε ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ
ਤղ ϨΨγʔ ϨΨγʔࢠ ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF Ϧ
ϓϨʔε ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ
ਤղ ϨΨγʔ ϨΨγʔࢠ ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF $PNQPOFOUͱ 4FSWJDF Ϧ ϓϨʔε
ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ
ਤղ ϨΨγʔ ϨΨγʔࢠ ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF $PNQPOFOUͱ 4FSWJDF Ϧ ϓϨʔε
ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ
ਤղ ϨΨγʔ ϨΨγʔࢠ ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF $PNQPOFOUͱ 4FSWJDF Ϧ ϓϨʔε
ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ
ਤղ ϨΨγʔ ϨΨγʔࢠ ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF $PNQPOFOUͱ 4FSWJDF Ϧ ϓϨʔε
ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ
Ϧ ϓϨʔε ϨΨγʔࢠ $PNQPOFOUͱ 4FSWJDF ਤղ ϨΨγʔ ϨΨγʔࢠ ϨΨγʔ͕͏ $PNQPOFOUͱ
4FSWJDF $PNQPOFOUͱ 4FSWJDF ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ
Ϧ ϓϨʔε ϨΨγʔࢠ ਤղ ϨΨγʔ ϨΨγʔࢠ ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF $PNQPOFOUͱ
4FSWJDF ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ $PNQPOFOUͱ 4FSWJDF
Ϧ ϓϨʔε ਤղ ϨΨγʔ ϨΨγʔ͕͏ $PNQPOFOUͱ 4FSWJDF ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ $PNQPOFOUͱ
4FSWJDF
Ϧ ϓϨʔε ਤղ ͪΌΜͱઃܭ͞Εͨ ΞʔΩςΫνϟ $PNQPOFOUͱ 4FSWJDF
"OHVMBSˠ w ݹ͍ίʔ υελΠϧ༰ࣻͳ͘QSFUUJFSͰܗ w "OHVMBSˠ@angular/http͔Β@angular/common/http HttpClientͷҠߦَ͕ w ࣗۀ্ɺ ௨ࢉճͷHttpClientҠߦͩͬͨͷͰॗʑ
ͱਐΊΔ w ్தBOZͩΒ͚ͩͬͨͱ͜ΖΛܕ͚͍ͨ͠ؾ͙࣋ͪͬͱת͑Δ w ڭ܇ৗࠒBOZΘͣʹ͍Δ͠
"OHVMBSˠ w "OHVMBS$-*ొ w .angular-cli.json͔Βangular.jsonͷม͕ࢁ w ઌʹ$-*ͷΈαϙʔ τόʔδϣϯΛ্͔͛ͯΒ ng update
@angular/coreͰมରԠ w ຯʹ3Y+4ˠͷํ͕ॏ͍͜ͷϑΣʔζ w .pipe()ͷॻ͖͑Λͻͨ͢Βॗʑ ͱߦ͏ w େBOZͳ··ͳͷͰɺ ৗʹมߋͨ͠ΒରػೳΛखಈσόοά ʢςε τͳ͍ʣ
"OHVMBSˠ w OHVQEBUFΛखʹೖΕͨͷͰͬͪ͜ͷΜ w ͳΜͱ"OHVMBS͔Βͷίϛ ο τΘ͔ͣͭ
"OHVMBSˠ w OHVQEBUFΛखʹೖΕͨͷͰͬͪ͜ͷΜ w ͳΜͱ"OHVMBS͔Βͷίϛ ο τΘ͔ͣͭ
OHVQEBUFΛ৴͡Ζ w "OHVMBSਓձͬΆ͍͕ ʮ͔ͭͯͷϚΠάϨʔγϣϯࠎ͕ંΕͨʯ w ࠓͷ"OHVMBSͱʹ͔͘ w શવࠎંΕͳ͍ͷͰɺ ͪΌΜͱ࠷৽൛͕ग़ͨΒ֬อ্ͯ͛͠Α
͏ ʂ w ͪͳΈʹࠓճͷˠʹֻ͔ͬͨਓ ʢ˞ϏδωεѲ͕ࡁΜͰ͓Γը໘ͷΈҠ২ͱ͍͏݅ͳͷͰɺ ৗʹ͜ͷͰରԠͰ͖ͳ͍Ͱ͢ʣ
ࠓޙͷϦ ϑΝΫλ Ϧ ϯάํ
ͳʹͱ͋Εܕ͚ w BOZ͕͋· Γʹଟ͍ͷͰॱ࣍ܕ͚ w ಛʹ!0VUQVUͷnew EventEmitter<any>() ԿΛૹͬͯͲ͏͍ͬͯΔͷ͔ɺ ·ΔͰ͑ͳ͍ͷͰૣظʹखೖΕ w
3&45"1*Λୟ͘पลશମతʹBOZͰࠔΔͷͰखೖΕ w ৫͕ٸͷϑΣʔζ͔ΒظͷϑΣʔζʹҠͬͨͷͰ ࣌ؒΛ੯͠·ͣஸೡʹܕ͚
ͳϑΝΠϧΛআڈ w ͨͱ͑constructorͷॻ͔Ε͍ͯͳ͍4FSWJDF w Ұग़ͯ͜ͳ͍this w ͜͏͍ͬͨؔूͷΑ ͏ͳϢʔςΟ ϦςΟ ɾ
αʔϏεͲΜͲΜআڈ w ϝ ιο υΛ७ਮͳؔͱ ͯ͠Γग़ͯ͠୯ମςε τΛॆ࣮ͤ͞Δ
৽ΞʔΩςΫνϟʹԊΘͤΔ w େͷίʔ υ ʮಈ͍͍ͯΔͷͰͳ͍ʯ w Կ͕͔ͱ͍͏ ͱ ʮͳͥͦ͜ʹॻ͍ͨͷ͔ʯ
w ΞʔΩςΫνϟҙ͕ࣝݱࡏͱҟͳΔࠒͷίʔ υ ʢಛʹελʔ τΞοϓॳظͩͱʣ 'BUʹͳΓ͕ͪ w 'BUͳॲཧͦͷͷͷϦ ϑΝΫλ Ϧ ϯάΛͭͿͬͯɺ ߦ୯ҐͰϑΝΠϧׂ w ϑΝΠϧׂͱ ϑΝΠϧ໊͚͕ஸೡʹͳΔ͚ͩͰՄಡੑ͔ͳΓ্͕Δ w ܕ͚͕ेʹͳΕϑΝΠϧׂલޙͷίϯύΠϧอূͰ͔ͳΓ҆৺ײΛಘΔ
ݹ͍ίʔ υਖ਼ͳΜͱ͔ͳΔ w 'BUͳͷ͕ࢥߟΛࢭΊΔݪҼ w ߦͷݹ͍ίʔ υಡΊͳ͍ w Θ͔ͣߦͷݹ͍ίʔ υͩͬͨΒಡΊΔ
w ݹ͍ίʔ υͷϦ ϑΝΫλ Ϧ ϯάΑ Γɺ ࣮Λ͍͡Βͳ͍ϑΝΠϧׂͷ΄͏͕ අ༻ରޮՌ͕ߴ͘ɺ Τϯόάආ͚͍͢ w ຊʹՄಡੑʹ͕͋Δίʔ υͷϦ ϑΝΫλ Ϧ ϯάͷͨΊͳΒ ୯ମςε τΛશྗͰॻ͘
w ελʔ τΞοϓ͋Δ͋Δͱ ͯ͠ ॳظͷϓϩάϥϛϯάࢥͱɺ தظϑΣʔζͷࢥҰக͠ͳ͍ w ࣌ͷΤϯδχΞʹ ʮʹͳͬͯεϜʔζʹಡΊΔΑ ͏ʹॻ͚ʯ
ͱݴ͏ͷ͓ҧ͍ w ຊؾΛग़ͤͪΌΜͱϚΠάϨʔγϣϯͰ͖Δ w ͦͷͱ͖උͰ͖Δਓ͕ͪΌΜͱඋ͍ͯ͘͠ w ϘʔΠεΧ τͷεϩʔΨϯͷળߦΛҙࣝ ʢ ʰϓϩάϥϚ͕Δ͖ͷ͜ͱʱ Α Γʣ ૯ׅ
5IBOLZPV