デザインシステムを導入してUIに秩序を取り戻す - React (Native)編 #rejectron2018

Transcript

1. ©2018 Wantedly, Inc. σβΠϯγεςϜΛಋೖͯ͠ UIʹடংΛऔΓ໭͢ Rejectcon 2018ʢbuilderscon tokyo 2018 ൪֎ฤʣ 29.Sep.2018 - Kento Moriwaki React (Native)ฤ
2. ©2018 Wantedly, Inc. w ,FOUP.PSJXBLJ
   w UXJUUFS
   !LFOUP@USBOT@MV
   w 8BOUFEMZͷΤϯδχΞ
   w ओʹϑϩϯτΤϯυΛϦʔυ͍ͯ͠·͢ ࣗݾ঺հ
3. ©2018 Wantedly, Inc. 8BOUFEMZ
   7JTJU͸
   ࡀͰ͢ ಥવͰ͕͢ɺ
4. ©2018 Wantedly, Inc. iOS 6 6೥લͱͷൺֱ http://kakinokoshi.hatenablog.jp/entry/2016/07/24/121647 iOS 12
5. ©2018 Wantedly, Inc. ΤϯδχΞ
   ਓ
   σβΠφʔ
   ਓ ೖΕସΘΓ΍ΠϯλʔϯͳͲΛؚΊΔͱ
   ΋ͬͱͨ͘͞Μ͍·͢ ͦͷؒʹɺ
6. ©2018 Wantedly, Inc. ૿͑ଓ͚Δը໘΍ϓϩμΫτɺࢭ·Βͳ͍6*ͷਐԽ ΍τϨϯυͷҠΓมΘΓɺσβΠφʔͷೖΕସΘΓɺ ͳͲͳͲ ܦ೥มԽͰࣦΘΕΔUIͷ౷Ұײ શը໘ͷ6*ͷ౷ҰײΛอͭͷ͸ෆՄೳ
   
7. ©2018 Wantedly, Inc. σβΠφʔෆ଍ʹΑΓɺσβΠϯνΣοΫΛ௨Βͣʹ ϓϩμΫγϣϯʹ౤ೖ͞ΕΔػೳͨͪ ͞Βʹࠅ͍࣌͸ɺ ͋ͷࠒ͸ຊ౰ʹ͝ΊΜͳ͍͞
   
8. ©2018 Wantedly, Inc. ܦ೥มԽͰࣦΘΕͨ
   6*ͷடংΛऔΓ໭ͦ͏ʂ
9. ©2018 Wantedly, Inc. σβΠϯγεςϜΛ
   ಋೖ͠Α͏ʂ ͱ͍͏͜ͱͰɺ
10. ©2018 Wantedly, Inc. What is a Design System? 10
11. ©2018 Wantedly, Inc. w ͨͩͷίϯϙʔωϯτूͱ͸ҧ͏
    w ݪଇ΍ن໿ͱ͍ͬͨσβΠϯʹର͢Δߟ͑ํ͕ϕʔεʹ͋Δ
    w ࣮૷ΛؚΉඞཁ͸ͳ͍͕ɺ࣮૷͕͋ΔͱकΒΕ΍͍͢ What is a Design System
12. ©2018 Wantedly, Inc. w "EFMFʹ͸ݸҎ্ͷσβΠϯγεςϜ͕ެ։͞Ε͍ͯΔ
    w ΋ͪΖΜ͜͜ʹ͸ࡌ͍ͬͯͳ͍΋ͷ΍ɺެ։͞Ε͍ͯͳ͍΋ͷɺܗʹ·ͱ·ͬ ͍ͯ΋ͷ΋ؚΊΕ͹ɺձࣾ΍ϓϩμΫτͷ਺͚ͩ͋Δͱߟ͑ΒΕΔ Examples of Design System
13. ©2018 Wantedly, Inc.  6*ΫΦϦςΟͷϕʔεϥΠϯ
    ʹ
    ϒϥϯυදݱɾݟͨ໨ͱৼΔ ෣͍ͷҰ؏ੑΛ֬อ
     ϑϩϯτΤϯυߏஙϝϯςφϯεͷޮ཰Խ
     σβΠϯΞ΢τϓοτͷޮ཰Խ
     ૒ํͷίϛϡχέʔγϣϯίετͷ࡟ݮ σβΠϯγεςϜ͕ղܾ͢Δ໰୊
