Tweet
Tweet

Slide 1

Slide 1 text

Solid.jsͰ LeacTion!Λ࡞Γ௚͠·ͨ͠ WebφΠτٶ࡚ vol.18 2023-07-14 ܂ാӳࢿ

Slide 2

Slide 2 text

ࣗݾ঺հ • ͘Θ͸͍͚ͨ͑͢(40) • ϑϦʔϥϯεΤϯδχΞ • ϝϯλʔɺ։ൃ • อҭԂͷࣄ຿ ← New! • झຯɿεΩϡʔόμΠϏϯάɺΧϝϥɺυϩʔϯɺetc • ؔ਺ܕϓϩάϥϛϯάษڧձ Miyazaki FP ࢝Ί·ͨ͠

Slide 3

Slide 3 text

ւͷதͰ΋଴ͬͯ·͢ʂ

Slide 4

Slide 4 text

LeacTion! (= Reaction! For LT) • WebφΠτٶ࡚Ͱ͸͓ͳ͡Έͷษڧձ༻ͷίϝϯτ౤ߘπʔϧ • ϩάΠϯෆཁͰ͙͢࢖͑Δ • ϦχϡʔΞϧޙ͸Πϕϯτ؅ཧऀ͚ͩϩάΠϯඞਢ • ޿ࠂͳ͠ˍແྉͰఏڙ • ·ͩϚχϡΞϧ౳͕੔උͰ͖ͯͳ͍͚ͲɺେମΘ͔ΔΑͶʁ • ͥͻΠϕϯτͰ࢖ͬͯײ૝Λ͍ͩ͘͞

Slide 5

Slide 5 text

LeacTion!Λ࡞ͬͨͱ͖ • 2020೥10݄͝Ζ • Vue3Λ৮ͬͯΈ͔ͨͬͨʢͦͷޙ Vue3.2 ͷษڧʹ΋ͳͬͨʣ • Firebaseͷ࢖͍ํΛؚΊɺͱͯ΋ษڧʹͳͬͨ • ҰํͰɺFirestoreͷੑೳΛ׆͔͢࢖͍ํ͕Ͱ͖͍ͯͳ͍ͳͲ՝୊΋Θ ͔͖ͬͯͨɻ • Α͘ߟ͑ͨΒ Functions ͱ͔࢖Θͳͯ͘΋͍͍ͷͰ͸ʁ

Slide 6

Slide 6 text

ػೳ͸͜ͷ͘Β͍Ͱ͍͍

Slide 7

Slide 7 text

಺෦ઃܭΛ΍Γͳ͓͍ͨ͠

Slide 8

Slide 8 text

Ͳ͏ͤͳΒ৽͍͜͠ͱΛֶͼ͍ͨ

Slide 9

Slide 9 text

࢖ͬͯΈ͍ͨϑϨʔϜϫʔΫ͸ʁ

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

Solid.js • ॻ͖ํ͸΄ͱΜͲReact • Ծ૝DOMΛ࢖Θͳ͍ͷͰඇৗʹߴ଎ʢSvelte΋ಉ͡ʣ • ϦΞΫςΟϒ͕పఈ͞Ε͍ͯΔʢ޷ΈͷϙΠϯτʣ • ·ͩར༻ऀ͕গͳ͍ͷͰϥΠϒϥϦ΍஌ݟ͕ཷ·͍ͬͯͳ͍ • ReactΛࢀߟʹ͠ͳ͕Β࡞ͬͯΔ෦෼΋ • Svelte΋ީิʹ͕͋ͬͨɺݸਓతʹผͷͱ͜ΖͰ৮ͬͯͨ

Slide 12

Slide 12 text

State of JS 2022 ͰΈΔར༻཰ Ref: https://2022.stateofjs.com/ja-JP/libraries/front-end-frameworks/

Slide 13

Slide 13 text

State of JS 2022 ͰΈΔຬ଍౓ Ref: https://2022.stateofjs.com/ja-JP/libraries/front-end-frameworks/

Slide 14

Slide 14 text

Solid.jsΛ࢖ͬͯΈͨײ૝ɿे෼ͳඪ४ػೳ • σʔλ؅ཧͷઃܭ • ෳࡶͳσʔλ(store)ͷ෦෼ߋ৽ʹؔ͢Δඪ४ػೳ͕͋Γɺ͘͢͜͝ ͳΕ͍ͯΔ • ඇಉظॲཧ • ֎෦σʔλͷऔಘʹؔ͢Δ࢓૊ΈͳͲ͕ඪ४Խ͞Ε͍ͯΔ • ϦΞΫςΟϒͳઃܭ͕ͱͯ΋ྑ͍

Slide 15

Slide 15 text

ྫɿreconcile • ༩͑ΒΕͨσʔλͷʮࠩ෼ʯ͚ͩʹ஫໨ͯ͠ϨϯμϦϯάΛ཈͑Δ

Slide 16

Slide 16 text

·ͱΊ • ࡞Γ௚͢ͷ͕ͱͯ΋ָ͔ͬͨ͠ˍֶͼ͕͋ͬͨ • ڠྗͯ͘͠ΕͨࡾӜ͘Μʹײँʂ • طଘͷϑϨʔϜϫʔΫ΍ΤίγεςϜͷྑ͍ͱ͜Ζ΍ෆධͳϙΠϯτ ΛऔΓೖΕͯ࡞ΒΕ͍ͯΔ࢓૊Έ͸ྑֶ͍ͼΛಘΒΕΔ • ຊ൪Ͱ࢖͏͔͸ผͱͯ͠ɺ࣮ࡍʹ৮ΕͯΈΔͷ͸ͱͯ΋େࣄ • ୭͔LeacTion!ͷྑ͍σβΠϯΛߟ͍͑ͯͩ͘͞