Slide 1

Slide 1 text

© RightTouch Inc.ɹ|ɹConfidential Yuichi Yabu ػೳϦϓϨʔεͰਐԽ͢Δ ϑϩϯτΤϯυͷ࡮৽ͱαʔόʔϞσϧͷϦϑΝΫλϦϯά

Slide 2

Slide 2 text

© RightTouch Inc.ɹ|ɹConfidential RightTouch https://plaid.co.jp/news/20211216/

Slide 3

Slide 3 text

© RightTouch Inc.ɹ|ɹConfidential RightSupport

Slide 4

Slide 4 text

© RightTouch Inc.ɹ|ɹConfidential νʔϜ RightSupportνʔϜ RightConnectνʔϜ TalkνʔϜ PdM 1ਓ 1ਓ 1ਓ Engineer 6ਓ 3.5ਓ 2.5ਓ Designer 1ਓ 0.5ਓ 0.5ਓ

Slide 5

Slide 5 text

© RightTouch Inc.ɹ|ɹConfidential Support Widget • ͓٬͞ΜͷࠔΓ͝ͱʹରͯ͠ద੾ͳΞηοτΛಧ͚ࣗݾղܾͯ͠΋Β͏ͨΊͷ ػೳ • ҰਓͻͱΓͷ͓٬͞Μʹରͯ͠ΧελϚΠζ͞Εͨ΢ΟδΣοτΛಧ͚Δ ͜ͱ͕Ͱ͖Δ • Τϥʔ౳Λݕ஌͠ɺڧௐදࣔ͢Δ͜ͱ͕Ͱ͖Δ

Slide 6

Slide 6 text

© RightTouch Inc.ɹ|ɹConfidential ؆୯ͳΞʔΩςΫνϟ

Slide 7

Slide 7 text

© RightTouch Inc.ɹ|ɹConfidential Support WidgetͷݶքͱϦϓϨʔεͷܾஅ • ͞·͟·ͳࢪࡦΛଧ͍ͬͯ͘தͰɺ͜͏͍͏͜ͱ͍ͨ͠ͱ͍͏ཁ๬͕͓٬͞Μ΍ΧελϚʔαΫηεͷϝϯόʔ͔Βग़ ͖ͯͨ • ࠷ॳ͸ɺSupport WidgetΛ֦ுͯ͠࡞͍͕ͬͯͨɺ͍Ζ͍Ζͱ࿪Έ͕ग़͖ͯͨ • ׳Εͳ͍SvelteͰͷ࣮૷ʹΑͬͯɺΤϯυʹ഑Δ෦෼ͷϩδοΫ͕ෳࡶԽʢվम͕େมʹͳ͖ͬͯͨʣ • αʔόʔϞσϧʢܕʣͷݟ௨͕͠ѱ͘ͳ͖ͬͯͨ • ઃఆUIͷUXͷ௿Լ • ͜ΕͲ͏͠Α͏͔ͱ͍͏ٞ࿦ʹͳΓɺཧ૝͔Βߟ͑ͯߦͬͯɺࢥ͍੾ͬͯ·Δͬͱ࡞Γ௚ͦ͏

Slide 8

Slide 8 text

© RightTouch Inc.ɹ|ɹConfidential Svelteͷ࿩ • ΤϯυϢʔβʔʹ഑Δ΋ͷͩͬͨͷͰɺϑΝΠϧαΠζͷখ͞͞Λॏཁࢹ • ਏ͔ͬͨͱ͜ (޷Έ΍׳Εͷ໰୊͸͋Δͱ͍͏લఏͷ্Ͱ) • ؅ཧը໘͸ReactͰॻ͍͍ͯͯɺSvelteͷ஌ݟ͕νʔϜ಺ʹͳ͔ͬͨͷͰɺ࣮૷͕ඍົʹͳ͍ͬͯͨ • Plaidάϧʔϓ಺Ͱ͸SvelteΛ࢖ͬͯΔνʔϜ΋͋ͬͨͷͰɺ΋͏গ͠࿈ܞ͍ͯͨ͠Βҧ͍͔ͬͯͨ΋ʁ • Svelteͷ࠶ඳըͷ࢓૊Έ͕ͳΜ͔׳Εͳ͔ͬͨ • $: ͷ΍ͭ • ෳࡶͳঢ়ଶભҠ͕͋Δͱ͖ʹɺద੾ʹ࠶ඳը͠੾Εͣҙਤ͠ͳ͍όάͰۤ࿑ͨ͠

Slide 9

Slide 9 text

© RightTouch Inc.ɹ|ɹConfidential αʔόʔϞσϧͷ࿩ • ϙοϓΞοϓ΢ΟδΣοτ͚ͩΛ૝ఆͨ͠ઃܭ • ͩΜͩΜ૿େ͍ͯ͘͠ϓϩύςΟͷ਺ͱߏ଄Խɺ֊૚Խ͞ΕͣฒྻʹͳΒΜͰ͍͘ڪා

Slide 10

Slide 10 text