14. ©2018 Wantedly, Inc.  6*ΫΦϦςΟͷϕʔεϥΠϯ
    ʹ
    ϒϥϯυදݱɾݟͨ໨ͱৼΔ ෣͍ͷҰ؏ੑΛ֬อ σβΠϯγεςϜ͕ղܾ͢Δ໰୊ ϖʔδ΍ػೳؒͷݟͨ໨͚ͩ͡Όͳͯ͘ɺ
    w ϓϩμΫτؒͰڞ௨͢Δ8BOUFEMZΒ͠͞
    w ΞΫγϣϯͨ࣌͠ͷৼΔ෣͍ͳͲ΋ؚΉ
15. ©2018 Wantedly, Inc.  ϑϩϯτΤϯυߏஙϝϯςφϯεͷޮ཰Խ σβΠϯγεςϜ͕ղܾ͢Δ໰୊ طଘͷίϯϙʔωϯτΛ࢖͍ճͤΔ͜ͱͰɺੜ࢈ੑ্͕͕Δ
    ॳΊ͔Β࠶ར༻Λҙࣝͯ͠ίϯϙʔωϯτΛ࡞͍ͬͯͳ͍ͱɺগ ͠֎ΕΔͱ͙͢ʹ৽͍͠ίϯϙʔωϯτΛ࡞ͬͯ͠·͍͕ͪ
16. ©2018 Wantedly, Inc.  σβΠϯΞ΢τϓοτͷޮ཰Խ σβΠϯγεςϜ͕ղܾ͢Δ໰୊ 4LFUDIͳͲʹΑΔσβΠϯ΋ɺίϯϙʔωϯτԽ͞ΕΔ͜ͱͰɺ σβΠφʔͷੜ࢈ੑ΋্͕Δ
    ৗʹɺ࠷৽ͷϘλϯ͕ɺ෼͔Δͱ͜Ζʹଘࡏ͢Δ
17. ©2018 Wantedly, Inc.  ૒ํͷίϛϡχέʔγϣϯίετͷ࡟ݮ σβΠϯγεςϜ͕ղܾ͢Δ໰୊ ͋ͷϘλϯΛɺ͋ͷ৭Ͱɺ͋ͷTIBEPXͰɺͱ͍͑͹఻ΘΔΑ͏ ͳڞ௨ೝ͕ࣝ࡞ΕΔ
    ίʔυϨϏϡʔͷίετ΋ݮΔ
18. ©2018 Wantedly, Inc. ૣ଎࡞ͬͯΈΑ͏ʂ
19. ©2018 Wantedly, Inc.  ίϯηϓτΛܾΊΔ
     σβΠϯΛ࡞Δ
     ࣮૷͢Δ
     ಋೖ͢Δ
     ӡ༻͢Δ σβΠϯγεςϜͷಋೖεςοϓ
20. ©2018 Wantedly, Inc. ΠέͯΔσβΠϯγεςϜʹڞ௨͢Δ͜ͱ
     ڽ໊ͬͨલ
    w /BDIPT 5SFMMP
    3JOH
    6* +FU#SBJOT
    1MBTNB 8F8PSL
     1SJODJQMFTϖʔδ 1. ίϯηϓτΛܾΊΔ
21. ©2018 Wantedly, Inc. ඞཁͳίϯϙʔωϯτΛચ͍ग़ͯ͠ɺݪଇʹैͬͯσβΠϯΛ࡞ Δ
    w ৭΍ϑΥϯτͳͲͷϓϦϛςΟϒͳ΋ͷ͔ΒɺϘλϯ΍Ϧετɺ ΧʔυͳͲɺ༷ʑͳϨϕϧͷ΋ͷ͕͋Δ 2. σβΠϯΛ࡞Δ
22. ©2018 Wantedly, Inc. 8BOUFEMZͷ
    σβΠϯγεςϜͷ໊લ͸ɺ
23. ©2018 Wantedly, Inc. ·ܾͩ·ͬͯ·ͤΜ
    ίϯηϓτ΍σβΠϯ΋ؚΊͯɺࠓޙެ։͢Δ༧ఆͰ͢ʂ
