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
NgRxは入れるだけでいいのか? 発生する懸念と考えられるアーキテクチャ / NgRx Ar...
Search
OKUNOKENTARO
March 27, 2019
Technology
7
2.5k
NgRxは入れるだけでいいのか? 発生する懸念と考えられるアーキテクチャ / NgRx Architecture
2019年3月27日、Classi Angular Night #2にて発表した資料です。
OKUNOKENTARO
March 27, 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
170
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
650
コードには型アノテーションよりも要件アノテーションを増やせ!/harajukuts2
okunokentaro
14
6.3k
10年と3ヶ月でWebサービスを作った話 / Piyogrammer Conference 2021
okunokentaro
2
1k
Other Decks in Technology
See All in Technology
Iceberg Meetup Japan #1 : Iceberg and Databricks
databricksjapan
0
310
コンテナサプライチェーンセキュリティ
kyohmizu
1
130
開発組織を進化させる!AWSで実践するチームトポロジー
iwamot
1
150
日経のデータベース事業とElasticsearch
hinatades
PRO
0
210
サイト信頼性エンジニアリングとAmazon Web Services / SRE and AWS
ymotongpoo
7
1.3k
Cracking the Coding Interview 6th Edition
gdplabs
14
28k
偏光画像処理ライブラリを作った話
elerac
1
160
【内製開発Summit 2025】イオンスマートテクノロジーの内製化組織の作り方/In-house-development-summit-AST
aeonpeople
2
540
遷移の高速化 ヤフートップの試行錯誤
narirou
6
1k
Active Directory攻防
cryptopeg
PRO
8
5.3k
プロダクトエンジニア 360°フィードバックを実施した話
hacomono
PRO
0
140
OPENLOGI Company Profile for engineer
hr01
1
20k
Featured
See All Featured
A better future with KSS
kneath
238
17k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
The Pragmatic Product Professional
lauravandoore
32
6.4k
The Invisible Side of Design
smashingmag
299
50k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
30
4.6k
Making the Leap to Tech Lead
cromwellryan
133
9.1k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
6
570
Automating Front-end Workflow
addyosmani
1368
200k
Fontdeck: Realign not Redesign
paulrobertlloyd
83
5.4k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
We Have a Design System, Now What?
morganepeng
51
7.4k
Adopting Sorbet at Scale
ufuk
74
9.2k
Transcript
/H3YೖΕΔ͚ͩͰ͍͍ͷ͔ ൃੜ͢Δݒ೦ͱߟ͑ΒΕΔΞʔΩςΫνϟ .BS $MBTTJ"OHVMBS/JHIU
୭ w Ԟݡଠ!PLVOPLFOUBSP w ΫϨεΣΞද w ΞϓϦέʔγϣϯ ɾ ΤϯδχΞ w
"OHVMBSຊϢʔβʔձ OHLZPUPΦʔΨφΠβ
ຊͷ༰ w ͳͥΞʔΩςΫνϟΛߟ͑Δඞཁ͕͋Δ͔ w /H3YԿΛॿ͚Δ͔ w /H3YԿΛॿ͚ͯ͘Εͳ͍͔
ͳͥΞʔΩςΫνϟΛߟ͑Δඞཁ͕͋Δ͔
ੲ 5FNQMBUF)5.- "OHVMBS+4OHDPOUSPMMFS IUUQ "OHVMBS+4'JMUFS
"OHVMBSWFS 5FNQMBUF)5.- !$PNQPOFOU )UUQ !BOHVMBSIUUQ "OHVMBS1JQF
"OHVMBSWFS 5FNQMBUF)5.- !$PNQPOFOU )UUQ$MJFOU !BOHVMBSDPNNPOIUUQ "OHVMBS1JQF
ྺ࢙ͷੵ 5FNQMBUF)5.- !$PNQPOFOU )UUQ$MJFOU !BOHVMBSDPNNPOIUUQ "OHVMBS1JQF
4FSWJDFΛ࡞ͬͯΈΔ 5FNQMBUF)5.- !$PNQPOFOU )UUQ$MJFOU !BOHVMBSDPNNPOIUUQ "OHVMBS1JQF 6TFST4FSWJDF "QJ4FSWJDF
ͳΜͪΌΒ4FSWJDF૿͑͗͢ 5FNQMBUF)5.- !$PNQPOFOU )UUQ$MJFOU !BOHVMBSDPNNPOIUUQ "OHVMBS1JQF 6TFST4FSWJDF "QJ4FSWJDF 4PNFUIJOH"QJ1BSBNT#VJME4FSWJDF "OZUIJOH7BMVFT.FSHF4FSWJDF
"VUI4FSWJDF (VBSE4FSWJDF 6MUSB(SFBU4FSWJDF
͜ΕΛ 5FNQMBUF)5.- !$PNQPOFOU )UUQ$MJFOU !BOHVMBSDPNNPOIUUQ "OHVMBS1JQF
͜͏ ͚ͨͩ͠ 5FNQMBUF)5.- !$PNQPOFOU )UUQ$MJFOU !BOHVMBSDPNNPOIUUQ "OHVMBS1JQF 6TFST4FSWJDF "QJ4FSWJDF 4PNFUIJOH"QJ1BSBNT#VJME4FSWJDF
"OZUIJOH7BMVFT.FSHF4FSWJDF "VUI4FSWJDF (VBSE4FSWJDF 6MUSB(SFBU4FSWJDF
ͳͥ4FSWJDF͕૿͑Δͷ͔ w ڊେͳDMBTTͷղΛ೦಄ʹஔ͍ͯ͠·ͬͯͳ͍͔ w ͦͷ4FSWJDF͕ ʮԿΛ͢ΔͨΊͷ4FSWJDF͔ʯ ։ൃऀ͕ࣗཧղ͍ͯ͠Δ͔ w ͨͩͷॲཧ܈ʹ໊લۭؒΛ༩͚͑ͨͩʹͳ͍ͬͯͳ͍͔
ͳͥ4FSWJDF͕ඞཁͳͷ͔Λߟ͑Δ w ·ͣ"OHVMBSελΠϧΨΠ υʹै͏ͷྑ͍ϓϥΫςΟ ε w ࣍ʹҋӢʹ4FSWJDFΛ࡞Δ͜ͱΛආ͚ɺ ඞવతͳ4FSWJDFΛ࡞ΔΑ ͏ʹ͢Δ w
431 ʢ4JOHMF3FTQPOTJCJMJUZ1SJODJQMF୯Ұݪଇʣ ʹϐϯͱདྷͳ͚Ε ͦͷ4FSWJDFͷΞϓϦέʔγϣϯͰͷݱࡏҐஔΛѲ͢Δ
աڈεϥΠ υΑ ΓҾ༻ https://speakerdeck.com/okunokentaro/angularzhong-da-gui-mo-apurishe-ji?slide=13 https://speakerdeck.com/okunokentaro/angularzhong-da-gui-mo-apurishe-ji?slide=25 https://speakerdeck.com/okunokentaro/frontend-conference-fukuoka-2018?slide=63
Ϟμϯ8FCΞϓϦέʔγϣϯ͕Γ͍ͨ͜ͱ ௨৴͍ͨ͠ ඳը͍ͨ͠
ݱࡏҐஔΛҙࣝͨ͠ઃܭ $PNQPOFOUඳըدΓ )UUQ$MJFOU௨৴ৄࡉͷӅṭ 3FQPTJUPSZ௨৴دΓ 5FNQMBUFඳը "QJ4FSWJDF௨৴ 'BDBEF.FEJBUPSඳը㲗௨৴ؒͷநԽ ࠓॻ͍ͯΔίʔ υɺ
ඳըدΓ ʁ ௨৴دΓ ʁ ։ൃऀಉ࢜ͷ ڞ௨ೝࣝΛ࣋ͭ
ͳͥ͜ΕͰͩΊ͔ ௨৴ ඳը
ͯ͢ςε τͷͨΊ ඳըͷςετΛ͘͢͢͠Δ ௨৴ औಘͨ͠ΤϯςΟςΟͷू߹ͳͲΛςετ͘͢͢͠Δ ඳը ࣮ࡍʹ௨৴ͤͣύϥϝʔλʹ͍ͭͯςετΛ͘͢͢͠Δ %0.ࣝΛؚ·ͳ͍ϩδοΫͷςετΛ͘͢͢͠Δ %3:ͱ͔ 40-*%ݪଇͱ͔͋Δ͚Ͳ
શ෦ςε τͷͨΊͷ Α ͏ͳΜ
ͦͷ4FSWJDFͳΜͷͨΊ ʁ ඳըͷςετΛ͘͢͢͠ΔͨΊʁ ௨৴ औಘͨ͠ΤϯςΟςΟͷू߹ͳͲΛςετ͘͢͢͠ΔͨΊʁ ඳը ࣮ࡍʹ௨৴ͤͣύϥϝʔλʹ͍ͭͯςετΛ͘͢͢͠ΔͨΊʁ %0.ࣝΛؚ·ͳ͍ϩδοΫͷςετΛ͘͢͢͠ΔͨΊʁ
/H3YԿΛॿ͚Δ͔
/H3YԿ͔ w /H3YΞʔΩςΫνϟͰͳ͍ w ௨৴ʹΑͬͯऔಘͨ͠σʔλɺ Ϣʔβͷૢ࡞ʹΑͬͯੜ·ΕͨมΛ ֨ೲ͓ͯͨ͘͠Ίͷγϯάϧ τϯ w -B[ZMPBEΛߟྀ͢Δͱඞਢͷػߏ
w /H3Yʹ֨ೲ͞Εͨ܈Λ༻͢Δखஈͷఏڙͱ ύϑΥʔϚϯεʹؔ͢ΔॲཧͷӅṭ
/H3YΛΘͳ͍ͱ͖ $PNQPOFOU )UUQ$MJFOU 3FQPTJUPSZ 5FNQMBUF "QJ4FSWJDF 'BDBEF.FEJBUPS new ReplaySubject() new
ReplaySubject() new ReplaySubject() new ReplaySubject()
/H3YΛಋೖ )UUQ$MJFOU 5FNQMBUF /H3Y $PNQPOFOU "QJ4FSWJDF
/H3YԿΛॿ͚ͯ ͘Εͳ͍͔
༉அ͢Δͱ͜͏ͳΔ )UUQ$MJFOU 5FNQMBUF /H3Y 'FBUVSF 'FBUVSF $PNQPOFOU "QJ4FSWJDF 4FMFDUPS 4FMFDUPS
4FMFDUPS 4FMFDUPS 4FMFDUPS 4FMFDUPS 4FMFDUPS &GGFDUT &GGFDUT &GGFDUT &GGFDUT &GGFDUT &GGFDUT /H3YΞʔΩςΫνϟ Ͱͳ͍ ผ్ߟ͑Δඞཁ͕͋Δ
/H3Y ϨΠϠʔΛҙࣝͨ͠/H3YͷཱͪҐஔ $PNQPOFOUը໘ͰͰ͖Δ͜ͱͱɺࣸ͢ͷΛհ 5FNQMBUFը໘ )UUQ$MJFOU 3FQPTJUPSZ "QJ4FSWJDF 2VFSJFT ͦͷը໘ʹԿΛࣸ͢ʁ $PNNBOET
ͦͷը໘ͰԿ͕Ͱ͖Δʁ 'FBUVSF 'FBUVSF 'FBUVSF 'FBUVSF
&GGFDUTิࠤ 5FNQMBUFը໘ )UUQ$MJFOU 3FQPTJUPSZ "QJ4FSWJDF 2VFSJFT ͦͷը໘ʹԿΛࣸ͢ʁ $PNNBOET ͦͷը໘ͰԿ͕Ͱ͖Δʁ /H3Y&GGFDUT
$PNQPOFOUը໘ͰͰ͖Δ͜ͱͱɺࣸ͢ͷΛհ /H3Y 'FBUVSF 'FBUVSF 'FBUVSF 'FBUVSF
&GGFDUTଟ༻͠ͳ͍ w ෭࡞༻͕ଘࡏ͠ͳ͍ͳΒɺ 9)3͕བྷΉͱ͍͏͚ͩͰ&GGFDUTΛ༻͠ͳ͍ w UBQ ͕ग़ͯ͜ͳ͚Ε&GGFDUTͰ͋Δඞཁ΄΅ແ͍ • https://www.notion.so/Learn-NgRx-a6fa8691e2584682949852183254bebd
4FMFDUPSΛཧղ͢Δ w $PNQPOFOUʹTFMFDU ͷࢁΛங͍͍ͯͳ͍͔ w UIJTTUPSFEJTQBUDITVCTDSJCFͰ͖ΔҰํɺ ςε τ͠ʹ͍͘ 'BDBEFͳΓ.FEJBUPSͳΓͰӅṭ͢Δ w
લͷਤͩͱ$PNNBOET 2VFSJFTͱͯ͠Ϋϥε໊ʹσʔλϑϩʔํΛ໌ه ʢ$234ΞʔΩςΫνϟΑ Γணʣ w 'FBUVSFͷࡉԽ͗͢͠ʹཁҙ ࡉԽ͗ͯ͢͠͠·ͬͨͳΒ2VFSJFTͰґଘΛٵऩ w $PNQPOFOUͰେྔͷ4FMFDUPSʹґଘ͠ͳ͍ ʢґଘੑೖͷԸܙ͕ಘΒΕͳ͍ʣ
ͳΜͷͨΊͷ4FSWJDF͔ҙࣝ͢Δ w ΞϓϦέʔγϣϯશମʹ͓͍ͯ ֤͕ࣗࣗԿΛ͖͢DMBTTͳͷ͔ҙࣝͤΑ w ͯ͢Λ ʮͳΜͪΌΒ4FSWJDFʯ ʹ͢Δ ͘ Β͍ͳΒ
ׂ͍ͬͦΛϋοΩ Ϧ ໋໊ͤͨ͞ͷ΄͏͕Α͍ ʢ˞ͨͩ͠"OHVMBSελΠϧΨΠ υ֎ʣ
5IBOLZPV গ͠ͷͰߴ͍ੜ࢈ੑΛ