© RightTouch Inc.ɹ|ɹConfidential Support Widgetܕ

Slide 11

Slide 11 text

© RightTouch Inc.ɹ|ɹConfidential ΍͹͍ϙΠϯτ1

Slide 12

Slide 12 text

© RightTouch Inc.ɹ|ɹConfidential ΍͹͍ϙΠϯτ2

Slide 13

Slide 13 text

© RightTouch Inc.ɹ|ɹConfidential Support Action • ΑΓ൚༻తͳWebαϙʔτΛ࣮ݱ͢ΔͨΊͷػೳ • ΢ΟδΣοτͳͲΛίϯϙʔωϯτͱͯ͠ఆٛ͠ɺίϯϙʔωϯτΛ૊Έ߹ΘͤͯࢪࡦΛ࡞ΕΔ࢓૊Έ

Slide 14

Slide 14 text

© RightTouch Inc.ɹ|ɹConfidential Svelte͔ΒPreact΁ • Svelte΄Ͳ͡Όͳ͍͕Preact΋े෼খ͍͞ • ίϯϙʔωϯτͷ਺͕૿͍͑ͯ͘ͱɺ্هͷࠩ෼͕ॖ·͍ͬͯ͘ͱ͍͏࿩΋͋ΔͬΆ͍ʁ • ؅ཧը໘্ͰɺϓϨϏϡʔΛ࡞Δͱ͖ɺPreactͩͱίϯϙʔωϯτΛ͋Δఔ౓ͦͷ··࣋ͬͯ͜ΕΔʁ • SVGͷϓϩύςΟ໊ͷ໋໊نଇ͕ҧ͏ • preact/compatͰࠩ෼Λٵऩ • inputϑΥʔϜʹର͢Δมߋݕ஌ͷλΠϛϯάͷҧ͍ • ReactͷonChange͸มߋ࣌ɺPreact͸มߋͷίϛοτ࣌ => onInputΛ࢖͏Α͏lintͰڲਖ਼

Slide 15

Slide 15 text

© RightTouch Inc.ɹ|ɹConfidential αʔόʔϞσϧͷϦϑΝΫλϦϯά • ίΞͱͳΔActionܕ͸Ұఆγϯϓϧʹͭͭ͠ɺ໾ׂ͝ͱʹComponentͱ͍͏ܗͰந৅Խ • ৽͍͠ػೳΛ௥Ճͨ͘͠ͳͬͨΒɺComponentΛ૿΍͍͚ͯ͠͹͍͍ • ܕύζϧ͕Ή͍ͣ • mosha͞ΜͷType ChallengeͰνʔϜͷܕೳྗͷڧԽ • https://mosya.dev/type-challenges

Slide 16

Slide 16 text

© RightTouch Inc.ɹ|ɹConfidential SupportActionܕ

Slide 17

Slide 17 text

© RightTouch Inc.ɹ|ɹConfidential Support ActionϦϦʔε • Նࠒ͔Β࣮૷Λ࢝Ίɺࡢ೔ϦϦʔε • େن໛ͳϦϓϨʔεɺϦϑΝΫλϦϯάׂͩͬͨʹ͸ɺૣΊʹϦϦʔε·Ͱߦ͚ͨؾ͕͢Δ • αϯυϘοΫεͰͷ࣮ݧΛׂΓͱͪΌΜͱ΍ͬͨ • γϯϓϧ͞ͱߏ଄Խ͸Ͱ͖Δ͚ͩଥڠ͠ͳ͍ • ෛ࠴ʹର͢ΔϞϠϞϠײ͔ΒϦϓϨʔε΁ͷϞνϕ͕ߴ͔ͬͨ • ීஈ͔ΒϦϑΝΫλϦϯάձΛ΍ͬͯͯɺطଘͷίʔυ͕͜Εແཧͩͳ͍ͬͯ͏ײ͕֮͋ͬͨ • େن໛ͳϦϓϨʔεʢϦιʔεͷ౤ೖʣʹࣾ಺ͷཧղ͕ಘΒΕͨ

Slide 18

Slide 18 text

© RightTouch Inc.ɹ|ɹConfidential ·ͱΊ • αʔϏε࣮૷ॳظʹ࡞ͬͨػೳ͕࢓༷తʹ΋࣮૷తʹ΋ෛ࠴Λ๊͍͑ͯͨ • ௕ظతͳ֦ுੑ΍อकੑΛߟ͑ɺ·ΔͬͱϦϓϨʔεɺϦϑΝΫλϦϯάΛͨ͠ • ݁Ռɺ͋Δఔ౓௕ظతͳར༻ʹ଱͑͏ΔػೳΛ࡞Δ͜ͱ͕Ͱ͖ͨʢͱࢥ͏ʣ • ࣮૷తʹ΋ෛ࠴͕ཷ·͍ͬͯͨ෦෼Λ͔ͳΓղফͰ͖ͨ • ؾ࣋ͪΑ͘೥Λӽ͠ɺ৽͍͓͠٬͞ΜΛͲΜͲΜड͚ΒΕΔ