24. ©2018 Wantedly, Inc. ࠓ೔͸ٕज़ͷ࿩Λ͠·͢ 8BOUFEMZͷσβΠϯγεςϜΛࢧ͑Δٕज़
25. ©2018 Wantedly, Inc. Ͳ͏͍͏ٕज़Λ࢖͏΂͖͔͸ʢ౰ͨΓલ͚ͩͲʣ
    w ͲͷϓϥοτϑΥʔϜʹରԠ͍͔ͨ͠
    w ͲͷΑ͏ͳΤϯδχΞମ੍͔
    ʹΑܾͬͯ·Δ Step 3. ࣮૷͢Δ
26. ©2018 Wantedly, Inc. Lona https://github.com/airbnb/Lona 26 શͯͷϓϥοτϑΥʔϜʹͰ͖Δ͚ͩ؆୯ʹରԠ͍ͨ͠ʁ
27. ©2018 Wantedly, Inc. w DPNQPOFOUϑΝΠϧͱ͍͏ɺΫϩεϓϥοτϑΥʔϜͳίϯ ϙʔωϯτͷఆٛ
    w ͦͷDPNQPOFOUϑΝΠϧΛ࡞੒͢Δ4LFUDIͷΑ͏ͳ(6*πʔ ϧ
    w DPNQPOFOUϑΝΠϧ͔Βɺ֤ϓϥοτϑΥʔϜͷ6*ίʔυΛ ੜ੒͢Δ Lona by Airbnb
28. ©2018 Wantedly, Inc. w ཁ͢Δʹɺ-POBͷ(6*ͰίϯϙʔωϯτΛ࡞Ε͹ɺ༷ʑͳϓ ϥοτϑΥʔϜͰωΠςΟϒʹಈ͘ίϯϙʔωϯτΛࣗಈੜ੒ Ͱ͖Δເͷٕज़
    w 4XJGU
    GPS
    J04
    
    NBD04
    w ,PUMJO
    GPS
    "OESPJE
    w +BWB4DSJQU
    GPS
    3FBDU Lona by Airbnb
29. ©2018 Wantedly, Inc. > his project is still in a very early stage. We don't provide any support of any kind. You shouldn't use this for production unless you really know what you're doing. Lona by Airbnb ·ͩૣ͔ͬͨ ࠓޙʹͱͯ΋ظ଴ʂ
30. ©2018 Wantedly, Inc. Theo https://github.com/salesforce-ux/theo 30 ֤ϓϥοτϑΥʔϜΛ͔͚ΔΤϯδχΞ͸े෼͍Δ͔Β ڞ௨Խ͢΂͖ม਺͚ͩ؅ཧ͍ͨ͠ʁ
31. ©2018 Wantedly, Inc. w ֤ϓϥοτϑΥʔϜ͸ωΠςΟϒͰͪΌΜͱॻ͖͍ͨਓ޲͚
    w ৭΍αΠζͳͲΛZBNMܗࣜͰॻ͘ͱɺ֤ϓϥοτϑΥʔϜͰ ࢖͍΍͍͢ܗʹม׵ͯ͘͠ΕΔ
    w 8FCͳΒ$44΍ɺ"OESPJEͳΒYNMɺJ04ͳΒ+40/ Theo by Salesforce
32. ©2018 Wantedly, Inc. CSS 32 खͬऔΓૣ͘Web͚ͩରԠ͍ͨ͠ʁ
33. ©2018 Wantedly, Inc. w 8FC͚ͩͰे෼ͳΒɺ$44Λ࢖ͬͯ։ൃ͢Δ 4BTTͳͲΛؚ Ή
    w $44ΛJNQPSUͯ͠ద੾ͳDMBTT໊Λ͚ͭΕ͹ɺελΠϧ͕౰ͯΒΕΔ
    w 3FBDU΍7VFͳͲͷ༷ʑͳ6*ϥΠϒϥϦʹରԠͨ͠΋ͷΛ࡞ Ε͹ɺ͞Βʹศར
    w ៉ྷͳ$44Λॻٕ͘ज़͸ࣦΘΕͭͭ͋Δʁ CSS
34. ©2018 Wantedly, Inc. 34 UI։ൃ͸ReactͰ౷Ұ͍ͨ͠ʁ
35. ©2018 Wantedly, Inc. w 3FBDU
    /BUJWF͕ಈ͘؀ڥʹରԠͰ͖Δ
    w J04
    "OESPJE
    8FC
    8JOEPXT
    73
    ͳͲ͔ͳΓଟ͍
    w $44͸࢖͑ͳ͍ͷͰɺଞͷ8FCͱͷڞଘ͸೉͍͠
    w 3FBDUʹৼΓ੾͍ͬͯΔνʔϜͳΒ༗ޮ React Native
36. ©2018 Wantedly, Inc. w 3FBDU
    /BUJWF
    GPS
    8FC
    w 3FBDU
    /BUJWFͷίʔυΛ8FCͰಈ͔ͨ͢ΊͷϥΠϒϥϦ
    w ASFBDUOBUJWFAͱಉ͡ΠϯλʔϑΣʔεΛ΋ͭϥΠϒϥϦͰɺ 8FCޓ׵ͷॲཧʹม͑ͯ͘ΕΔ
    w ׬શʹಉ͡Ͱ͸ͳ͍͕ɺ׳ΕΕ͹ڐ༰Ͱ͖Δൣғ React NativeΛWebͰಈ͔ٕ͢ज़
37. ©2018 Wantedly, Inc. ๻Β͕બΜͩͷ͸ɺ
38. ©2018 Wantedly, Inc. w 3FBDU
    /BUJWFͰ࣮૷͠Α͏ʂ
    w 3FBDUͷՕॴ͕૿͑ɺ3FBDU͔͚Δਓ΋ͲΜͲΜ૿͍͑ͯΔ
    w ࠓޙͷ8FC։ൃ͸3FBDUͰ౷Ұ͞Ε͍ͯ͘งғؾ
    w ࣾ಺Ͱ΋3FBDU
    /BUJWFͷಋೖࣄྫ΋Ͱ͖ɺظ଴஋্͕͕ͬͯ ͍Δ
    w ΞϓϦͰͷϓϩτλΠϐϯά΋͸΍͘ͳΔ Wantedlyͷબ୒
39. ©2018 Wantedly, Inc. w 3FBDU
    /BUJWFͰॻ͍ͨίʔυΛ8FCͰಈ͔͢
    
    ؆୯
    w 3FBDU
    
    $44Ͱॻ͍ͨίʔυΛωΠςΟϒͰಈ͔͢
    
    େม
    w $44ͷදݱྗ͕ߴ͍ͨΊɺ/BUJWFʹରԠ͢ΔͨΊʹ௿Ϩϕϧ΁ͷॻ͖׵͕͑ େม
    IPWFSͱ͔
    MBTUDIJMEͱ͔
    w ͙͢ʹωΠςΟϒͰ࢖Θͳͯ͘΋ɺ3FBDU
    /BUJWFͷॻ͖ํʹ ରԠ͓͍ͯͨ͠΄͏͕҆৺ Wantedlyͷબ୒
40. ©2018 Wantedly, Inc. 3FBDU
    /BUJWF
    GPS
    8FC Ͱͷ
    ࣮૷Λ࢝ΊΑ͏
41. ©2018 Wantedly, Inc. w ཁ݅ͷ੔ཧ
     8FCͱ/BUJWFͰಉ͡Α͏ʹ࢖͑Δ
     5ZQF4DSJQUͰܕνΣοΫ͍ͨ͠
     ࢖͏ଆͰ໘౗ͳઃఆ͸ͨ͘͠ͳ͍ React Native (for Web) Ͱͷ࣮૷Λ࢝ΊΑ͏ʂ
42. ©2018 Wantedly, Inc. εςοϓͰ࢖͑Δ 8FCͰ΋/BUJWFͰ΋ ׬੒Πϝʔδ Step. 1 Step. 2
43. ©2018 Wantedly, Inc. શ͘ಉ͡Α͏ʹಈ͘Θ͚Ͱ͸ͳ͍ͷͰɺϓϥοτϑΥʔϜؒͷҧ ͍Λٵऩ͢Δඞཁ͕͋Δ
    w ෼ذ͕૿͑Δͱɺϝϯςφϯεੑ͕Լ͕Δ
    w Ͱ͖Δ͚ͩڞ௨Խͯ͠ɺ෼ذ͸࠷௿ݶʹ཈͑ɺॻ͚Δ৔ॴ΋ݶ ఆ͢Δ ΫϩεϓϥοτϑΥʔϜରԠͷํ਑
44. ©2018 Wantedly, Inc. ؆୯ʹϓϥοτϑΥʔϜ͝ͱͷڍಈΛม͑ΒΕΔ
    w ϓϥοτϑΥʔϜݻ༗ͷελΠϧͷϓϩύςΟͩͬͨΓ ඍົͳࠩҟ͸ɺPlatformϞδϡʔϧͰ෼ذ
45. ©2018 Wantedly, Inc. ϓϥοτϑΥʔϜ໊Λ֦ுࢠલʹ͚ͭͯɺϏϧυ࣌ʹద੾ʹղܾ
    w JOEFYXFCKT
    JOEFYOBUJWFKT
    JOEFYJPTKT
    ͳͲ
    w ॻ͍ͯྑ͍ͷ͸ɺNPEVMFTҎԼʹݶఆ େ͖͘ҧ͏΋ͷ͸ɺϑΝΠϧ͝ͱʹ෼͚Δ
46. ©2018 Wantedly, Inc. .JDSPTPGUSFBDUYQ ΫϩεϓϥοτϑΥʔϜͷ࠷ऴܗଶ https://microsoft.github.io/reactxp/
47. ©2018 Wantedly, Inc. w .JDSPTPGU͕ɺ4LZQFΛ3FBDUͰΫϥεϓϥοτϑΥʔϜʹ ։ൃͨ࣌͠ʹੜ·Εͨ
    w 8FC
    J04
    "OESPJE
    BOE
    8JOEPXT
    w ϥΠϒϥϦ޲͖Ͱ͸ͳ͍
    w 91
    NFBOT
    DSPTTQMBUGPSN
    OPU
    B
    8JOEPXT
    WFSTJPO
    w ࠔͬͨΒ͜͜ΛݟΕ͹ɺԿ͔͠Βͷղܾࡦ͕ݟ͔ͭΔ ΫϩεϓϥοτϑΥʔϜͷ࠷ऴܗଶ: ReactXP
48. ©2018 Wantedly, Inc. Ϙλϯͷ࣮૷Λ࢝ΊΑ͏
49. ©2018 Wantedly, Inc.  (SBEBUJPO
     "OJNBUJPO
     "DDFTTJCJMJUZ
     5IFNF ϘλϯҰͭͰߟ͑Δ͜ͱଟ͗͢Δ ձࣾશମͰ࢖ΘΕΔ൚༻ϥΠϒϥϦ͔ͩΒͦ͜
    ͔ͬ͠Γߟ͑ͯஸೡʹ࣮૷͢Δඞཁ͕͋Δ
50. ©2018 Wantedly, Inc. άϥσʔγϣϯͷ࣮ݱํ๏͕ҧ͏ Gradation 8FCͰ͸ɺ$44ͷMJOFBSHSBEJFOU͕࢖͑Δ
51. ©2018 Wantedly, Inc. Gradation /BUJWFͰ͸ɺωΠςΟϒ࣮૷ΛؚΉ֎෦ϥΠϒϥϦ͕ඞཁ
52. ©2018 Wantedly, Inc. ந৅Խͯ͠ڞ௨ͷΠϯλʔϑΣʔεΛ࡞Δ
    ❌
    $44ʹدͤΔ
    w ωΠςΟϒͷTUZMF࣮૷Λม͑Δͷ͸ݫ͍͠ɻMJOFBSHSBEJFOUͷจࣈྻΛղੳ ͢Δͷ΋ΊΜͲ͍͘͞
    ⭕
    /BUJWFʹدͤΔ
    w ಉ͡QSPQTΛड͚ͯɺMJOFBSHSBEJFOUͷจࣈྻΛੜ੒͢Ε͹ྑ͍ Gradation
53. ©2018 Wantedly, Inc. Gradation modules/linear-gradient/index.web.tsx
54. ©2018 Wantedly, Inc. ந৅ϨΠϠʔΛ͖ͪΜͱઃܭͯ͋͛͠Δ͜ͱͰɺϓϥοτϑΥʔ Ϝ͝ͱͷ࣮૷ΛӅṭ͢Δ Gradation
55. ©2018 Wantedly, Inc. ϗόʔ΍λοϓ࣌ʹɺTIBEPX΍৭Λ;Θͬͱม͍͑ͨ
    w ΄΅શͯͷίϯϙʔωϯτʹ5SBOTJUJPOΞχϝʔγϣϯ͕͍ͭ ͍ͯΔ
    w ීஈ͚ͭ๨Ε͕ͪͳͷͰɺσβΠϯγεςϜͰ͔ͬ͠Γ࣮૷͠ ͓ͯ͘͜ͱ͸େࣄ Animation
56. ©2018 Wantedly, Inc. Ξχϝʔγϣϯͷ࣮ݱํ๏͕ҧ͏ Animation 8FCͰ͸ɺ$44ͷUSBOTJUJPO͕࢖͑Δ
57. ©2018 Wantedly, Inc. Animation /BUJWFͰ͸ɺ"OJNBUFEϞδϡʔϧΛ࢖͏
58. ©2018 Wantedly, Inc. w "OJNBUFE͸SFBDUOBUJWFXFCʹ΋͋Δ
    w SFRVFTU"OJNBUJPO'SBNFΛ༻͍ͨ+4Ξχϝʔγϣϯ࣮૷
    w Ḯ৭ͳ͍͜ͱ΋ଟ͍͕ɺ$44ͷ5SBOTJUJPOͷํ͕CFUUFS CSS Transition vs Animated https://developer.mozilla.org/en-US/docs/Web/Apps/Fundamentals/Performance/CSS_JavaScript_animation_performance > Even given the test results above, we'd argue that CSS animations are the better choice. But how? The key is that as long as the properties we want to animate do not trigger reflow/repaint (read CSS triggers for more information), we can move those sampling operations out of the main thread.
59. ©2018 Wantedly, Inc. ந৅Խͯ͠ڞ௨ͷΠϯλʔϑΣʔεΛ࡞Γ͍͕ͨɺ(SBEBUJPO΄ Ͳ୯७Ͱ͸ͳ͍
    w 5JNJOH
    GVODUJPO΋ॻ͖ํ͕͍Ζ͍ΖͰ͖Δ
    w 8FCͰ͸5SBOTJUJPOΛ్தͰࢭΊͨΓͰ͖ͳ͍
    w *OUFSQPMBUJPOͳͲ΋͋Δ Animation ࣮૷͸͔ͳΓେม
    
60. ©2018 Wantedly, Inc. w 3FBDU91ʹ͸ɺͦΕΛ࣮૷ͨ͠39"OJNBUFE͕͋Δ
    w "OJNBUFEͷΑ͏ʹॻ͘ͱɺ$44Ͱ͸5SBOTJUJPOΛ࢖ͬͯ࠷ దԽͯ͘͠ΕΔ
    w ΋ͪΖΜ੍ݶ͸͋Δ
    w ϥΠϒϥϦͱͯ͠੾Γग़͞Ε͓ͯΒͣɺਅࣅ࣮ͯ͠૷͢Δʹ͸ େมͳྔ RX.Animated
61. ©2018 Wantedly, Inc. ύϑΥʔϚϯεΛٻΊΔͱɺ8FC͸$44Ͱॻ͘ͷ͕࠷ద͕ͩɺ
    w ΄ͱΜͲͷίϯϙʔωϯτʹ͸͋ΔͷͰɺͦΕΒΛશͯॻ͖׵͑Δඞཁ͕͋Δͷ ͸ݱ࣮తͰ͸ͳ͍
    w ந৅ϨΠϠʔΛ࡞Δͷ΋؆୯Ͱ͸ͳ͍ Animationͷํ਑ جຊ͸"OJNBUFEͰॻ͍ͯɺ
    Ͳ͏ͯ͠΋ؾʹͳΔ෦෼͸$44Ͱ࠷దԽ͢Δ
62. ©2018 Wantedly, Inc. w 5FYUͷ໰୊
    w 8FCͰ͸ςΩετΛදݱ͢Δλά͕ଟ͋͘Δ
    w શ෦ΛEJWʹ͢Δͷ͸ɺ4&0ͳͲͰݒ೦͕͋Δ Accessibility
63. ©2018 Wantedly, Inc. w BDDFTTJCJMJUZ3PMFͱBSJBMFWFMͷQSPQTΛ࢖͑͹ɺग़ྗͤ͞ ΔλάΛม͑Δ͜ͱ͕Ͱ͖Δ Accessibility
64. ©2018 Wantedly, Inc. w Ϙλϯͷ໰୊
    w $MJDLBCMFͳ7JFX
    
    #VUUPOͰ͸ͳ͍
    w 5"#ΩʔͰબ୒ঢ়ଶʹͳΒͳ͍ɺ&/5&3ԡͯ͠΋ΫϦοΫʹͳΒͳ͍ɺඍົ ʹ࢖͍ʹ͍͘Ϙλϯ͕ग़དྷ্͕Δ
    w 7JFX
    #VUUPO
    5PVDIBCMFͳͲΛ͖ͪΜͱ࢖͍෼͚Δ Accessibility
65. ©2018 Wantedly, Inc. Ϙλϯ͸࣮͸ɺҰछྨ͡Όͳ͍ Theming 7JTJU 1FPQMF /PSNBM *OWFSTF
66. ©2018 Wantedly, Inc. w UIFNF
    QSPQTͰରԠ Theming ͜ͷ.PEBMҎԼ͸UIFNFΛม͑Δͱ͔ɺΊͪΌͪ͘Όେม
67. ©2018 Wantedly, Inc. w UIFNF
    QSPQTͰରԠ Theming ͜ͷ.PEBMҎԼ͸UIFNFΛม͑Δͱ͔ɺΊͪΌͪ͘Όେม
68. ©2018 Wantedly, Inc. w SFBDUOBUJWFXFCͰUIFNFͱ͍͑͹ɺ5XJUUFS
    -JUF
    w IUUQTJUT[FSPCMPHJNQMFNFOUJOHOJHIUNPEFPO UXJUUFSMJUFIUNM
    w $POUFYUͰ෇͚ସ͑ΒΕΔΑ͏ʹ޻෉
    w ݁ՌΛΩϟογϡ͢Δͯ͠ɺύϑΥʔϚϯεվળ Theming
69. ©2018 Wantedly, Inc. ෼͔Γ΍͍͢υΩϡϝϯτΛ
    ࡞Ζ͏
70. ©2018 Wantedly, Inc. w ͲΜͳίϯϙʔωϯτ͕͋Δͷ͔෼͔Δ
    w Ͳ͏΍ͬͯ࢖͏͔͕෼͔Δ
    w ݟͨ໨͕៉ྷͰಡΈ΍͍͢ ෼͔Γ΍͍͢υΩϡϝϯτ
71. ©2018 Wantedly, Inc. EPD[ ෼͔Γ΍͍͢υΩϡϝϯτΛ࡞Ζ͏ https://www.docz.site/
72. ©2018 Wantedly, Inc. w ؆୯ͳηοτΞοϓ
    w σϑΥϧτͰ5ZQF4DSJQUʹରԠ
    w NEYͱ͍͏NBSLEPXOͱ+49Λ૊Έ߹Θͤͨܗࣜ
    w ී௨ʹυΩϡϝϯτΛॻ͘ײ֮Ͱɺ్தͰ3FBDUίϯϙʔωϯ τΛඳըͰ͖Δ
    w ଟػೳ͔ͭɺ଎͍ϖʔεͰਐԽ doczͷັྗ
73. ©2018 Wantedly, Inc. .mdx
74. ©2018 Wantedly, Inc. PropsTable 5ZQF4DSJQUͷܕ͔Β
    1SPQTͷઆ໌Λ
    ඒ͍͠ςʔϒϧͰදࣔ
75. ©2018 Wantedly, Inc. Playground ͜͜Λฤू͢Δͱଈ࠲ʹ൓ө͞ΕΔ
76. ©2018 Wantedly, Inc. w ಠࣗςʔϚΛ࣮૷ͨ͠
    w طଘͷςʔϚΛϕʔεʹɺσβΠϯγεςϜଆͷςʔϚͷ੾Γସ͑ͳͲΛ࣮૷
    w ͜ͷEPD[ͷςʔϚࣗମΛσβΠϯγεςϜͰ࣮૷͢Δ͜ͱ΋Ͱ͖Δ doczͷΧελϜςʔϚ
77. ©2018 Wantedly, Inc. w NEY͸+49ʹม׵͞ΕΔ͚ͩͳͷͰɺඳը͢Δίϯϙʔωϯ τΛม͑Ε͹3FBDU
    /BUJWFͰ΋ಈ͔ͤΔ͸ͣ
    w ࠓ౓΍ͬͯΈΑ͏ͱࢥ͍ͬͯͨΒɺ͖ͬ͞ௐ΂ͨΒରԠͨͬ͠ Ά͍ɻ·ͩಈ͔ͤͯͳ͍Ͱ͢ɻ doczͷReact NativeରԠ
78. ©2018 Wantedly, Inc. ࣮૷Ͱ͖ͨͷͰ
    ಋೖ͠Α͏ʂ
79. ©2018 Wantedly, Inc. w OQNʹQVCMJTIͯ͋͠ΔͷͰɺJOTUBMM͢Ε͹࢖͑Δ εϜʔζʹಋೖͰ͖Δ͔
80. ©2018 Wantedly, Inc. w QSJWBUF
    QBDLBHFʹͨ͠ͷͰɺOQNͷઃఆ͕ඞཁͩͬͨ
    w ΈΜͳͷΞΧ΢ϯτ؅ཧ΋ඞཁ
    w $*Ͱ΋ಈ͘Α͏ʹ͠ͳ͍ͱ
    w ಛʹݟΒΕͯࠔΔ΋ͷͰ΋ͳ͍ͷͰɺQVCMJDʹͨ͠ΒΑ͔ͬͨ εϜʔζʹಋೖͰ͖ͳ͍ɻɻ
81. ©2018 Wantedly, Inc. w XFC͸ɺEJTUJOEFYXFCKTΛग़ྗ͍͕ͯͨ͠
    w XFCQBDLͷઃఆ͕ඞཁ DSFBUFSFBDUBQQͰ͸ରԠࡁΈ
    w JOEFYKT͸XFCKTΛSFRVJSF͢ΔΑ͏ʹॻ͘΂͖
    w ωΠςΟϒ͸ɺJPTKT
    BOESPJEKTʹ͓͚ͯ͠͹ɺSFBDUOBUJWFΛී௨ʹηο τΞοϓ͍ͯ͠Ε͹໰୊ͳ͘࢖͑Δ
    w SFBDUOBUJWF
    
    SFBDUOBUJWFXFC΁ͷBMJBTઃఆ
    w ϥΠϒϥϦଆͰॻ͖׵͔͑ͯΒ഑෍͢Δ΂͖ εϜʔζʹಋೖͰ͖ͳ͍ɻɻ
82. ©2018 Wantedly, Inc. ӡ༻࣌ͷ஫ҙ఺
83. ©2018 Wantedly, Inc. w ·ͩͦͷஈ֊·Ͱདྷ͍ͯͳ͍͕ɺ
    w ΞοϓσʔτΛ҆શʹߦ͏࢓૊Έ͕ཉ͍͠
    w Ұ൪ා͍ͷ͸ɺ8FC͚ͩม͑ͨͭ΋Γ͕ɺωΠςΟϒ΋όάͬ ͯ͠·͏໰୊
    w εφοϓγϣοτςετɺεΫϦʔϯγϣοτςετɺFFς ετͳͲͷಋೖΛݕ౼͢΂͖ ӡ༻࣌ͷ஫ҙ఺
84. ©2018 Wantedly, Inc. ·ͱΊ
85. ©2018 Wantedly, Inc. w ରԠ͍ͨ͠ϓϥοτϑΥʔϜͱɺ૊৫ঢ়ଶʹΑͬͯΞʔΩςΫ νϟΛબͿ
    w ૊৫಺Ͱڞ௨Ͱ࢖ΘΕΔϥΠϒϥϦ͔ͩΒͦ͜ɺࡉ͔͍ͱ͜Ζ ·Ͱߟ࣮͑ͯ૷͠Α͏
    w ෼͔Γ΍͍͢υΩϡϝϯτΛಋೖ͠Α͏
    w ࢖͏ਓ͕٧·Βͳ͍Α͏ʹɺϏϧυͷΊΜͲ͘͞͞͸ϥΠϒϥ ϦଆͰٵऩ͠Α͏ σβΠϯγεςϜ࣮૷࣌ʹؾʹ͢΂͖͜ͱ·ͱΊ