Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
React HooksͰ ඒ͍͠ίʔυΛॻ͘ ࠜ؛ప
Slide 2
Slide 2 text
ࣗݾհ • ࠜ؛ప • ϥϯαʔζגࣜձࣾ 2018.04 ~ • େֶ • ֶ෦ɿཧֶ • େֶӃɿϓϩμΫτ։ൃ • ϑΝΠφϯγϟϧϓϥϯφʔ3ڃ
Slide 3
Slide 3 text
ࠜ؛ప React HooksͰ ඒ͍͠ίʔυΛॻ͘
Slide 4
Slide 4 text
No content
Slide 5
Slide 5 text
ಡΈ͢͞ͷجຊఆཧ ίʔυଞͷਓ͕࠷࣌ؒͰཧղͰ ͖ΔΑ͏ʹॻ͔ͳ͚ΕͳΒͳ͍ ಡΈ͢͞ͷجຊఆཧ ίʔυଞͷਓ͕࠷࣌ؒͰཧղͰ ͖ΔΑ͏ʹॻ͔ͳ͚ΕͳΒͳ͍
Slide 6
Slide 6 text
No content
Slide 7
Slide 7 text
ಛʹॏཁͳͷ͕ʮγϯϓϧͰ͋Δʯͱ͍͏͜ͱͰ͢ɻ ΞϓϦέʔγϣϯγεςϜ͕શମͱͯ͠ͲΕ΄Ͳෳ ࡶͰ͋ͬͯɺݸʑͷ෦ΛऔΓग़ͯ͠ΈΔͱɺશͯ γϯϓϧʹͳ͍ͬͯ·͢ɻ
Slide 8
Slide 8 text
• ࠷࣌ؒͰཧղͰ͖Δͷ • Ͳͷ෦ΛऔΓग़ͯ͠γϯϓϧͰ͋Δ
Slide 9
Slide 9 text
React ~v16.17
Slide 10
Slide 10 text
Reactίϯϙʔωϯτ UIͷύʔπΛίϯϙʔωϯτ͝ ͱʹͯ͠ཧ
Slide 11
Slide 11 text
Reactίϯϙʔωϯτ UIͷύʔπΛίϯϙʔωϯτ͝ ͱʹͯ͠ཧ
Slide 12
Slide 12 text
Reactίϯϙʔωϯτ UIͷύʔπΛίϯϙʔωϯτ͝ ͱʹͯ͠ཧ Functional Component
Slide 13
Slide 13 text
No content
Slide 14
Slide 14 text
No content
Slide 15
Slide 15 text
ը໘͕ભҠ͢Δલʹ Ϙλϯͷԡ͞ΕͨճΛ console.logͰग़ྗ͍ͨ͠
Slide 16
Slide 16 text
No content
Slide 17
Slide 17 text
ΧϯλͷॳظԽ
Slide 18
Slide 18 text
ΫϦοΫ࣌ʹ ΧϯλͷΛ૿͢
Slide 19
Slide 19 text
ΧϯτͷճΛ logʹग़ྗ
Slide 20
Slide 20 text
No content
Slide 21
Slide 21 text
ಉ͡Α͏ͳ͕ؔ ͨ͘͞Μ͋Δɻ App͔ΒݟΔͱ
Slide 22
Slide 22 text
redʹؔ͢Δॲཧ͕ ࢄΒ͍ͬͯΔ App͔ΒݟΔͱ
Slide 23
Slide 23 text
֤Χϯλͷ͕ άϩʔόϧ App͔ΒݟΔͱ
Slide 24
Slide 24 text
Appίϯϙʔωϯτ γϯϓϧ͔ʁ
Slide 25
Slide 25 text
ͳͥγϯϓϧʹͳΒͳ͍ͷ͔ ɾstateॳظԽҐஔ ɾstateͷείʔϓ ɾؔఆٛ ɾϥΠϑαΠΫϧϝιου
Slide 26
Slide 26 text
React V16.8
Slide 27
Slide 27 text
• React Hooksͷొ • Ͳ͜ͰstateΛอ࣋͢Δ͜ͱ͕Մೳ useState • Ͳ͜Ͱؔఆ͕ٛՄೳ useCallback • Ͳ͜ͰϥΠϑαΠΫϧϝιου useEffect • ͨͩ͠Functional Componentݶఆ
Slide 28
Slide 28 text
No content
Slide 29
Slide 29 text
No content
Slide 30
Slide 30 text
No content
Slide 31
Slide 31 text
No content
Slide 32
Slide 32 text
ಛʹॏཁͳͷ͕ʮγϯϓϧͰ͋Δʯͱ͍͏͜ͱͰ͢ɻ ΞϓϦέʔγϣϯγεςϜ͕શମͱͯ͠ͲΕ΄Ͳෳ ࡶͰ͋ͬͯɺݸʑͷ෦ΛऔΓग़ͯ͠ΈΔͱɺશͯ γϯϓϧʹͳ͍ͬͯ·͢ɻ
Slide 33
Slide 33 text
No content
Slide 34
Slide 34 text
શ෦γϯϓϧ
Slide 35
Slide 35 text
ྑ͍ίʔυߟ͑Δͷ໘Ͱʁ
Slide 36
Slide 36 text
No content
Slide 37
Slide 37 text
1.5 ͰΔΜͩΑ ͜ͷඪ(ྑ͍ίʔυΛॻ͘)Λड͚ೖΕ ͨΒ܅ɺ͖ͬͱ༏लͳϓϩάϥϚʹͳ ΕΔͣͩ
Slide 38
Slide 38 text
Thank youʂ