宣言的UIの状態管理とアーキテクチャSwiftUIとGraphQLによる実践/swiftui-graphql

1 એݴత6*ͷঢ়ଶ؅ཧͱΞʔΩςΫνϟ 4XJGU6*ͱ(SBQI2-ʹΑΔ࣮ફ J04%$ !TPOBUBSEͦͳଠ

Appify Technologies CTO ͦͳଠ @sonatard

3 "QQJGZ w 4IPQJGZɺ#"4&ͷJ04ɺ"OESPJEͷΞϓϦΛ/P$PEFͰϦϦʔε͢ΔαʔϏε w ؅ཧը໘͔ΒωΠςΟϒΞϓϦͷσβΠϯΛಈతʹ͕มߋՄೳ 8FC7JFXͰ͸ͳ͍ w %SPJE,BJHJͰൃද༧ఆͰ͢
w ΦϑϥΠϯళฮͱͷ࿈ܞ w όοΫΤϯυ w ($1ɺ(P w ࣾһਓ w ۀ຿ҕୗɺ෭ۀਓ w ࠾༻ w IUUQTBQQJGZJODDPNKPC

͸͡Ίʹ

5 ͸͡Ίʹ w 3FBDU͕ීٴͯ͠Ҏ߱(6*ϑϨʔϜϫʔΫͷଟ͘͸એݴత6*ʹͳΓ·ͨ͠ w ϑϩϯτΤϯυ w 3FBDUɺ7VFKTɺ"OHVMBS w ΞϓϦ
w 4XJGU6*ɺ+FUQBDL$PNQPTFɺ'MVUUFSɺ3FBDU/BUJWF w ·ͨએݴత6*ͷ͓͔͛Ͱ7JFX͕ঢ়ଶΛ࣋ͨͳ͘ͳΓɺ1SFTFOUBUJPO%PNBJO4FQBSBUJPO ͕ଅਐ͞Ε7JFXͷ։ൃ͕͠΍͘͢ͳΓ·ͨ͠ɻ 6*7JFX 4UBUF

6 ͸͡Ίʹ w ͔͠͠ঢ়ଶ͕ͳ͘ͳͬͨΘ͚Ͱ͸ͳ͍ͨΊɺঢ়ଶΛ؅ཧΛ͢Δඞཁ͕͋Γ·͢ɻ w ͦͷΑ͏ͳதɺ'MVYɺ3FEVYɺ5IF$PNQPTBCMF"SDIJUFDUVSFͳͲଟ͘ͷঢ়ଶ؅ཧख๏ ͕ొ৔͖ͯ͠·ͨ͠ɻ w ͞Βʹ͜͜਺೥Ͱ͸(SBQI2-͕ొ৔ͨ͜͠ͱͰେ͖͘ύϥμΠϜγϑτ͕ى͜Ζ͏ͱ͠ ͍ͯ·͢ɻ
w ຊൃදͰ͸ɺଟ͘ͷΞʔΩςΫνϟ͕ొ৔͖ͯͨ͠ྺ࢙ΛḷΓͳ͕ΒɺͦΕͧΕͷղܾ ͨ͠՝୊ͱ๊͑Δ՝୊Λઆ໌͠ɺ࠷ऴతʹ(SBQI2-͕ղܾ͢Δ՝୊Λઆ໌͠·͢ɻ

એݴత6*ͷঢ়ଶ؅ཧͱΞʔΩςΫνϟͷඞཁੑ

8 એݴత6*ͷঢ়ଶ؅ཧͱΞʔΩςΫνϟͷඞཁੑ w ΞʔΩςΫνϟΛߟ͑ͳͯ͘΋ಈ͘΋ͷ͸࡞Δ͜ͱ͕Ͱ͖·͢ɻ w ͔͠͠νʔϜͱͯ͠։ൃ্͍ͯ͘͠Ͱ͸ɺΞʔΩςΫνϟΛܾఆ͠ɺ౷Ұͨ͠ํ਑Ͱ ίʔυΛॻ͘͜ͱ͸։ൃੜ࢈ੑͷ޲্ͷͨΊʹආ͚ΒΕ·ͤΜɻ w ·ͨ։ൃੜ࢈ੑΛ্͛Δ͜ͱ͸ɺϓϩμΫτͷͨΊʹͱͯ΋େ੾Ͱ͢ w
ϢʔβͷϑΟʔυόοΫΛߴස౓Ͱड͚Δ͜ͱ͕Ͱ͖Δ w ࢢ৔ʹઌߦͰ͖Δ w গਓ਺ͷ։ൃνʔϜͰ։ൃՄೳʹͳΓɺίϛϡχέʔγϣϯίετ͕௿Լ͢Δ w ৽نͷΤϯδχΞ͕։ൃʹࢀՃ͢Δϋʔυϧ͕Լ͕Δ

9 એݴత6*ͷঢ়ଶ؅ཧͱΞʔΩςΫνϟͷඞཁੑ w ҰํͰΞʔΩςΫνϟʹڽΓ͗ͯ͢͠·͍։ൃ଎౓্͕͕Βͳ͍͜ͱ͕͋Γ·͢ w ௕ظతࢹ఺Λॏࢹͯ͠੹຿ͷ෼ׂ΍ਖ਼͠͞Λ௥ٻ͠ա͗Δ͜ͱ͕໨తʹͳͬͯ͠·͏ w ৑௕ͳίʔυ͕૿͑ͯ͠·͏ w ݕ౼ࣄ߲͕૿͑ͯ͠·͏
w ͜ΕͰ͸ίʔυͷ౷Ұ͸Ͱ͖͍ͯͯ΋ɺ୹ظతͳ։ൃ଎౓্͕͕Γ·ͤΜɻ w Ӭଓతʹ୹ظతͳ։ൃ଎౓্͕͕Βͳ͚Ε͹௕ظతͳ։ൃ଎౓΋্͕Γ·ͤΜɻ w ͦͷͨΊ౷Ұੑͱγϯϓϧ͞ͷόϥϯεͷऔΕͨΞʔΩςΫνϟ͕ඞཁͱͳΓ·͢ɻ

એݴత6*ͷঢ়ଶ؅ཧͱΞʔΩςΫνϟͷ໨ࢦ͢΂͖ΰʔϧ

11 એݴత6*ͷঢ়ଶ؅ཧͱΞʔΩςΫνϟͷ໨ࢦ͢΂͖ΰʔϧ w γϯϓϧͳΞʔΩςΫνϟΛ໨ࢦͨ͢Ίʹ͸ɺ൓෮తͳ࣮૷Λ༰қʹ࣮ݱͰ͖Δ͜ͱ͕ େ੾Ͱ͢ɻ w ΫϥΠΞϯτ։ൃͷதͰͷେ͖ͳ໾ׂͱͯ͠ҎԼͷ͕ͭ͋Γ·͢ɻ "1*ϦΫΤετͰσʔλΛऔಘ͢Δ
7JFX͕σʔλΛड͚औΓදࣔ͢Δ w ߋʹҰൠతʹ͸ΞϓϦͱͯ͠ͷύϑΥʔϚϯεͷͨΊʹ͸ҎԼΛ࣮ࢪ͠·͢ɻ w "1*͔Βऔಘͨ͠σʔλΛӬଓԽͯ͠࠶ར༻͢Δ w ͭ·Γ͜ΕΒΛγϯϓϧʹ࣮૷Ͱ͖Δͱɺཧ૝తͳΞʔΩςΫνϟΛ࣮ݱͰ͖ͦ͏Ͱ ͢ɻ

12 એݴత6*ͷঢ়ଶ؅ཧͱΞʔΩςΫνϟͷ໨ࢦ͢΂͖ΰʔϧ 3PPU7JFX\ "1*ϦΫΤετʹΑΓσʔλΛऔಘ EBUB"1*ϦΫΤετ ϦΫΤετ಺༰ σʔλΛ7JFXʹ౉ͯ͠දࣔ͢Δ 7JFX EBUBWJFX
7JFX EBUBWJFX ^ 7JFX WJFX \ 5FYU WJFXOBNF 5FYU WJFXBHF ^ 7JFX WJFX \ 5FYU WJFXUJUMF *NBHF WJFXJNBHF63- ^ w ͦͷͨΊʹ͸ҎԼͷίʔυ͚ͩଘࡏ͢Δ͜ͱ͕ཧ૝తͰ͢ w ͜Ε͚ͩͳΒզʑ͕࣮૷࣌ʹߟ͑Δ͜ͱͱ࣮૷ͷରԠ͕औΕ͓ͯΓɺͱͯ΋௚઀తʹཧ ղͰ͖Δίʔυͱݴ͑·͢ɻ

13 એݴత6*ͷঢ়ଶ؅ཧͱΞʔΩςΫνϟͷ໨ࢦ͢΂͖ΰʔϧ w ຊൃදͰ͸ɺ͜ͷΑ͏ͳίʔυΛ4XJGU6*ͱ(SBQI2-ʹΑΓ࣮ݱ͠·͢ɻ w ·ͨ͜ΕΛ࣮ݱͰ͖ΔΑ͏ʹͳΔ·Ͱͷએݴత6*ΞʔΩςΫνϟͷྺ࢙తมભ΋঺հ͠ ·͢ɻ

એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙

15 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙ 4UBSU 'MVY 3FEVY -JGUJOH 4UBUF6Q 5$" 3FEVY 5PPM,JU
35, 2VFSZ (SBQI2- 3FBDU 2VFSZ 3FBDUDPSF νʔϜͷࢥ૝ ΫϥΠΞϯτ Ωϟογϡ ୯ํ޲σʔλϑϩʔ 3FEVYͷվྑ ϘΠϥʔ ςϯϓϨʔτͷ࡟ݮ 3FDPJM 4UBUFߋ৽ͷ ఻೻Λ7JFX͔Β෼཭ 4JOHMF4PVSDFPG5SVUI ΫϥΠΞϯτ ΩϟογϡΛ3FEVYͰ࣮ݱ ΫϥΠΞϯτ ΩϟογϡΛ3&45Ͱ࣮ݱ ࠓճ໨ࢦ͢ΰʔϧ

17 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY 4UBSU 'MVY 3FEVY -JGUJOH 4UBUF6Q 5$" 3FEVY 5PPM,JU
35, 2VFSZ (SBQI2- 3FBDU 2VFSZ 3FBDUDPSF νʔϜͷࢥ૝ ΫϥΠΞϯτ Ωϟογϡ 3FEVYͷվྑ ϘΠϥʔ ςϯϓϨʔτͷ࡟ݮ 3FDPJM 4UBUFߋ৽ͷ ఻೻Λ7JFX͔Β෼཭ 4JOHMF4PVSDFPG5SVUI ΫϥΠΞϯτ ΩϟογϡΛ3FEVYͰ࣮ݱ ΫϥΠΞϯτ ΩϟογϡΛ3&45Ͱ࣮ݱ ୯ํ޲σʔλϑϩʔ

18 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY w 'MVY͸'BDFCPPL͕ఏএͨ͠ঢ়ଶ؅ཧͷΞʔΩςΫνϟͰ͢ɻ w ޿ࠂνʔϜͷ+JOH$IFO͕ఏҊʁ3FBDUDPSFνʔϜఏҊͰ͸ͳ͍ɻ w "DUJPO͕ൃߦ͞ΕΔͱ%JTQBUDIFSʹ"DUJPO͕౉͞Εͯɺର৅ͷ"DUJPOΛड͚औΔ΂͖ 4UPSF͢΂ͯʹ௨஌͞Ε·͢ɻ w
ҎԼͷਤͰ͸Θ͔ΓͮΒ͍Ͱ͕͢ɺͭͷ%JTQBUDIFS͔Β͋Δ"DUJPO͕ෳ਺ͷ4UPSFʹ౉ ͞ΕΔΠϝʔδͰ͢ɻ w ͜ΕʹΑΓෳ਺ͷ4UPSF͢΂ͯʹঢ়ଶมߋ͕ߦΘΕΔΑ͏ʹͳΓ·͢ɻ w ͜ͷҰ࿈ͷྲྀΕ͸ɺ6OJEJSFDUJPOBMEBUB fl PX ୯ํ޲σʔλϑϩʔ ͱͯ͠ݺ͹Ε͍ͯ· ͢ɻ

19 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY w Ͱ͸ͳͥ'MVY ୯ํ޲σʔλϑϩʔ͸ඞཁͩͬͨͷͰ͠ΐ͏͔ʁ w ୯ʹॻ͖ํΛ౷Ұ͢ΔͨΊͷํ਑ͱ͍͏Θ͚Ͱ͸͋Γ·ͤΜɻ

20 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY w αϯϓϧΞϓϦಈ࡞Πϝʔδ λεΫͷνΣοΫΛ֎͢ λεΫʹνΣοΫΛ͢Δ

21 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY w 50%0ΞϓϦͰߟ͑ͯΈ·͢ w ׬ྃҰཡը໘͔ΒຊΛಡΉͷνΣοΫΛ֎ͯ͠ະ׬ྃʹ໭͢ 50%0 શҰཡ 7JFX 50%0
׬ྃҰཡ 7JFX શҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ ɹ૟আ͢Δ ׬ྃҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ 50%0 ະ׬ྃҰཡ 7JFX ະ׬ྃҰཡͷঢ়ଶɹ ɹ૟আ͢Δ ຊΛಡΉΛ ະ׬ྃʹมߋ ຊΛಡΉΛ ׬ྃҰཡ͔Β࡟আ ຊΛಡΉΛ ະ׬ྃҰཡʹ௥Ճ

22 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY w શҰཡ7JFX͔ΒຊΛಡΉͷνΣοΫΛ֎͢ 50%0 શҰཡ 7JFX 50%0 ׬ྃҰཡ 7JFX
શҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ ɹ૟আ͢Δ ׬ྃҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ 50%0 ະ׬ྃҰཡ 7JFX ະ׬ྃҰཡͷঢ়ଶɹ ɹ૟আ͢Δ ຊΛಡΉΛ ׬͔ྃΒ࡟আ ຊΛಡΉΛ શҰཡ͔Β࡟আ ຊΛಡΉΛ ະ׬ྃҰཡʹ௥Ճ

23 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY w ະ׬ྃҰཡ7JFX͔Β૟আ͢ΔͷνΣοΫΛೖΕΔ 50%0 શҰཡ 7JFX 50%0 ׬ྃҰཡ 7JFX
શҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ ɹ૟আ͢Δ ׬ྃҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ 50%0 ະ׬ྃҰཡ 7JFX ະ׬ྃҰཡͷঢ়ଶɹ ɹ૟আ͢Δ ૟আΛ͢Δʹ νΣοΫΛ͍ΕΔ ૟আ͢ΔΛ ະ׬ྃҰཡ͔Β࡟আ ૟আΛ͢ΔΛ ׬ྃҰཡʹ௥Ճ

24 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY w ͢΂ͯͷΠϕϯτΛ౷߹͢ΔͱҎԼͷΑ͏ʹ૬ޓʹݺͼग़͕͋͠ΓෳࡶʹͳΓ؅ཧͰ͖ ͳ͘ͳΔ 50%0 શҰཡ 7JFX 50%0 ׬ྃҰཡ
7JFX શҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ ɹ૟আ͢Δ ׬ྃҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ 50%0 ະ׬ྃҰཡ 7JFX ະ׬ྃҰཡͷঢ়ଶɹ ɹ૟আ͢Δ ૟আΛ͢Δʹ νΣοΫΛ͍ΕΔ ૟আ͢ΔΛ ະ׬ྃҰཡ͔Β࡟আ ૟আΛ͢ΔΛ ׬ྃҰཡʹ௥Ճ 50%0 શҰཡ 7JFX 50%0 ׬ྃҰཡ 7JFX શҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ ɹ૟আ͢Δ ׬ྃҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ 50%0 ະ׬ྃҰཡ 7JFX ະ׬ྃҰཡͷঢ়ଶɹ ɹ૟আ͢Δ ຊΛಡΉΛ ະ׬ྃʹมߋ ຊΛಡΉΛ ׬ྃҰཡ͔Β࡟আ ຊΛಡΉΛ ະ׬ྃҰཡʹ௥Ճ 50%0 શҰཡ 7JFX 50%0 ׬ྃҰཡ 7JFX શҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ ɹ૟আ͢Δ ׬ྃҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ 50%0 ະ׬ྃҰཡ 7JFX ະ׬ྃҰཡͷঢ়ଶɹ ɹ૟আ͢Δ ຊΛಡΉΛ ׬͔ྃΒ࡟আ ຊΛಡΉΛ શҰཡ͔Β࡟আ ຊΛಡΉΛ ະ׬ྃҰཡʹ௥Ճ

25 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY w ࣮ࡍͷίϯϙʔωϯτʹ͸֊૚ߏ଄΋ଘࡏ͢ΔͨΊΑΓෳࡶʹͳΔ "7JFX "ঢ়ଶ 3PPU7JFX #7JFX #ঢ়ଶ "7JFX
"ঢ়ଶ "7JFX "ঢ়ଶ #7JFX #ঢ়ଶ

26 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙'MVY w ͦ͜Ͱ'MVYͰ͸%JTQBUDIFSΛதԝͷϋϒͱͯ͠༻ҙͯ͠ɺ"DUJPOΛूத؅ཧ͢Δ͜ͱʹ ͠·ͨ͠ 50%0 શҰཡ 7JFX 50%0 ׬ྃҰཡ
7JFX શҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ ɹ૟আ͢Δ ׬ྃҰཡͷঢ়ଶ ɹຊΛಡΉɹ✅ 50%0 ະ׬ྃҰཡ 7JFX ະ׬ྃҰཡͷঢ়ଶɹ ɹ૟আ͢Δ %JTQBDIFS ׬ྃ"DUJPO 4UPSF͕ ߋ৽͞ΕΔͱ࠶ඳը ະ׬ྃ"DUJPO ׬ྃ"DUJPO ະ׬ྃ"DUJPO %JTQBUDIFS͸"DUJPOʹ ैͬͯ4UPSFΛߋ৽ ͜ΕʹΑΓ%JTQBDIFS͔Β4UPSF΁ͷ ߋ৽͕୯ํ޲ͰγϯϓϧʹͳΓ·͢

28 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY 4UBSU 'MVY 3FEVY -JGUJOH 4UBUF6Q 5$" 3FEVY 5PPM,JU

29 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w 3FEVY͸೥ʹ%BO"CSPNPWͱ"OESFX$MBSLʹΑΓ࡞ΒΕͨΞʔΩςΫνϟͰ͋Γ ϥΠϒϥϦͰ͢ɻ w "OESFX$MBSL͸ɺ'MVYϥΠϒϥϦ'MVNNPYͷ࡞ऀɻ w ݱࡏ͸ਓͱ΋3FBDUDPSFνʔϜʹࡏ੶͍ͯͯ͠ɺ3FEVYϝϯςφϯε͸.BSL &SJLTPOʹҾ͖ܧ͍Ͱ͍·͢

30 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w ϥΠϒϥϦͱͯ͠͸'MVYΑΓ΋γϯϓϧʹ࣮૷Ͱ͖ΔΑ͏ʹͳ͓ͬͯΓɺ୯ํ޲σʔλ ϑϩʔͱ͍͏఺Ͱ͸'MVYΛ౿ऻ͍ͯ͠·͢ɻ w ΫϦοΫ͞ΕͨΒ"DUJPOΛ%JTQBUDI͠ɺ"DUJPOΛड͚ͨ3FEVDFS͕"DUJPOʹԠͯ͡4UPSF Λߋ৽͠·͢

31 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w 3FEVYࡾݪଇ w 4JOHMF4PVSDFPG5SVUI w 'MVY͸ΞϓϦέʔγϣϯ಺ʹෳ਺ͷঢ়ଶΛ͍࣋ͬͯ·͕ͨ͠ɺ3FEVYͰ͸୯Ұͷ 4UPSFΛ༻ҙͯͦ͜͠Ͱ͢΂ͯͷঢ়ଶΛ؅ཧ͠·͢ɻ w
͜ΕʹΑΓ'MVYͰ͋ͬͨΑ͏ʹ%JTQBUDIFS͔Βෳ਺ͷҟͳΔ4UPSFΛߋ৽͢ΔΑ͏ ͳ͜ͱ͸ͳ͘ͳΓɺߟ͑ํͱͯ͠͸୯७ʹͳΓ·ͨ͠ɻ w 4UBUFJTSFBEPOMZ w 7JFXͳͲͰड͚औͬͨঢ়ଶͦͷ΋ͷ͸ߋ৽ͤͣɺ4UPSFʹ"DUJPOΛ%JTQBUDIͯ͠ɺ ͦͷ"DUJPOΛड͚औͬͨ3FEVDFS͕ঢ়ଶΛߋ৽͠·͢ w $IBOHFTBSFNBEFXJUIQVSFGVODUJPO w 3FEVDFSͱ͍͏७ਮͳؔ਺͕"DUJPOʹԠͯ͡4UPSFΛߋ৽͠·͢

32 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w 4JOHMF4PVSDFPG5SVUI શҰཡ7JFX ׬ྃҰཡ 7JFX ະ׬ྃҰཡ 7JFX 4UPSF
5BTLҰཡ 4FMFDUPS 5BTLҰཡ UBTLEPOF 4FMFDUPS UBTLҰཡ UBTLEPOF 4FMFDUPS 5BTLҰཡ 'MVYͰ͸ঢ়ଶ͕7JFX͝ͱʹଘࡏ͍ͯͨ͠ ͨΊ%JTQBUDIFS͕ෳ਺ͷঢ়ଶΛߋ৽͍ͯͨ͠ ͕ɺ3FEVYͰ͸44P5Ͱ͋Δ4UPSF͚ͩΛߋ৽͠ ͯɺଞͷ஋͸3FBDUJWFʹಋग़͢Δ 3FEVDFS *G׬ྃʹνΣοΫ"DUJPJO UBTLEPOFUSVF *G׬ྃνΣοΫΛ֎͢ "DUJPO UBTLEPOFGBMTF ׬ྃ"DUJPO ະ׬ྃ"DUJPO ׬ྃ"DUJPO ະ׬ྃ"DUJPO

33 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w 4JOHMF4PVSDFPG5SVUIͷ஫ҙ w 4UPSF͕୯Ұͩͱͯ͠΋ɺ4UPSFͷதͰঢ়ଶΛෳ੡͍ͯ࣋ͬͯͯ͠͸ҙຯ͕ͳ͍ w ͜Ε͸/( w ͭ·Γࣗ෼ࣗ਎Ͱద੾ʹ44P5Λ࣮ݱ͢ΔͨΊʹਖ਼نԽΛ͠ͳ͚Ε͹͍͚·ͤΜ
4UPSF UPEPҰཡ 5PEP׬ྃҰཡ 5Pະ׬ྃҰཡ

34 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w ͜ΕΒͷಛੑʹΑΓҎԼͷ͕࣮ࣜݱ͞Ε͍ͯΔɻ w 4UPSF3FEVDFS ॳظঢ়ଶ "DUJPO w
ͭ·Γॳظঢ়ଶͱ͢΂ͯͷ"DUJPOΛه࿥͓ͯ͘͜͠ͱͰɺ͢΂ͯͷঢ়ଶΛ࠶ݱ͢Δ͜ͱ ͕Ͱ͖·͢ w ͜ΕΛλΠϜτϥϕϧͱݺͼ·͢ w 3FEVYEFWUPPMͰ͸ɺ"DUJPOΛר͖໭ͨ͠Γ࠶ੜͨ͠Γ͢Δ͜ͱ͕Ͱ͖·͢

35 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY શҰཡ7JFX 4UPSF UPEPҰཡ UPEP"1*-PEJOH UPEP"1*&SSPS 4FMFDUPS UPEPҰཡ 3FEVDFS
*GUPEPҰཡΛอଘ 4UPSFUPEPҰཡ "1*Ͱऔಘͨ͠UPEPҰཡ *GMPBEJOH"DUJPO UPEP"1*-PBEJOHUSVF *GMPBEJOHGBMTF"DUJPO UPEP"1*-PBEJOHGBMTF *G&SSPS"DUJPO UPEP"1*&SSPSGBMFT શҰཡදࣔ "DUJPO .JEEMFXBSF "1*ͰUPEPҰཡΛऔಘ EJTQBUDI UPEPҰཡΛอଘ EJTQBUDI MPBEJOHUSVF EJTQBUDI MPBEJOHGBMTF "1*ίʔϧ w "1*ίʔϧͷঢ়ଶ؅ཧ w 'MVY4UBOEBSE"DUJPO w සग़͢Δ"DUJPOΛύ λʔϯԽͨ͠΋ͷ ঢ়ଶͱҰॹʹMPBEJOHͱ FSSPSΛ࣋ͭ

36 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w .VUBUJPO"1*࣮ߦޙͷ4UPSFߋ৽ w ྫ͑͹UPHHMF"1*Λ࣮ߦͨ͠ͱ͖͸ɺ4UPSFʹอ͍࣋ͯ͠Δ஋Λߋ৽͢Δඞཁ͕͋Δ w ͦ͏͠ͳ͍ͱ7JFX͕ߋ৽͞Εͳ͍ w ΋͘͠͸ඞͣ5P%Pͷ7JFXΛදࣔ͢ΔࡍʹຖճϑΣον͢Δඞཁ͕͋Δ
w ࣮૷͸ָ͕ͩը໘ભҠ͝ͱʹ'FUDIͯ͠-PBEJOH͕૸ΔͷͰ69͸ѱ͍ w Ϣʔεέʔεʹ߹Θͤͯ൑அ

37 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w ͢΂ͯͷঢ়ଶΛ4UPSFʹ࣋ͭ͜ͱΛਪ঑ "7JFX 4UPSF UPEPঢ়ଶ 6TFSঢ়ଶ #7JFX શҰཡ7JFX
׬ྃҰཡ 7JFX 6TFS7JFX

38 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w 3PPUʹଘࡏ͢Δ4UPSFͷ՝୊1SPQ%SJMMJOH "7JFX 4UPSF UPEPঢ়ଶ 6TFSঢ়ଶ #7JFX શҰཡ7JFX
׬ྃҰཡ 7JFX 6TFS7JFX 5PEPঢ়ଶෆཁ "7JFXͱ#7JFX͸ຊདྷ͸UPEPঢ়ଶͱ6TFS ঢ়ଶ͸ඞཁͳ͍͕ɺ࠷Լ෦ͷ7JFXʹ౉ͨ͢ Ίʹ͸ܦ༝͠ͳ͚Ε͹ͳΒͳ͍ ͜ΕΛ1SPQ%SJMMJOHͱݴ͏ 6TFSঢ়ଶෆཁ 5PEPঢ়ଶඞཁ 5PEPঢ়ଶඞཁ 6TFSঢ়ଶඞཁ

39 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w 1SPQ%SJMMJOHͷղܾࡦ4FMFDUPS "7JFX 4UPSF UPEPঢ়ଶ 6TFSঢ়ଶ #7JFX શҰཡ7JFX
׬ྃҰཡ 7JFX 6TFS7JFX 4FMFDUPS 5PEPঢ়ଶ͢΂ͯ 4FMFDUPS 5PEP׬ྃঢ়ଶ 4FMFDUPS 6TFSঢ়ଶ "7JFXͱ#7JFXΛ εΩοϓͰ͖Δ ඞཁͳ஋͚ͩʹϑΟϧλʔ͠ ͯɺ֊૚ΛεΩοϓ͢Δ 4FMFDUPSΛ࢖͏͜ͱͰɺ1SPQ %SJMMJOHΛճආͰ͖Δ

40 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w 4UPSFΛෳ਺࡞Δ͜ͱ͕Ͱ͖Δ͕ਪ঑͞Ε͍ͯͳ͍ w 3FEVY%FW5PPMTͰλΠϜτϥϕϧͰ͖ͳ͘ͳΔ w ੹຿Λ෼ׂ͍ͨ͠৔߹͸4UPSFͷதͰ%PNBJO͝ͱʹঢ়ଶΛ෼ׂͯ͠ɺͦΕ͝ͱʹ 3FEVDFSΛ࡞Δ w
'MVYͷΑ͏ʹҟͳΔ3FEVDFS͕ಉҰ"DUJPOΛड͚औΓҟͳΔঢ়ଶΛߋ৽͢Δ͜ͱ΋Մೳ w ͭ·ΓϥΠϒϥϦͱͯ͠ͷ3FEVY͸'MVYΛ࣮ݱ͢ΔͨΊʹ΋ར༻Ͱ͖Δ w ͦͷͨΊݱࡏͰ͸'MVYઐ༻ϥΠϒϥϦ͕࢖༻͞ΕΔ͜ͱ͸΄ͱΜͲͳ͍ w 3FEVY5PPM,JU w 3FEVY͸ϘΠϥʔϓϨʔτ͕ଟ͍͜ͱ͕՝୊ͱݴΘΕΔΑ͏ʹͳ͖ͬͯͨͷͰɺղܾ ͢ΔͨΊͷϥΠϒϥϦ w 5$"Ͱ΋ϘΠϥʔϓϨʔτ͕ؾʹͳΓग़ͨ࣌͠ʹ͸ࢀߟʹͳΔͱࢥ͍·͢

41 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FEVY w ՝୊ w ਖ਼نԽ͸ࣗ෼Ͱ͠ͳ͚Ε͹͍͚ͳ͍ w ϘΠϥʔϓϨʔτ w 3FEVY5PPM,JUͰղܾɻ͔͠͠ίʔυྔ͸ݮ͕ͬͨ֓೦͸ݮͬͯ͸͍ͳ͍
w "1*ίʔϧͷঢ়ଶΛ4UPSFͰ؅ཧ͢ΔͷͰείʔϓ͕େ͖͍ w NVUBUJPOͷ"1*࣮ߦޙʹ4UPSFΛߋ৽͢Δඞཁ͕͋Δ

42 ༨ஊͭͷ4JOHMF4PVSDFPG5SVUI w 4JOHMF4PVSDFPG5SVUIͱݴͬͨ࣌ʹͭͷҙຯ͕ଘࡏ͍ͯ͠·͢ɻ w 3FEVY͕ఏএ͢ΔΑ͏ͳʮΞϓϦέʔγϣϯ্ͷ4UPSFΛͭ࣋ͭʯͱ͍͏ҙຯ w ʮಉҰঢ়ଶΛॏෳͯ࣋ͨͣ͠ʹɺਖ਼نԽͨ͠ঢ়ଶΛ࣋ͭʯͱ͍͏ҙຯ w લऀͷҙຯͰɺઆ໌ͯ͠͠·͏ͱࠓޙͷઆ໌Ͱࠞཚ͕ੜ·ΕΔͷͰɺ͜ͷ͋ͱͷεϥΠ
υͰ͸ޙऀΛ4JOHMF4PVSDFPG5SVUIͱͯ͠આ໌Λଓ͚͍͖ͯ·͢ɻ w Ұൠతʹ͸ޙऀ͕ਖ਼͍͠Ͱ͢ɻ

5IF$PNQPTBCMF"SDIJUFDUVSF

44 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF 4UBSU 'MVY 3FEVY -JGUJOH 4UBUF6Q 5$" 3FEVY 5PPM,JU

45 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF w 5$"͸10*/5'3&&ͷ#SBOEPO8JMMJBNTͱ4UFQIFO$FMJTʹΑͬͯఏҊ͞ΕͨΞʔΩς ΫνϟͰ͢ɻ w 7JFXɺ4UPSFɺ"DUJPOɺ3FEVDFSͱ͍͏ؔ܎͸3FEVYͱಉ͡

46 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF w 3FEVYͱͷҧ͍ w "1*ίʔϧ w 3FEVYͷΑ͏ʹ"1*ίʔϧͳͲͷ෭࡞༻ΛNJEEMFXBSFͰ࣮ݱ͢ΔͷͰ͸ͳ͘ 3FEVDFSͷฦΓ஋ͷ& ff
FDUͰ࣮ݱ͢Δ w 4UPSFͱ3FEVDFS w 3FEVYͷΑ͏ʹͭͷ4UPSFΛ3PPUʹ഑ஔ͢Δ͜ͱΛਪ঑͍ͯ͠ΔΘ͚Ͱ͸ͳ͍ w ͦͷͨΊ֊૚ΛεΩοϓ͢Δ4FMFDUPS૬౰ͷ΋ͷ͸ͳ͍ w 'MVY΍3FEVYͷΑ͏ʹಉҰͷ"DUJPOΛҟͳΔ3FEVDFS͕ड͚औΒͳ͍ w ΋ͦ͠Εʹ͍ۙ͜ͱΛ΍Ζ͏ͱͨ͠Β)JHI0SEFS3FEVDFSͰ࣮ݱ w ͜ΕΒͷํ਑͸3FBDUެࣜͷVTF3FEVDFSͱࣅ͍ͯͯγϯϓϧͳઃܭʹͳ͍ͬͯΔ w 3FEVYͷ֊૚εΩοϓ͸൱ఆతͳҙݟ΋ࠜڧ͍

47 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF w ݸਓతͳٙ໰ w 3FEVYͰ͸ʮ3PPUʹ4UPSFΛ഑ஔ͢Δ͜ͱʯͱʮ4FMFDUPSʹΑΔ1SPQ%SJMMJOHͷղ ܾʯʹΑΓɺϨεϙϯεΩϟογϡΛίϯϙʔωϯτπϦʔશମͰ༰қʹར༻Ͱ͖ ΔΑ͏ʹ͕ͨ͠ɺ5$"Ͱ͸͜ΕΛղܾ͢Δํ๏ΛఏҊ͍ͯ͠ͳ͍Α͏ʹײͨ͡ w 5$"Ͱ͸είʔϓΛดͯ͡ίϯϙʔωϯτؒΛҾ਺Ͱ౉͍͚ͯ͠͹ྑ͍ͱ͍͏ߟ
͑ʁ w ΋͘͠͸ͦ͏͍͏஋͸3FEVYͷΑ͏ʹ3PPUʹ4UPSFΛ഑ஔͯ͠&OWJSPONFOU0CKFDU Ͱ1SPQ%SJMMJOHΛղܾ͢Δʁ w &OWJSPONFOU0CKFDU͸໊લͷ௨Γ؀ڥม਺ͷΑ͏ͳઃఆ஋ʹ࢖͏΂͖Ͱ͋·Γ ཚ༻͢Δ΂͖Ͱ͸ͳ͍Α͏ʹ΋ࢥ͑Δ

48 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF શҰཡ7JFX 4UPSF UPEPҰཡ 3FEVDFS JGUPHHMF JE JEͰҰகͨ͠UBTLΛ
UPHHMFͯ͠ߋ৽ 5PHHMF "DUJPO w 5$" w ׬ྃͷνΣοΫϘοΫεΛೖΕͨ৔߹ͷྲྀΕ 3FEVDFS͕BDUJPOΛड͚ͯ4UPSFΛߋ৽

49 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF w 5$"ͷίʔυ enum ToDoAction: Equatable { case append
case toggle(UUID) } let toDoReducer = Reducer< ToDoState, ToDoAction, ToDoEnvironment> { state, action, environment in switch action { case .append: state.tasks += [Task(title: "௥Ճ", done: false)] return .none case let .toggle(id): state.tasks = state.tasks.map { task in guard task.id == id else { return task } var newTask = task newTask.done = !newTask.done return newTask } return .none } } struct ToDoState : Equatable { var tasks: [Task] = [] var completed: [Task] { get{ return tasks.filter { $0.done } } } var unCompleted: [Task] { get{ return tasks.filter { !$0.done } } } } 3FEVDFS͕BDUJPOΛड͚ͯ4UBUFΛߋ৽

50 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF w 5$"ͷίʔυ struct ToDoView: View { let store:
Store<ToDoState, ToDoAction> var body: some View { WithViewStore(self.store) { viewStore in VStack{ Button(action: { viewStore.send(.append) }){ Text("௥Ճ") } Text("શToDo") ToDoListView(todos: viewStore.todos, toggle: { id in viewStore.send(.toggle(id))}) Text("ະ׬ྃToDo") ToDoListView(todos: viewStore.unCompletedToDos, toggle: { id in viewStore.send(.toggle(id))}) Text("׬ྃࡁΈToDo") ToDoListView(todos: viewStore.completedToDos, toggle:{ id in viewStore.send(.toggle(id))}) } } } } 4UPSF͔Βঢ়ଶΛऔಘͯ͠දࣔ 7JFX͔Β͸4UPSFʹ"DUJPOΛૹ৴ͯ͠ঢ়ଶΛߋ৽

51 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF શҰཡ7JFX 4UPSF UPEPҰཡ UPEP"1*-PEJOH UPEP"1*&SSPS 3FEVDFS JGදࣔ"DUJPO TUBUFMPBEJOHUSVF
SFUVSO"1* lUPEPTz ɹNBQ Ϩεϙϯε੒ޭ"DUJPO JGϨεϙϯε੒ޭ"DUJPO UPEPT TUBUFUPEPҰཡUPEPT TUBUFMPBEJOHGBMTF JGશҰཡϨεϙϯεࣦഊ"DUJPO FSSPS TUBUFUPEP"1*&SSPSFSSPS TUBUFMPBEJOHGBMTF શҰཡදࣔ "DUJPO w "1*ίʔϧͷঢ়ଶ؅ཧ 3FEVYͱ͸ҟͳΓNJEEMFXBSFͰ͸ͳ͘ 3FEVDFSͷதͰ& ff FDUΛ࡞੒ͯ͠ฦ͢͜ͱͰ ඇಉظॲཧΛ࣮ߦ͍ͯ͘͠ 3FEVDFSʹදࣔ"DUJPO͕౉͞ΕΔ MPBEJOHΛUSVFʹͯ͠"1*ίʔϧͷ & ff FDUΛ࡞੒ɺͦͷ& ff FDU݁ՌΛϨε ϙϯε੒ޭ"DUJPO΁౉͢ Ϩεϙϯε݁Ռ͔Βঢ়ଶΛߋ৽ͯ͠ MPBEJOHΛGBMTFʹ͢Δ

52 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF w 5$"ͷίʔυ"1*ίʔϧ͋Γ "1*ίʔϧͷ݁ՌΛ5P%P"DUJPOHFU3FTQPOTFʹ ౉͍ͯ͠Δ let toDoReducer = Reducer<
ToDoState, ToDoAction, ToDoEnvironment> { state, action, environment in switch action { case .get: state.loading = true return environment.getAPI() .delay(for: 2, scheduler: environment.mainQueue.animation()) .catchToEffect() .map(ToDoAction.getResponse) case let .getResponse(.success(tasks)): state.tasks = tasks state.loading = false return .none case let .getResponse(.failure(error)): state.error = error.localizedDescription state.loading = false return .none } }

53 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF w 5$"ͷίʔυ"1*ίʔϧ͋Γ struct ToDoView: View { let store:
Store<ToDoState, ToDoAction> var body: some View { WithViewStore(self.store) { viewStore in ZStack { VStack{ if viewStore.error != "" { Text(viewStore.error) } Button(action: { viewStore.send(.append) }){ Text("௥Ճ") } Text("શToDo") TasksView(tasks: viewStore.tasks, toggle: { id in viewStore.send(.toggle(id))}) Text("ະ׬ྃToDo") TasksView(tasks: viewStore.unCompleted, toggle: { id in viewStore.send(.toggle(id))}) Text("׬ྃࡁΈToDo") TasksView(tasks: viewStore.completed, toggle:{ id in viewStore.send(.toggle(id))}) }.onAppear { viewStore.send(.get) } if viewStore.loading { ProgressView() } } } } } "1*ίʔϧͳ͠ͱͷҧ͍͸ MPBEJOH࣌ͷ1SPHSFTT7JFXͷ௥Ճ͞Εͨ͜ͱͰɺ ଞ͸΄΅ಉ͡

54 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙5IF$PNQPTBCMF"SDIJUFDUVSF w ՝୊جຊతʹ͸3FEVYͱಉ͡՝୊Λ๊͍͑ͯΔ w ਖ਼نԽ͸ࣗ෼Ͱ͠ͳ͚Ε͹͍͚ͳ͍ w ϘΠϥʔϓϨʔτ w "1*ίʔϧͷঢ়ଶΛ4UPSFͰ؅ཧ͢ΔͷͰείʔϓ͕େ͖͍
w 3PPUʹஔ͔ͳ͚Ε͹3FEVYΑΓ͔͸ڱ͍ w NVUBUJPOͷ"1*࣮ߦޙʹ4UPSFΛߋ৽͢Δඞཁ͕͋Δ

-JGUJOH4UBUF6Q

56 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q 4UBSU 'MVY 3FEVY -JGUJOH 4UBUF6Q 5$" 3FEVY 5PPM,JU

57 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q w ೥ʹ3FBDUެࣜCMPHʹൃද͞Ε·ͨ͠ɻ w ෳ਺ίϯϙʔωϯτͰར༻͢Δঢ়ଶΛɺඞཁͳίϯϙʔωϯτ·Ͱ্࣋ͪ͛Δ͜ͱΛݴ ͍·͢ɻ w 'MVY΍3FEVYͳͲͷΑ͏ʹΘ͔Γ΍͍͢ΞʔΩςΫνϟͷਤ͕ͳ͍ͨΊ͋·Γීٴ͕ਐ ΜͰ͍·ͤΜ͕ɺએݴత6*ͷঢ়ଶ؅ཧʹ͓͍ͯ΋࠷΋େ੾ͳ֓೦ͱݴ͑·͢ɻ
w ΞʔΩςΫνϟͱ͍͏ΑΓ͔͸એݴత6*ͷݪଇͱݴ͑ΔͰ͠ΐ͏ɻ w 3FBDUɺ4XJGU6*ɺ+FUQBDL$PNQPTFͰެࣜʹݴٴ͞Ε͍ͯΔ͜ͱ͔Β΋େ੾ͳ͜ͱͩͱ Θ͔Γ·͢ɻ w 3FBDU-JGUJOH4UBUF6Q w 4XJGU6*4PVSDFPG5SVUI 88%$ PS4JOHMF4PVSDFPG5SVUI w +FUQBDL$PNQPTF4UBUF)PJTUJOH

58 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q w ෳ਺ͷ7JFXͰར༻͢Δঢ়ଶΛ্࣋ͪ͛Δ w 3FEVYͰ͸3PPUʹ্͕࣋ͪ͛ͨɺඞཁͳͱ͜Ζ·Ͱ্࣋ͪ͛Ε͹ྑ͍ͱ͍͏ߟ͑ํ w είʔϓΛՄೳͳݶΓখ͘͢͞Δ શҰཡ7JFX ׬ྃҰཡ
7JFX ະ׬ྃҰཡ 7JFX શҰཡ ঢ়ଶ ׬ྃҰཡ ঢ়ଶ ະ׬ྃҰཡ ঢ়ଶ 5P%P7JFX 6TFS7JFX 6TFS ঢ়ଶ 3PPU7JFX ͜ΕΒͷঢ়ଶ͸ 4JOHMF4PVSDFPG5SVUIͰ͸ͳ ͍ͷͰ্࣋ͪ͛Δඞཁ͕͋Δ ্࣋ͪ͛Δલͷঢ়ଶ

59 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q w 3FEVYͷ৔߹ શҰཡ7JFX ׬ྃҰཡ 7JFX ະ׬ྃҰཡ 7JFX 5P%P7JFX
6TFS7JFX 6TFS ঢ়ଶ 3PPU7JFX Ұ൪্·Ͱ্࣋ͪ͛Δ ͔͠͠6TFS7JFXʹ͸ඞཁͳ͍ ͷͰείʔϓͱ͍͏؍఺Ͱ͸ 3PPUʹ͋Δඞཁ͸ͳ͍ શҰཡ ঢ়ଶ 3PPUͷঢ়ଶ͔ΒTFMFDUPSͰί ϯϙʔωϯτʹ஋Λ౉͍ͯͨ͠ 4FMFDUPS શҰཡ 4FMFDUPS ׬ྃҰཡ 4FMFDUPS ະ׬ྃҰཡ

60 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q w -JGUJOH4UBUF6QͰঢ়ଶΛ্࣋ͪ͛Δ w 5$"ͷ৔߹͸4UPSFΛ্࣋ͪ͛Δ શҰཡ7JFX ׬ྃҰཡ 7JFX ະ׬ྃҰཡ
7JFX 5P%P7JFX 6TFS7JFX 6TFS ঢ়ଶ 3PPU7JFX 3PPUͰ͸ͳ͘ ඞཁͳ5P%P7JFX·Ͱ ্࣋ͪ͛Δ Ҏ্Ͱ4JOHMF4PVSDFPG5SVUI Λ࣮ݱͭͭ͠είʔϓΛ࠷௿ݶ ʹͰ͖Δ ·ͨಛผͳϥΠϒϥϦ΍ػೳΛ ඞཁͱ͠ͳ͍ શҰཡ ঢ়ଶ ΞʔΩςΫνϟͱͯ͠ͷ 4FMFDUPSͱ͍͏֓೦͸ඞཁͳ͍ ͷͰɺ७ਮʹϑΟϧλϦϯά͠ ͯ౉͢ UPEPT fi MUFS UPEPEPOF UPEPT fi MUFS UPEPEPOF 6TFSʹ͸5P%Pঢ়ଶͷӨڹ ͕ͳ͘ͳΔ

61 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q struct ToDoView: View { @StateObject private var tasks
= Tasks() var body: some View { VStack{ Text("શToDo") TasksView(tasks: tasks.tasks, toggle: tasks.toggle) Text("ະ׬ྃToDo") TasksView(tasks: tasks.unCompleted, toggle: tasks.toggle) Text("׬ྃࡁΈToDo") TasksView(tasks: tasks.completed, toggle: tasks.toggle) } } } struct ContentView: View { var body: some View { VStack{ UserView() ToDoView() } } } 5P%P7JFX͕5BTLTͷঢ়ଶΛ͍࣋ͬͯΕ͹Α͍ 5P%P7JFX͔ΒԼҐͷίϯϙʔωϯτʹ౉͍ͯ͘͠ 5P%P7JFXΑΓ্ͷ$POUFOU7JFX΍ ಉྻͷ6TFS7JFX͸5BTLͷঢ়ଶΛ ͍࣋ͬͯΔඞཁ͸ͳ͍

62 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q w 3FEVDFSͷ༗༻ੑ w 3FBDUDPSFνʔϜ͸ɺ4UPSF͕άϩʔόϧͰ͋Δඞཁ͸ͳ͍͕3FEVYͷ3FEVDFSͷΞΠσΞ͸ Α͔ͬͨͱߟ͑ͯϩʔΧϧεςʔτʹར༻͢ΔVTF3FEVDFSΛఏڙ͠·ͨ͠ w ϑϨʔϜϫʔΫͰ͸ͳ͘খ͍͞ϥΠϒϥϦ w
͔͠͠3EVDFS͸ΦϓγϣϯͰඞਢͰ͸͋Γ·ͤΜ w 5$"ͷ4UPSF 3FEVDFS͸͜Εʹ͍ۙ w ҧ͍͸& ff FDU w 3FEVYͰ΋ෳ਺ͷ4UPSFΛ࡞੒͠4FMFDUPSΛ࢖Θͳ͚Ε͹ಉ͜͡ͱ͕࣮ݱͰ͖Δ w ͔͠͠4XJGU6*Ͱ͸ɺ3FEVDFS͸ఏڙ͞Ε͍ͯ·ͤΜ

63 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q w 4XJGU6*͔Β3FEVDFS͕ఏڙ͞Εͳ͍ཧ༝ ༧૝ w 3FBDUͷVTF3FVDFS͸ҎԼͷཧ༝Ͱఏڙ͞Ε ͍ͯ·͢ class
Tasks :ObservableObject { @Published var tasks: [Task] = [] var completed: [Task] { get{ return tasks.filter { $0.done } } } var unCompleted: [Task] { get{ return tasks.filter { !$0.done } } } func toggle(id: UUID){ tasks = tasks.map { task in guard task.id == id else { return task } var newTask = task newTask.done = !newTask.done return newTask } } func append(title: String){ tasks.append(Task(title: title, done: false)) } } 3FEVDFSΛ࢖Θͣ͜ΕͰ΋Α͍ ௨ৗɺuseReducer ͕ useState ΑΓ޷·͍͠ͷ͸ɺෳ਺ͷ஋ ʹ·͕ͨΔෳࡶͳ state ϩδοΫ͕͋Δ৔߹΍ɺ લͷ state ʹج͍ͮͯ࣍ͷ state ΛܾΊΔඞཁ͕͋Δ৔߹Ͱ͢ɻ Ҿ༻: https://ja.reactjs.org/docs/hooks-reference.html#usereducer w 4XJGU6*Ͱ͸ɺ͜ΕΛ0CTFSWBCMF0CKFDUͰղ ܾͰ͖Δ

64 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q w 5$"ͱ0CTFSWBCMF0CKFDUͷίʔυൺֱ enum ToDoAction: Equatable { case append
case toggle(UUID) } let toDoReducer = Reducer<ToDoState,ToDoAction,ToDoEnvironment> { state, action, environment in switch action { case .append: state.tasks += [Task(title: "௥Ճ", done: false)] return .none case let .toggle(id): state.tasks = state.tasks.map { task in guard task.id == id else { return task } var newTask = task newTask.done = !newTask.done return newTask } return .none } } struct ToDoState : Equatable { var tasks: [Task] = [] var completed: [Task] { get{ return tasks.filter { $0.done } } } var unCompleted: [Task] { get{ return tasks.filter { !$0.done } } } } class Tasks :ObservableObject { @Published var tasks: [Task] = [] var completed: [Task] { get{ return tasks.filter { $0.done } } } var unCompleted: [Task] { get{ return tasks.filter { !$0.done } } } func append(title: String){ tasks.append(Task(title: title, done: false)) } func toggle(id: UUID){ tasks = tasks.map { task in guard task.id == id else { return task } var newTask = task newTask.done = !newTask.done return newTask } } } 5$"͸ؔ਺ܕ 0CTFSWBCMF0CKFDU͸001 ঢ়گ΍޷ΈʹԠͯ͡࢖͍෼͚͕Ͱ͖Δ

65 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q w -JGUJOH4UBUF6QʹΑΓ44P5ΛकΓͳ͕Β࠷௿ݶͷείʔϓͰঢ়ଶ؅ཧ͕Ͱ͖ΔΑ͏ʹ ͳΓ·ͨ͠ɻ w ঢ়ଶ͕෼ࢄ͢ΔͨΊλΠϜτϥϕϧ͸Ͱ͖ͳ͘ͳΓ·͕͢ɺঢ়ଶͷείʔϓΛ࠷௿ݶʹ ด͡Δ͜ͱΛ༏ઌ͢Δ͜ͱͰɺมߋ࣌ͷӨڹൣғ͕Θ͔Γ΍͘͢ͳΓίʔυͷՄಡੑ͕ ্͕Γ·͢ɻ w
-JGUJOH4UBUF6Qͯ͠44P5ΛकΔ͜ͱͰɺ'MVYͰղܾ͔ͨͬͨ͠໰୊͸ͳ͘ͳΓ·ͨ͠ w 'MVYͷͱ͖ʹ͸ঢ়ଶ͕4JOHMF4PVSDFPG5SVUIͰ͸ͳ͘৑௕ͩͬͨͨΊɺෳ਺ͷ4UPSF ʹରͯ͠%JTQBUDI͢Δඞཁ͕͋Γ·ͨ͠ɻ w ͔͠͠44P5Λक͍ͬͯΕ͹ɺඞͣͭͷঢ়ଶΛߋ৽͢Δ͚ͩͰΑ͘ͳΓ·͢ɻ

66 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙-JGUJOH4UBUF6Q w ͦͷͨΊݱ୅ʹ͓͍ͯ'MVYʹ͍ͭͯݴٴ͢Δػձ͸গͳ͘ͳ͍ͬͯ·͢ w ͦͷΑ͏ͳதͰ΋ਖ਼نԽ͞Ε͍ͯͳ͍ෳ਺ͷ4UPSF͕͋ΓಉҰ"DUJPOΛෳ਺ͷ 3FEVDFS͕ड͚औΓɺͦΕͧΕͷ4UPSFΛߋ৽͢ΔΞʔΩςΫνϟΛ'MVYͱݴ͏͜ͱ ͸ద੾ͩͱࢥ͍·͢ w ͔͠͠ՄೳͳݶΓ4UPSFΛਖ਼نԽͯ͠44P5Λ࣮ݱ͢Δ͜ͱΛ͓͢͢Ί͠·͢
w 4UPSFɺ3FEVDFSɺ"DUJPO͸ͷؔ܎Λҡ࣋͠ɺͭͷ"DUJPO͔Β44P5ͳ4UPSFͩ ͚Λߋ৽͢ΔΞʔΩςΫνϟͷํ͕γϯϓϧͰ͢ w ͱ͸͍͑ɺ஋ʹΑͬͯ͸4UPSFͷਖ਼نԽ͕೉͘͠ɺ44P5ΛఘΊͨ͘ͳΔؾ࣋ͪ΋Θ ͔Γ·͢ʜ

"1*ίʔϧͷঢ়ଶ؅ཧͷվળ

68 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"1*ίʔϧͷঢ়ଶ؅ཧͷվળ 4UBSU 'MVY 3FEVY -JGUJOH 4UBUF6Q 5$" 3FEVY 5PPM,JU
35, 2VFSZ (SBQI2- 3FBDU 2VFSZ 3FBDUDPSF νʔϜͷࢥ૝ ΫϥΠΞϯτ Ωϟογϡ 3FEVYͷվྑ ϘΠϥʔ ςϯϓϨʔτͷ࡟ݮ 3FDPJM 4UBUFߋ৽ͷ ఻೻Λ7JFX͔Β෼཭ 4JOHMF4PVSDFPG5SVUI ΫϥΠΞϯτ ΩϟογϡΛ3FEVYͰ࣮ݱ ΫϥΠΞϯτ ΩϟογϡΛ3&45Ͱ࣮ݱ "1*ίʔϧͷվળ ୯ํ޲σʔλϑϩʔ

69 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"1*ίʔϧͷঢ়ଶ؅ཧͷվળ w 3FEVYͷ'MVY4UBOEBSE"DUJPOͰ͸"1*ίʔϧͷMPBEJOH΍FSSPSͷঢ়ଶΛऔಘ͢Δ஋ͷ 4UBUFʹอ࣋͢Δ͜ͱ͕ҰൠతͰͨ͠ w 5$"Ͱ΋ಉ༷ʁ

70 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"1*ίʔϧͷঢ়ଶ؅ཧͷվળ શҰཡ7JFX 4UPSF UPEPҰཡ UPEP"1*-PEJOH UPEP"1*&SSPS 3FEVDFS JGશҰཡදࣔ"DUJPO TUBUFMPBEJOHUSVF
SFUVSO"1* lUPEPTz JGશҰཡϨεϙϯε੒ޭ"DUJPO UPEPT TUBUFUPEPҰཡUPEPT TUBUFMPBEJOHGBMTF JGશҰཡϨεϙϯεࣦഊ"DUJPO FSSPS TUBUFUPEP"1*&SSPSFSSPS TUBUFMPBEJOHGBMTF શҰཡදࣔ "DUJPO w 5$"ͷ"1*ίʔϧͷঢ়ଶ؅ཧ 4UPSFʹMPBEJOHͱFSSPSঢ়ଶΛ࣋ͭ ͜ΕΒΛ3FEVDFS͔Βߋ৽

71 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"1*ίʔϧͷঢ়ଶ؅ཧͷվળ w ݱࡏͰ͸ɺ3FBDUͷੈքͰ͸-PBEJOH΍&SSPSͷঢ়ଶ͸4UPSFʹ࣋ͭͷͰ͸ͳ͘ɺ"1* ίʔϧΛݺͿ৔ॴͰঢ়ଶΛ࣋ͭ͜ͱ͕ҰൠతʹͳΓ·ͨ͠

72 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"1*ίʔϧͷঢ়ଶ؅ཧͷվળ w ίʔυΠϝʔδ struct ToDoView: View { @StateObject private
var api = APIState<Tasks> { // APIίʔϧ } var body: some View { Group { if api.isLoading { ProgressView() } else if let error = api.error { ErrorView(error: error) } else { // api.data.tasksΛ࢖ͬͯදࣔ } } } } 7JFXͷதͰ"1*4UBUFͷఆٛͱ"1*ͷ࣮ߦΛߦ͍ɺͦΕʹैͬͯ7JFXΛग़͠෼͚Δ

73 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"1*ίʔϧͷঢ়ଶ؅ཧͷվળ "7JFX 3PPU7JFX w "1*ͷঢ়ଶ؅ཧͷείʔϓͷҧ͍ #7JFX $7JFX 7JFXͷ֎ͷ4UBUF͕MPBEJOH΍FSSPSͷ ঢ়ଶΛ࣋ͪείʔϓ͕޿͍
7JFXͷ಺෦ͷ4UBUF͕MPBEJOH΍FSSPSͷঢ়ଶ Λ࣋ͭͷͰείʔϓ͕ڱ͍ "7JFX -PBEJOH &SSPS %BUB 3PPU7JFX #7JFX $7JFX 4UPSF %BUB -PBEJOH &SSPS

74 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"1*ίʔϧͷঢ়ଶ؅ཧͷվળ "7JFX "1*ίʔϧ 3PPU7JFX w ෳ਺ՕॴͰͷ"1*ίʔϧ #7JFX "1*ίʔϧ $7JFX
"ͱ#͕ಉ࣌ʹ࣮ߦͨ͠৔߹ͷMPBEJOH΍ FSSPSͷߟྀ͕ඞཁ "1*ίʔϧ͝ͱʹঢ়ଶΛ࣋ͭ ಠཱ͍ͯͯ͠ͱͯ΋ࣗવͳঢ়ଶ "7JFX "1*ίʔϧ -PBEJOH &SSPS %BUB 3PPU7JFX #7JFX "1*ίʔϧ $7JFX 4UPSF -PBEJOH &SSPS -PBEJOH &SSPS %BUB

75 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"1*ίʔϧͷঢ়ଶ؅ཧͷվળ "7JFX -PBEJOH &SSPS %BUB 3PPU7JFX #7JFX $7JFX "7JFX
3PPU7JFX #7JFX $7JFX -PBEJOH &SSPS %BUB w ଞͷίϯϙʔωϯτͰ΋-PBEJOH΍&SSPSΛ࢖͍͍ͨ৔߹͸ʁ -JGUJOH4UBUF6Q͢Δ #7JFXͰ΋ -PBEJOH΍&SSPSΛ ද͍ࣔͨ͠ 3PPU7JFXͰ"1*ίʔϧͯ͠ɺ "ͱ7JFXʹ݁ՌΛ౉͢

76 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"1*ίʔϧͷঢ়ଶ؅ཧͷվળ w "1*ίʔϧͷঢ়ଶ؅ཧͷվળʹΑΓɺ-PBEJOHͱ&SSPSঢ়ଶͷείʔϓΛ࠷௿ݶʹ཈͑Δ ͜ͱ͕Ͱ͖ΔΑ͏ʹͳΓ·ͨ͠ w ·ͨ-PBEJOH΍&SSPSͷঢ়ଶ؅ཧͷ࣮૷Λ"1*ίʔϧ͝ͱʹ͢Δඞཁ͕ͳ͘ͳΓ·͢

(SBQI2-

78 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- 4UBSU 'MVY 3FEVY -JGUJOH 4UBUF6Q 5$" 3FEVY 5PPM,JU
35, 2VFSZ (SBQI2- 3FBDU 2VFSZ 3FBDUDPSF νʔϜͷࢥ૝ ΫϥΠΞϯτ Ωϟογϡ 3FEVYͷվྑ ϘΠϥʔ ςϯϓϨʔτͷ࡟ݮ 3FDPJM 4UBUFߋ৽ͷ ఻೻Λ7JFX͔Β෼཭ 4JOHMF4PVSDFPG5SVUI ΫϥΠΞϯτ ΩϟογϡΛ3FEVYͰ࣮ݱ ΫϥΠΞϯτ ΩϟογϡΛ3&45Ͱ࣮ݱ "1*ίʔϧͷվળ ୯ํ޲σʔλϑϩʔ

79 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w (SBIQ2-͸ɺΫϥΠΞϯταΠυ͔Β2VFSZΛૹ৴͢Δ͜ͱͰɺඞཁͳ஋Λ౓ͷϦΫ ΤετͰऔಘ͢Δ͜ͱ͕ՄೳͱͳΔɻ w ҎԼͷ໰୊Λղܾ w ΦʔόʔϑΣον ඞཁͳ͍஋ͷऔಘ
w ΞϯμʔϑΣον ඞཁͳ஋͕଍Γͳ͍ͨΊʹෳ਺ͷ"1*Λݺͼग़͢ w 2VFSZͷ݁ՌΛड͚औΔϨεϙϯεͷܕ͸ɺ"QPMMPʹΑͬͯDPEFHFO͞ΕΔɻ w ϨεϙϯεͷܕͱΫϥΠΞϯτͷܕͷಉظ͕อূ͞ΕΔ w એݴతσʔλϑΣονϯά

80 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w 'BDFCPPL͕೥ʹ։ൃɺ೥ެ։ɻ w ࣮͸ΞϓϦͷͨΊʹ։ൃͨ͠ͷ͕࢝·ΓͰ͢ w ೥'BDFCPPLͷJ04ɺ"OESPJEΞϓϦͷχϡʔεϑΟʔυʹ࠾༻ w ೥͘Β͍·Ͱ͸։ൃίϛϡχςΟʹ΄ͱΜͲཧղ͞Ε͍ͯ·ͤΜͰͨ͠
w 3FEVYͷ՝୊Λղܾ͢Δଘࡏͱͯ͠஫໨ΛूΊͨʁ w ۙ೥Ͱ͸ଟ͘ͷاۀͰ࠾༻͍ͯ͠·͢ w 'BDFCPPLɺ(JU)VCɺ6CFSɺ/FU fl JYɺ"JSCOCɺ5XJUUFS w 5XJUUFS"1*Wͷ3&45"1*͸ཪͰ(SBQI2-͕ಈ͍͍ͯ·͢

81 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w (SBQI2-ΫϥΠΞϯτͷϝϦοτ w (SBQI2-ΫϥΠΞϯτ "QPMMP ͷػೳͰɺ (SBQI2-Ͱऔಘͨ͠2VFSZͷ݁ՌΛάϥϑߏ଄ͦ ͷ··Ωϟογϡ͢Δ͜ͱ͕Մೳ
w εΩʔϚઃܭͰਖ਼نԽΛҙࣝ͢Δඞཁ͸ͳ͍ w άϥϑߏ଄ͷதͷΤϯςΟςΟ͸*%ͰҰҙͱ ͳ͓ͬͯΓΫϥΠΞϯτΩϟογϡͰ͸ࣗಈత ʹਖ਼نԽ͞ΕΔ w ͜ΕʹΑΓ3FEVY΍5$"ͰඞཁͰ͋ͬͨਖ਼نԽ͠ ͨΩϟογϡΛࣗ෼Ͱ؅ཧ͢Δඞཁ͕ͳ͘ͳΔ w ͦͷ͓͔͛ͰΞʔΩςΫνϟ͕ͱͯ΋γϯϓϧʹ ͳΔ query ToDoView { todo { id all { id title done } unCompleted { id title done } completed { id title done } } }

82 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w ΫϥΠΞϯτΩϟογϡ query ToDoView { todo { id
all { id title done } unCompleted { id title done } completed { id title done } } } UPEP *E VO$PNQMFUFE JE UJUMF %POF DPNQMFUFE JE UJUMF %POF "MM JE UJUMF %POF άϥϑߏ଄ͷ··Ωϟογϡ͢Δ

83 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w ΫϥΠΞϯτΩϟογϡ query CompletedToDoView { todo { id
completed { id title done } } } UPEP *E VO$PNQMFUFE JE UJUMF %POF DPNQMFUFE JE UJUMF %POF "MM JE UJUMF %POF ΋͠ઌ΄Ͳͷ5P%P7JFXΛදࣔͨ͋͠ͱʹ $PNQMFUFE5P%P7JFX͕ϦΫΤετΛ౤͛Ε͹ɺ DPNQMFUFE͸Ωϟογϡώοτ͢Δ Ωϟογϡώοτ Ωϟογϡώοτ

84 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w ΫϥΠΞϯτΩϟογϡඞཁ w 3FEVY΍5$"ͰϖʔδΛදࣔ͢Δͨͼʹ"1*ίʔϧ͠ͳ͍Α͏ʹ͢ΔͨΊʹ4UPSF ʹอଘ͢Δ͜ͱ͕ଟ͍ w ͜ΕΛ͢΂ͯࣗಈͰ΍ͬͯ͘ΕΔ΋ͷͱߟ͑Δͱྑ͍

85 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w (SBQI2-ʹΑΔΩϟογϡͷϝϦοτ w σʔλม׵͕ෆཁʹͳΔ w 3FEVY΍5$"Ͱݫີʹ΍Ζ͏ͱ͢ΔͱɺҎԼͷछྨͷม׵͕ඞཁͩͬͨ w "1*Ϩεϙϯε༻ͷܕ
w ˠ4UPSFʹอଘ͢ΔͨΊͷ.PEFMͷܕ w ˠ7JFXʹදࣔ͢ΔͨΊͷ7JFX.PEFMͷܕ

86 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w (SBQI2-ʹ͓͚Δܕͷҙࣝ "1*ͷϨεϙϯεͷܕ Ωϟογϡͷܕ 7JFXʹදࣔ͢ΔͨΊͷ7JFX.PEFMͷܕ ม׵͕ඞཁͳ͍ query ToDoView
{ todo { ...CompletedTasksViewFragment } } struct ToDoView: View { @StateObject private var query = Query<ShopifyQuery.ToDoView>() var body: some View { VStack { if let data = query.response { VStack { CompletedTasksView(fragment: ɹɹɹɹɹɹɹɹɹɹɹɹ data.todo.fragments.completedTasksViewFragment) } } } } } 'SBHNFOUͱ͍͏ػೳͰ2VFSZͱ͸ผʹઐ༻ͷܕΛੜ੒͢Δ ੜ੒͞Εͨ'SBHNFOUΛίϯϙʔωϯτͷϑΟʔϧυͱ͢Δ ˠ'SBHNFOU$PMPDBUJPO fragment CompletedTasksViewFragment on ToDo { id completed { ...TaskViewFragment } } .PEFM͝ͱʹ'SBHNFOUΛ࡞ΔͷͰ͸ͳ͘ 7JFX͝ͱʹ࡞Δ͜ͱ͕େ੾ 2VFSZ΍'SBHNFOU͔Βੜ੒͞Εͨܕ͸7JFX༝དྷͷܕͰ͋ͬͯɺ .PEFM༝དྷͷܕͰ͸ͳ͍ɻ7JFXʹ౉ͯͦ͠ͷ··ར༻͢Δ 3&45ͷΑ͏ʹ.PEFMͷܕʹม׵ͯ͠͠·ͬͯ͸ (SBQI2-ͷϝϦοτ͕ଛͳΘΕΔ

87 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- VStack { Text("શToDo") TasksView(fragment: data.todo.fragments.tasksViewFragment) Text("ະ׬ྃToDo") UnCompletedTasksView(fragment: data.todo.fragments.unCompletedTasksViewFragment)
Text("׬ྃࡁΈToDo") CompletedTasksView(fragment: data.todo.fragments.completedTasksViewFragment) } query ToDoView { todo { ...TasksViewFragment ...UnCompletedTasksViewFragment ...CompletedTasksViewFragment } } 7JFXͷίʔυɺσʔλϑΣονɺ࠷ऴతͳ6*͕ରԠ એݴతσʔλϑΣονϯά એݴత6*

88 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w (SBQI2-ͷ2VFSZͱ"1*ίʔϧͷঢ়ଶ؅ཧͷվળ struct ToDoView: View { @StateObject private
var query = Query<Query.ToDoView>() var body: some View { VStack { if query.fetching { ProgressView() } else if let errorContent = query.error?.content { ErrorRetryButtonView( error: errorContent, retryAction: { query.refetch() } ) } else if let data = query.response { VStack { Text("શToDo") TasksView(fragment: data.todo.fragments.tasksViewFragment) Text("ະ׬ྃToDo") UnCompletedTasksView(fragment: data.todo.fragments.unCompletedTasksViewFragment) Text("׬ྃࡁΈToDo") CompletedTasksView(fragment: data.todo.fragments.completedTasksViewFragment) } } } } } "1*ίʔϧͷঢ়ଶ؅ཧͷվળͱ߹ΘͤΔͱɺͱͯ΋γϯϓϧʹը໘Λߏ੒Ͱ͖Δ ΫΤϦʔҎ֎͸͜ͷͭͷը໘Ͱ׬͍݁ͯ͠Δ

89 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w 5$"ͱൺֱ࣮ͨ͠૷࣌ͷ࡞ۀ w 5$" w ϑΣον͢Δ஋ͷঢ়ଶΛ4UPSFʹఆٛ w ਖ਼نԽΛݕ౼
w ϑΣον࣌ͷMPBEJOHͱFSSPSͷঢ়ଶΛ 4UPSFʹఆٛ w ϑΣον͢ΔͨΊͷ"DUJPOΛఆٛ w ϑΣον࣮ߦͷ࣮૷MPBEJOHΛ4UPSFʹ ߋ৽ w ϑΣον͢ΔͨΊͷ& ff FDUΛఆٛ w ϑΣονͨ݁͠ՌΛड͚Δ"DUJPOΛఆٛ w ϑΣον݁ՌɺMPBEJOHɺFSSPSΛ4UPSF ʹߋ৽ w 4UPSF͔Β7JFXʹϑΣονͨ͠஋Λ౉͢ w (SBQI2- w ΫΤϦʔ΍ϑϥάϝϯτΛఆٛ w ίʔυੜ੒ w 7JFXͰΫΤϦʔΛ࣮ߦͯ͠ϑΣον w -PBEJOH FSSPS औಘ݁ՌΛ7JFXʹ౉͢ ݕ౼ࣄ߲ͱ࣮૷ྔ͕େ෯ʹ࡟ݮ͞ΕΔ ·ͨ ݟͨ໨Λ࣮૷͢Δ 7JFXͷ࣮૷ ݟͨ໨ʹඞཁͳ஋Λߟ͑Δ 2VFSZͷهड़ ͱ͍͏։ൃऀͱͯ͠ۃΊͯࣗવͳࢥߟͱৼΔ෣͍Λ ௚઀తʹ࣮ࢪ͢Δ͚ͩͰը໘Λ࡞Δ͜ͱ͕Ͱ͖Δ

90 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w (SBQI2-ͷNVUBUJPOͱ"1*ίʔϧͷঢ়ଶ؅ཧͷվળ struct TaskView: View { @StateObject private
var toggleMutation = Mutation<Mutation.ToggleToDo>() let task: GraphQL.TaskViewFragment var body: some View { HStack { Text(task.title) Spacer() Button(action: { toggleMutation.perform(input: .init(id: task.id)) }) { if toggleMutation.executing { ProgressView() } else if task.done { Image(systemName: "checkmark.square.fill") .foregroundColor(.green) } else { Image(systemName: "square") } } } } } NVUBUJPO΋γϯϓϧʹ࣮૷είʔϓΛด͡Δ͜ͱ͕Ͱ͖Δ

91 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w Ҏ্Ͱɺ࠷ॳʹఆٛͨ͠ཧ૝తͳΞʔΩςΫνϟΛ࣮ݱͰ͖·ͨ͠ w ΞʔΩςΫνϟ΍ϑϨʔϜϫʔΫͷΑ͏ͳେ͖ͳ࿮૊ΈΛఆٛͨ͠ͱ͍͏ΑΓ͔͸ɺγ ϯϓϧͳݪཧݪଇΛੵΈ্͛ͨίʔυͱ͍͏ํ͕ద੾͔΋͠Ε·ͤΜ w ஫ҙࣄ߲ w
ࠓճͷίʔυ͸BQPMMPJPTΛಋೖ͢Δ͚ͩͰ͙͢ʹ࣮ݱͰ͖Δͱ͍͏Θ͚Ͱ͸͋Γ· ͤΜɻ w 8FCͷ"QPMMP͕͜ͷΑ͏ͳΠϯλʔϑΣʔεΛ͓࣋ͬͯΓɺBQPMMPJPT͕ͦΕʹ४ڌ Ͱ͖ΔΑ͏ʹ"QQJGZͰϥούʔΛ࣮૷͍ͯ͠·͢ɻ w BQPMMPJPTW͕ϦϦʔε͞ΕͨΒϥούʔͷ࣮૷͕ෆཁʹͳΔ͔΋͠Ε·ͤΜ

92 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w .VUBUJPO࣮ߦ࣌ͷαʔόͱΫϥΠΞϯτΩϟογϡͷಉظ w .VUBUJPOʹΑΓαʔόͷ5P%Pঢ়ଶΛม͑ͨͱ͖ʹ͸ɺΫϥΠΞϯτΩϟογϡͷ σʔλΛߋ৽͢Δ͜ͱͰ7JFXͱαʔόͷঢ়ଶΛಉظ͢Δඞཁ͕͋Δ 5BTLT7JFX 5BTL7JFX Ωϟογϡ
αʔό UPHHMF5P%P JE $PNQMFUFE 5BTLT7JFX 6O$PNQMFUFE 5BTLT7JFX λεΫʹνΣοΫΛ͍ΕͨΒҎԼ͕ඞཁ શ5P%PͷλεΫʹνΣοΫ ະ׬ྃ5P%P͔ΒͷλεΫΛআ֎ ׬ྃࡁΈ5P%P΁௥λεΫΛ௥Ճ

93 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- 5BTLT7JFX 5BTL7JFX Ωϟογϡ αʔό UPHHMF5P%P JE mutation ToggleTodo($input:
ToggleToDoInput!) { toggleToDo(input: $input) { todo { ...TasksViewFragment ...UnCompletedTasksViewFragment ...CompletedTasksViewFragment } } } (SBQI2-Ͱ͸.VUBUJPOͷϨεϙϯεʹΑΓࣗಈత ʹΩϟογϡ͕ߋ৽͞Εɺଓ͍ͯ7JFX΋ࣗಈతʹ ࠶ϨϯμϦϯά͞ΕΔ Ϩεϙϯε Ϩεϙϯε͔Β Ωϟογϡߋ৽ ࠶ϨϯμϦϯά w .VUBUJPO͔ΒͷΩϟογϡߋ৽ 7JFXʹରԠͨ͠'SBHNFOUΛϨεϙϯεͰฦ͢ 3FEVY΍5$"Ͱ͸ߋ৽͢ΔίʔυΛॻ͘ඞཁ͕͋ Δ͕ɺ(SBQI2-Ͱ͸NVUBUJPOͷ࣮ߦҎ֎ʹ͢Δ͜ ͱ͸ͳ͍

94 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- 5BTLT7JFX 5BTL7JFX Ωϟογϡ αʔό UPHHMF5P%P JE BQPMMPͰ͸0QUJNJTUJD6*Λ࣮ݱ͢ΔͨΊʹɺ NVUBUJPOͷૹ৴ͱಉ࣌ʹΩϟογϡͷߋ৽͕Մೳ
Ϩεϙϯε w .VUBUJPOͷϨεϙϯεͷલʹ7JFXΛߋ৽͍ͨ͠৔߹ w νΣοΫϘοΫεΛλοϓͨ͠Β͙͢ʹ7JFXʹ൓ө͍ͨ͠ Ωϟογϡߋ৽ ࠶ϨϯμϦϯά ϨεϙϯεʹΑΔ Ωϟογϡߋ৽ ϨεϙϯεʹΑΔ ࠶ϨϯμϦϯά

95 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w ͦͷଞͷ(SBQI2-ͷϝϦοτ w σβΠϯͷϢʔεέʔεʹҾͬுΒΕͯɺ"1*Λมߋ͢Δඞཁ͕ͳ͍ w ΫϥΠΞϯτʮը໘9ʹ:Λදࣔ͢Δඞཁ͕Ͱ͖ͨͷͰɺ9"1*Ͱ:ΛҾ͖͍ͨʯ w 3&45ύλʔϯΫϥΠΞϯτଆ͕ଥڠ͢Δ৔߹
w όοΫΤϯυʮ9"1*ͷ੹຿͔Β:͸֎ΕΔͷͰ:"1*Λ࣮ߦͯ͠ཉ͍͠ʯ w ΫϥΠΞϯτʮ9"1*ͱ:"1*ճ࣮ߦ͢Δ͔ʜ355Ͱ69མͪ͠ίʔυ΋ෳࡶʹͳΔͳʯ w 3&45ύλʔϯόοΫΤϯυଆ͕ଥڠ͢Δ৔߹ w όοΫΤϯυʮ9"1*Ͱ:ฦ͢Α͏ʹ͢Δ͔ʜ੹຿ͱͯ͠ҧ࿨ײ͋Δ͠ɺଞͷը໘Ͱ࢖Θͳ͍ͷ ʹ༨ܭͳ3FBE૿͑Δͳɻ΋͘͠͸ઐ༻ͷ9:"1*௥Ճ͢Δ͔ʜʯ w (SBQI2-ͷ৔߹ΫϥΠΞϯτόοΫΤϯυͲͪΒ΋޾ͤ w όοΫΤϯυʮը໘9༻ʹ9ͱ:ΛҾ͘2VFSZΛॻ͍ͯऔಘ͍͍ͯ͠Αଞͷը໘Ͱ͸9͚ͩΛҾ͘ 2VFSZॻ͚͹ຖճ:ΛҾ͘ඞཁͳ͍͔ΒύϑΥʔϚϯεͷ໰୊΋ͳ͍Αʯ w ΫϥΠΞϯτʮ355ͰࡁΉ͠ɺίʔυ͸γϯϓϧɺը໘Ͱඞཁͳ஋͢΂ͯऔಘͰ͖ͯخ͍͠ʯ w όοΫΤϯυΤϯδχΞͱͯ͠ͷ (SBQI2-࠷େͷϝϦοτ

96 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w (SBIQ2-ͷ໰୊఺ w όοΫΤϯυ͕(SBQI2-Ͱ࣮૷͞Ε͍ͯΔ͜ͱ͕ඞਢ όοΫΤϯυνʔϜͷ"1*αʔόΛ(SBQI2-ʹͯ͠΋Β͏ όοΫΤϯυνʔϜʹ(SBQI2-ͷ#''Λ༻ҙͯ͠΋Β͏
ΫϥΠΞϯτνʔϜͰڠྗͯ͠(SBQI2-ͷ#''Λ༻ҙ͢Δ w νʔϜঢ়گʹΑΔͱࢥ͍·͕͢ɺ৽نͳΒ͕͓͢͢ΊͰ͢ɻ w طଘͷ3&45΍H31$ͷ.JDSPTFSWJDFT͕͋Δ৔߹͸ɺ͔ʹͳΔͱࢥ͍·͢ɻ w ฐࣾ͸৽ن։ൃͰͰ͕͢ɺόοΫΤϯυͷ(SBQI2-։ൃ޻਺ΛؚΊͯ΋νʔϜͱͯ͠ ͷ։ൃ޻਺͸େ෯ʹ࡟ݮͰ͖͍ͯ·͢ɻ w ·ͨόοΫΤϯυ୯ମͰߟ͑ͯ΋։ൃ޻਺͸Լ͕͍ͬͯΔͱೝ͍ࣝͯ͠·͢ɻ w 3PQQPOHJ(SBQI2-ͷಈըͰɺ(SBQI2-࠾༻اۀ͕࿩͍ͯ͠ΔͷͰͥͻ͝ཡ͍ͩ͘͞

97 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w BQPMMPJPTͷ໰୊఺ w ൃల్্ w ੜ੒͞ΕΔίʔυαΠζ͕େ͖͘Ϗϧυ͕஗͍ w ੜ੒͞ΕΔ഑ྻ͕JEFOUJ
fi BCMFͰ͸ͳ͍ͷͰ࣮૷͢Δඞཁ͕͋Δ w $PEBCMFະରԠ w 8FC൛ͷ"QPMMPʹൺ΂Δͱػೳ͕ෆ଍ w ϖʔδωʔγϣϯ w એݴత6*ʹదͨ͠ΠϯλʔϑΣʔε w -PDBMTUBUF w ݱࡏBQPMMPJPTWͷ։ൃ͕ਐΜͰ͍ΔͷͰظ଴

98 ༨ஊίϯϙʔωϯτ֊૚ͷεΩοϓ w 3FEVYͰ͸άϩʔόϧεςʔτʹϨεϙϯεͷ݁ՌΛอ͍࣋ͯ͠Δ͕ɺίϯϙʔωϯτ ֊૚ͷεΩοϓ͸ਪ঑͞Εͳ͍͜ͱ͕͋Δ w ঢ়ଶͱίϯϙʔωϯτͷґଘؔ܎͕Θ͔ΓͮΒ͘ͳΔ w ϨϯμϦϯά͕ฒߦͯ͠ߦΘΕΔΑ͏ʹͳΔͱ͖ʹݒ೦͕͋Δ 3PPU7JFX
6TFS7JFX 1SPEVDU 7JFX 4UPSF͔Β6TFS7JFX΁௚઀౉͢͜ͱ͸ ճආ͢Δ΂͖ʁ 4UPSF 6TFS৘ใ 6TFS 3PPU7JFX 6TFS7JFX 1SPEVDU 7JFX 4UPSF 6TFS৘ใ 3PPU7JFX͸6TFS͸ ෆཁ͚ͩͲܦ༝͢Δ 6TFS 6TFS εΩοϓ͠ͳ͍৔߹ εΩοϓ͢Δ৔߹

99 ༨ஊίϯϙʔωϯτ֊૚ͷεΩοϓ 3PPU7JFX 6TFS7JFX 1SPEVDU 7JFX 4UPSF 6TFS৘ใ 6TFS 3FEVY
(SBQI2- 3PPU7JFX 6TFS7JFX 1SPEVDU 7JFX 6TFS (SBQI2-͸ΫΤϦʔͰ ௚઀औಘ͢ΔͨΊεΩοϓ͕ͳ͍ ͷͰ໰୊͸ͳ͍ ຊ౰ʜʁ

100 ༨ஊίϯϙʔωϯτ֊૚ͷεΩοϓ 3PPU7JFX 6TFS7JFX 1SPEVDU 7JFX 4UPSF 6TFS৘ใ 6TFS 3FEVY
(SBQI2- 3PPU7JFX 6TFS7JFX 1SPEVDU 7JFX 6TFS (SBQI2- Ωϟογϡ 6TFS৘ใ w ࣮ࡍʹ͸(SBQI2-ʹ΋άϩʔόϧͳΩϟογϡ͕ଘࡏ͍ͯͯ͠ɺ͔ͦ͜Βऔಘ͍ͯ͠ΔͷͰ ֓೦తʹ͸άϩʔόϧεςʔτ͔ΒεΩοϓ͍ͯ͠ΔͷͱมΘΒͳ͍ͷͰ͸ʁ w ࣗ෼ͱͯ͠͸ɺϨεϙϯεΩϟογϡʹ͍ͭͯ͸3FEVYͷ৔߹εΩοϓͯ͠΋͠ΐ͏͕ͳ͍ ͱߟ͍͑ͯ·͢ɻ͕͢͞ʹ͢΂ͯͷ஋Λϧʔτ͔Β1SPQ%SJMMJOH͢Δ։ൃମݧ͸ਏ͍ͱࢥ͍ ·͢ʜͱ͸͍͑ࠓޙͦ͏͠ͳ͍ͰࡁΉํ๏͸໛ࡧ͍ͯ͘͠ඞཁ͕͋Δͱ͸ࢥ͍·͢ɻ ྆ऀʹେ͖ͳҧ͍͸ͳ͍ʁ

101 ༨ஊίϯϙʔωϯτ֊૚ͷεΩοϓ 3PPU7JFX .PEBM7JFX 1SPEVDU 7JFX 4UPSF JT0QFO JT0QFO 3FEVY
w ͨͩ΋ͪΖΜ7JFXͷঢ়ଶͳͲΛ4UPSFʹ഑ஔͯ͠ɺεΩοϓ͢Δ͜ͱ͸είʔϓ͕޿͕ Γґଘؔ܎Λᐆດʹ͢Δ͜ͱʹܨ͕ΔͷͰɺՄೳͳݶΓճආͨ͠ํ͕ྑ͍ͱࢥ͍·͢ 3PPU7JFX .PEBM7JFX 1SPEVDU 7JFX 4UPSF JT0QFO ඞཁͳίϯϙʔωϯτ͕ ঢ়ଶΛ࣋ͯ͹े෼

102 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙(SBQI2- w (SBIQ2-ʹΑͬͯঢ়ଶͷଊ͑ํ͕େ͖͘มΘΓ·ͨ͠ w ϨεϙϯεΩϟογϡͱͦΕҎ֎ͷঢ়ଶ 7JFXͷঢ়ଶͳͲ w (SBQI2-ΫϥΠΞϯτ͸ɺϨεϙϯεͷঢ়ଶ؅ཧΛΩϟογϡͱͯ͠࠷దͳܗͰ؅ཧ
͢Δ͜ͱΛఏҊ w ਖ਼نԽɺܕม׵ɺΩϟογϡͷߋ৽ͷ࣮૷͕ෆཁ w એݴత6* (SBQI2-ͰଞͷΫϥΠΞϯταΠυͷίʔυͱύϥμΠϜΛ౷ҰͰ͖Δ w "QQJGZͷίʔυ͸8FCɺ"OEPJSEɺJ04ͲΕ͔ॻ͚Ε͹શ෦ͷίʔυ͕ಡΊ·͢ w ࠓճઆ໌ͨ͠Ҏ֎ʹ΋(SBIQ2-ʹ͸ศརͳػೳ͕ଟ͘ଘࡏ͠·͢ w ͦͯ͠·ͩൃల్্ͳͷͰࠓޙͷ੒௕ʹ΋ظ଴͍ͯ͠·͢

"GUFS(SBQI2-

104 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"GUFS(SBQI2- 4UBSU 'MVY 3FEVY -JGUJOH 4UBUF6Q 5$" 3FEVY 5PPM,JU
35, 2VFSZ (SBQI2- 3FBDU 2VFSZ 3FBDUDPSF νʔϜͷࢥ૝ ΫϥΠΞϯτ Ωϟογϡ 3FEVYͷվྑ ϘΠϥʔ ςϯϓϨʔτͷ࡟ݮ 3FDPJM 4UBUFߋ৽ͷ ఻೻Λ7JFX͔Β෼཭ 4JOHMF4PVSDFPG5SVUI ΫϥΠΞϯτ ΩϟογϡΛ3FEVYͰ࣮ݱ ΫϥΠΞϯτ ΩϟογϡΛ3&45Ͱ࣮ݱ 3FBDU2VFSZͱ35,2VFSZͷొ৔ ୯ํ޲σʔλϑϩʔ

105 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"GUFS(SBQI2- w (SBQI2-ͷීٴʹΑΓ։ൃίϛϡχςΟ͸͋Δ͜ͱʹؾ͕͖ͭ·ͨ͠ɻ w ঢ়ଶΛάϩʔόϧεςʔτʹ͔࣋ͪͨͬͨΘ͚Ͱ͸ͳ͍ w 3&45Ͱ΋ಉ͡Α͏ͳ͜ͱ͕࣮ݱͰ͖Δʁ զʑ͕࣮ݱ͔ͨͬͨ͜͠ͱ͸ɺ"1*ϨεϙϯεΛ Ωϟογϡ͢Δ͜ͱͩͬͨͷͰ͸ʂʁ

106 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙"GUFS(SBQI2- w ͦΕʹΑΓීٴͨ͠ͷ͕3FBDU2VFSZ΍35,2VFSZͳͲͷϥΠϒϥϦͰ͢ɻ w 3FBDU2VFSZ͸γϯϓϧʹ3&45ͰΩϟογϡͰ͖ΔΑ͏ʹͨ͠ϥΠϒϥϦͰ͢ɻ w ΋͠ࠓ·Ͱ3FEVYΛ"1*ϨεϙϯεΩϟογϡͷͨΊ͚ͩʹར༻͍ͯͯ͠3FBDU 2VFSZΛ࠾༻ͨ͠ͳΒ͹3FEVY͕ෆཁʹͳΔ w
4XJGUʹ͸ӨڹΛड͚ͨGNP1JHFPO͕͋Γ·͢ ීٴ͍ͯ͠ΔΘ͚Ͱ͸ͳ͍ w 35, 3FEVY5PPM,JU 2VFSZ͸ɺ3FEVYͰΩϟογϡΛͰ͖ΔΑ͏ʹͨ͠ϥΠϒϥϦ Ͱ͢ɻ w 3FEVYΛ"1*ϨεϙϯεҎ֎ͷ༻్Ͱ࢖͍ͬͯͨ৔߹ͳͲɺ3FEVYΛ࢖͍ͳ͕ΒϨ εϙϯεΩϟογϡΛར༻͢Δ৔߹ʹར༻͠΍͍͢ w ͔͜͠͠ΕΒ͸(SBQI2-Ͱ͸ͳ͍ͨΊਖ਼نԽ͕Ͱ͖ΔΘ͚Ͱ͸ͳ੍͘໿͕͋Γ·͢ɻ

3FDPJM

108 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FDPJM 4UBSU 'MVY 3FEVY -JGUJOH 4UBUF6Q 5$" 3FEVY 5PPM,JU
35, 2VFSZ (SBQI2- 3FBDU 2VFSZ 3FBDUDPSF νʔϜͷࢥ૝ ΫϥΠΞϯτ Ωϟογϡ 3FEVYͷվྑ ϘΠϥʔ ςϯϓϨʔτͷ࡟ݮ 3FDPJM 4UBUFߋ৽ͷ ఻೻Λ7JFX͔Β෼཭ 4JOHMF4PVSDFPG5SVUI ΫϥΠΞϯτ ΩϟογϡΛ3FEVYͰ࣮ݱ ΫϥΠΞϯτ ΩϟογϡΛ3&45Ͱ࣮ݱ 3FDPJM͸'BDFCPPL੡ϥΠϒϥϦ 3FBDUDPSFνʔϜఏڙͰ͸ͳ͍ͷͰ3FBDUެࣜϥΠϒϥϦͰ͸ͳ͍ (SBQI2-ΫϥΠΞϯτͷ3FMBZͷ։ൃ͸3FBDUDPSFνʔϜ ୯ํ޲σʔλϑϩʔ

109 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FDPJM w -JGUJOH4UBUF6Qͷ໰୊఺ w ࠶ϨϯμϦϯάͷ໰୊΋͋Δ શҰཡ7JFX ׬ྃҰཡ 7JFX ະ׬ྃҰཡ
7JFX 5P%P7JFX 6TFS7JFX 6TFS ঢ়ଶ 3PPU7JFX શҰཡ ঢ়ଶ 7JFXͷ֊૚ͱঢ়ଶͷ఻೻ͷ֊૚ ͕ඥ͍͍ͮͯΔ UPEPT fi MUFS UPEPEPOF UPEPT fi MUFS UPEPEPOF

110 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FDPJM w 3FDPJMͰ͸7JFXͱ͸ಠཱͯ͠ɺঢ়ଶͱ4FMFDUPSΛఆٛͰ͖Δ w ൺֱత௚ײతͰૉ௚ʹཧղͰ͖Δ શҰཡ7JFX ׬ྃҰཡ 7JFX ະ׬ྃҰཡ
7JFX 5P%P7JFX શҰཡ ঢ়ଶ UPEPT fi MUFS UPEPEPOF UPEPT fi MUFS UPEPEPOF

111 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FDPJM w 7JFXͱঢ়ଶΛಠཱͤͯ̏࣍͞ݩతʹଊ͑ΒΕΔΑ͏ʹͳͬͨͱߟ͑Δͱཧղ͠΍͍͢Ͱ ͢

112 એݴత6*ͷঢ়ଶ؅ཧΞʔΩςΫνϟͷྺ࢙3FDPJM w (SBQI2-ͳͲͷΫϥΠΞϯτΩϟογϡͱ͸ҟͳΔ՝୊Λղܾ͢Δ w 7JFXͳͲαʔόʹ͸ͳ͍ঢ়ଶΛ࣋ͭΞϓϦέʔγϣϯͰ༗ޮ w (SBQI2-ͳ͠ͰΩϟογϡΛ͢ΔͨΊʹ3FEVYͷ୅ΘΓʹ3FDPJMΛ࢖͏͜ͱ΋Ͱ͖Δ w ·ͨVTF3FEVDFSͷొ৔Ҏ߱3FEVDFS͸ඞਢͷ΋ͷͰ͸ͳ͘ɺ࣮૷खஈͷͭͱͯ͠ೝࣝ
͞ΕΔΑ͏ʹͳͬͨͨΊɺ3FDPJMͰ΋γϯϓϧͳTFU4UBUFܗࣜͱSFEVDFSܗࣜ͸બ୒͢Δ ͜ͱ͕Մೳͱͳ͍ͬͯΔɻ w ͜Εʹ֘౰͢Δීٴ͍ͯ͠ΔϥΠϒϥϦ͸4XJGUʹ͸ͳ͍͸ͣͳͷͰɺࠓޙཁ஫໨

ۙ೥ͷΞʔΩςΫνϟͷ܏޲

114 ۙ೥ͷΞʔΩςΫνϟͷ܏޲ w 8FCओʹ64ͷΤϯδχΞ w 9͕࣠ຬ଍౓ w :͕࣠࢖ͬͨ͜ͱ͕͋Δ͔ w ંઢ͸೥͝ͱͷਪҠ
w ݁Ռ w 3FEVYܦݧऀ͸ଟ͍ w ׂ w (SBQI2-ܦݧऀ͸೥࿈ଓ૿Ճ w ׂ w 3FEVYͷຬ଍౓͸௿Լ܏޲ w (SBQI2-͸ׂ͕ۙ͘ຬ଍͍ͯ͠Δ w ଞٕज़ͷதͰ΋τοϓ w ࠓޙ͸ར༻Ϣʔβ͕૿͑ͯ௿Լ͕༧ ૝͞ΕΔ Ҿ༻5IF4UBUFPG+BWB4DSJQU4VSWFZ IUUQTTUBUFPGKTDPNKB+1

115 ۙ೥ͷΞʔΩςΫνϟͷ܏޲ w J044XJGU6* w 5$"͕ීٴ͍ͯ͠Δʁ w ࠓޙ(SBQI2-ͳͲͷϨεϙϯεΩϟογϡ੎ͷಈ޲ʹཁ஫໨ w "OESPJE+FUQBDL$PNQPTF
w +FUQBDL$PNQPTFDPSFνʔϜʹ͸ҎԼͷϝϯόʔ͕ࡏ੶ w ݩ3FBDUDPSFνʔϜͷΤϯδχΞ w ݩ"JSCOCͷ3FBDUΤϯδχΞ w 3FBDUಉ౳Ҏ্ͷ͜ͱ͕Ͱ͖ΔͷͰ3FBDUͰ࿩୊ʹͳͬͨΞʔΩςΫνϟ΍ઃܭ͸ద ༻Մೳ w ৽͍ͨ͠Ίɺ·ͩྲྀߦ͍ͬͯΔΞʔΩςΫνϟ͸ͳ͍ҹ৅ w ࠓޙ.77.ɺ3FEVYͳͲͷద༻ݕূ͕࢝·Δ͸ͣ

116 ۙ೥ͷΞʔΩςΫνϟͷ܏޲ w $MFBO"SDIJUFDUVSF w ͜Ε͸ঢ়ଶ؅ཧͷΞʔΩςΫνϟͰ͸ͳ͍ͷͰผ్࠾༻͢Δ͜ͱ΋ෆ࠾༻ͱ͢Δ͜ͱ ΋Ͱ͖·͢ɻ w ࠷ॳ͸͋ͷਤΛ͢΂ͯ࠶ݱ͢Δ͜ͱ͸ͤͣʹඞཁͳͱ͜ΖʹϞοΫΛͤ͞ΔΑ͏ʹ͠ ͓͚ͯͩ͘Ͱे෼ͩͱࢥ͍·͢
w ·ͨ"QPMMPͳͲͷϥΠϒϥϦ͕.PDLͷػೳΛ͍࣋ͬͯΕ͹ͦΕͰे෼͔΋͠Ε· ͤΜ w ·ͨ7JFXΛಠཱͤ͞Δ͜ͱ͕໨తͰ͋Ε͹1SFTFOUBUJPOBM$PNQPOFOU 4UBUFMFTT $PNQPOFOU ͱ$POUBJOFS$PNQPOFOU 4UBUFGVM$PNQPOFOU ʹ෼ׂ͢Δͱ͜Ζ͔Β࢝ Ίͯ΋ྑ͍͔΋͠Ε·ͤΜɻ w ͨͩ͜͠Ε΋͢΂ͯʹద༻͢Δͱ͍͏ํ਑͸͓קΊ͠·ͤΜ

ͲͷΞʔΩςΫνϟ͕ྑ͍ͷ͔ʁ

118 ͓͢͢Ίͳબ୒ࢶ w -JGUJOH4UBUF6Qͱ0CTFSWBCMF0CKFDU w ࢝Ί͸໰୊ͳ͍ݶΓ͜Ε͚ͩΛҙࣝͯ͠։ൃͯ͘͜͠ͱΛ͓͢͢Ί͠·͢ w ಛʹϨεϙϯεΩϟογϡ͕ෆཁͳ৔߹͸ɺ͜Ε͚ͩͰे෼Ͱ͠ΐ͏ w ·ͣ͸ެࣜͱͯ͠ਪ঑͍ͯ͠Δجຊతͳ΍ΓํΛཧղ͢Δ͜ͱΛ༏ઌ͍ͯͩ͘͠͞
w ࠷ॳ͔Βʮ999ΞʔΩςΫνϟΛ࠾༻ʂʯͱ͍͏͜ͱ͸͓͢͢Ί͠·ͤΜ w ೉͘͠ߟ͑ͯϋʔυϧΛ্͛ͳ͍Α͏ʹ͠·͠ΐ͏ w ΧϓηϧԽɺείʔϓͷݶఆɺϦʔμϏϦςΟɺ࣮૷޻਺ɺγϯϓϧ͞ɺJNVUBCJMJUZɺ ςελϏϦςΟͳͲϓϩάϥϜͷݪଇΛݩʹࣗ਎ͰࢼߦࡨޡΛॏͶ͍ͯͩ͘͞ w ΞʔΩςΫνϟ͸*NNVUBCJMJSUZ΍ςελϏϦςΟͷਖ਼͠͞ʹ஫໨͗͢͠Δ܏޲͕͋ ΔͷͰؾΛ͚͍ͭͯͩ͘͞ w ਖ਼͠͞ͷͨΊʹΞʔΩςΫνϟΛ࠾༻͢ΔͷͰ͸ͳ͘ɺجຊΛ΍্͍ͬͯ͘Ͱࣗ਎Ͱ ՝୊Λମݧͯ͠ɺͦͷ՝୊Λղܾ͢ΔͨΊʹ࣍ͷखஈΛ୳͍ͯͩ͘͠͞

119 ͓͢͢Ίͳબ୒ࢶ w 5IF$PNQPTBCMF"SDIJUFDUVSF w 3FEVDFS΍& ff FDUʹັྗΛײͨ͡Βঢ়ଶߋ৽ϧʔϧΛ5$"ʹै͏ w 3PPUʹͭͷ4UPSFΛ഑ஔ͢ΔͷͰ͸ͳ͘খ͍͞είʔϓʹ4UPSFΛఆ͍ٛͯ͘͜͠
ͱΛ͓͢͢Ί͠·͢ w ϨεϙϯεΩϟογϡʹ͍ͭͯ͸ɺ3PPUʹͭͷ4UPSFΛ഑ஔ͢Δબ୒ࢶΛݕ౼͠ ͯ΋Α͍͔΋͠Ε·ͤΜ w "1*ίʔϧΛ5$"ͷ& ff FDUͰ؅ཧ͢Δ৔߹ w "1*ͷMPBEJOH΍FSSPSͷঢ়ଶ͸5$"ʹ഑ஔ͠ɺ"TZOD༻ͷؔ਺Λ༻ҙ͠ͳ͍ɻ w ௥ՃͰϨεϙϯεΩϟογϡͰ͖ΔϥΠϒϥϦΛ࠾༻͢Δ৔߹ w Ωϟογϡ͸5$"Ͱ͸ͳ͘ϥΠϒϥϦʹ೚ͤΔ w "1*ͷMPBEJOH΍FSSPSͷঢ়ଶ΋5$"ʹ͸ஔ͔ͣʹ"TZOD༻ؔ਺Λ࡞Δ w ͜Ε͸ࢲͷҙݟͳͷͰ5$"ͷηΦϦʔ͸10*/5'3&&Λ֬ೝ͍ͯͩ͘͠͞ w & ff FDU΋ؚΊͨςελϏϦςΟͳͲ͸ࣦΘΕ·͢ɻ

120 ͓͢͢Ίͳબ୒ࢶ w (SBQI2-"QPMMP w (SBQI2-Λ࠾༻͍ͯ͠ΔͳΒ໎Θͣ͜Ε w (SBQI2-ͷϨεϙϯεΩϟογϡ 7JFXͷঢ়ଶ͸-JGUJOH4UBUF6Q w
ϨεϙϯεΩϟογϡҎ֎ͷঢ়ଶ؅ཧʹ5$"Λ࠾༻͢Δͱ΋Ͱ͖Δ

121 ·ͱΊ w 4XJGU6*Λϕʔεʹɺ(SBQI2-ʹΑΔϨεϙϯεΩϟογϡɺ-JGUJOH4UBUF6Qɺ"1* ίʔϧͷվળΛ͢Δ͜ͱͰͱͯ΋γϯϓϧʹ࣮૷Ͱ͖Δ͜ͱΛ঺հ͠·ͨ͠ w ͜ΕΒ͸ΞʔΩςΫνϟͱ͍͏ΑΓ͔͸γϯϓϧͳݪଇͰ͋ΓɺͦΕͧΕ͸೉͍͠΋ͷ Ͱ͸͋Γ·ͤΜɻ w ΞʔΩςΫνϟΛݕ౼͢Δͱ༗໊ͳΞʔΩςΫνϟͷਤʹै͍ਖ਼͘͠ίʔυΛ෼ׂ͢Δ
ํ๏Λߟ͑Δ͜ͱ͕໨తʹͳͬͯ͠·͏͜ͱ͕͋Γ·͢ɻ w ͔͠͠େ੾ͳ͜ͱ͸՝୊Λղܾ͢Δ͜ͱͰ͢ɻ w ࠓճ͸෼ׂํ๏͚ͩͰ͸ͳ͘ΞʔΩςΫνϟ͕ղܾͨ͠՝୊Λ͓఻͑͢Δ͜ͱͰɺ͝ ࣗ਎Ͱ͔ΒΞʔΩςΫνϟͷඞཁੑΛݕ౼͢Δ͖͔͚ͬʹͳΕ͹خ͍͠Ͱ͢ɻ

122 ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ 4QFBLFS%FDLͷ֓ཁཝʹؔ࿈εϥΠυΛܝࡌ͍ͯ͠·͢

宣言的UIの状態管理とアーキテクチャSwiftUIとGraphQLによる実践/swiftui-graphql

宣言的UIの状態管理とアーキテクチャSwiftUIとGraphQLによる実践/swiftui-graphql

More Decks by sonata

Other Decks in Programming

Featured

Transcript