最高のマスターデータ管理手法考察 & VSCode Extension を活用した話 / developing masterdata management tool by using vscode extension

GeekGig 『スタディサプリ x Showcase Gig』 〜フロントエンドを楽しむ〜

Links:
p.6 [Deep Environment Parity CDNT 2019 - Speaker Deck](https://speakerdeck.com/spring_mt/deep-environment-parity-cdnt-2019)
p.13 [GraphQL を利用したアーキテクチャの勘所 / Architecture practices with GraphQL - Speaker Deck](https://speakerdeck.com/qsona/architecture-practices-with-graphql)
p.13 [GraphQL と Prisma から考える次のN年を見据えた技術選定 - 森 久太郎 / qsona | JSConf JP](https://jsconf.jp/2021/talk/technology-selection-for-the-next-n-years-based-on-graphql-and-prisma)
p.30 [YAML - Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml)
p.48 スタディサプリ直通 https://www.saiyo-dr.jp/recruit/Entry/top.jsp?id=357 リクルート https://recruit-saiyo.jp/technology/

Transcript

1. ࠷ߴͷϚελʔσʔλ؅ཧख๏ߟ࡯ &
   VSCode Extension Λ׆༻ͨ͠࿩
   @qsona
   2021-11-18
   GeekGig ʰελσΟαϓϦ x Showcase Gigʱ ʙϑϩϯτΤϯυΛָ͠Ήʙ
   

   View Slide

2. whoami
   • @qsona
   • Web Engineer at ελσΟαϓϦ (ϦΫϧʔτ)
   • Microservices / Rails / Node.js / GraphQL
   

   View Slide

3. 1. Ϛελʔσʔλ؅ཧʹ·ͭΘΔ
   Ұൠతͳ՝୊ͱϓϥΫςΟε
   

   View Slide

4. Ϛελʔσʔλͱ͸?
   • αʔϏεͷΤϯυϢʔβʔͰ͸ͳ͘ɺ

   αʔϏεΛӡӦ͢Δଆ͕༻ҙ͢Δσʔλ
   

   View Slide

5. Ϛελʔσʔλͷ؅ཧ
   • ӡӦऀͱͯ͠ɺσʔλͷೖྗɾอଘͳͲ͕Ͱ͖Δඞཁ͕͋Δ
   • Ͳ͏࣮ݱ͢Δ?
   • Web ΞϓϦͭ͘Δ?
   • SPA Ͱɺ࠷ߴͷ UX ͷ؅ཧը໘Λ࡞Δ?
   

   View Slide

6. Ϛελʔσʔλ؅ཧͷ՝୊
   • جຊతʹɺશͯͷ؀ڥͰσʔλΛҰக͍ͤͨ͞
   • ࢀߟ: Deep Environment Parity by @Spring_MT ͞Μ

   p.52 https://speakerdeck.com/spring_mt/deep-environment-parity-cdnt-2019?slide=52
   • ຊ൪ʹ͍͖ͳΓσʔλ౤ೖ͢Δͷ͸ϦεΫ͕ߴ͍
   • ։ൃ؀ڥͰσʔλΛ౤ೖ͠ɺ֬ೝͨ͠ޙɺͦͷ··ຊ൪
   ؀ڥͰར༻͍ͨ͠
   • Web ؅ཧը໘ͷ৔߹ɺstaging Ͱೖྗ࡞ۀ => ಉ͜͡ͱΛ
   ຊ൪Ͱ΋࡞ۀ ͱͳΓɺ࡞ۀϛεʹͭͳ͕Γ΍͍͢
   

   View Slide

7. ϓϥΫςΟεͷྫ (1)

   ϩʔΧϧͰϑΝΠϧ؅ཧ͢Δ
   • Web Ͱ͸ͳ͘ɺϩʔΧϧͰϑΝΠϧ؅ཧ
   • Git ͳͲͰόʔδϣϯ؅ཧ͢Δ
   • ϝϦοτ
   • ͋Δ࣌఺ͷঢ়ଶͰσʔλΛݻΊɺͦΕΛ֤؀ڥʹద༻Ͱ͖Δ
   • Ҏલͷ͋Δ࣌఺ͷঢ়ଶ·Ͱר͖໭͢͜ͱ΋ՄೳʹͳΔ
   • (Web Ͱ͸ͳ͘) σεΫτοϓΞϓϦͱͯ͠؅ཧπʔϧΛ࡞Δ
   • Electron Λ࢖͑͹ Web ͷٕज़Λར༻Ͱ͖Δ!
   

   View Slide

8. ϓϥΫςΟεͷྫ (2) Google Spreadsheets
   • Google Spreadsheets Ͱσʔλ؅ཧ͠ɺ͔ͦ͜ΒऔΓࠐΉ࢓૊ΈΛ࡞Δ
   • ϝϦοτ
   • දܭࢉιϑτ͸ͳΜ͔ͩΜͩͰศར...
   • ࣗྗͰ؅ཧπʔϧΛ࡞ΔΑΓɺ௿ίετͰͰ͖Δ
   • γʔτͷ࡞Γํ (γʔτ͝ͱͷΧϥϜͷܾΊํͳͲ) ʹίπ͕ඞཁ
   • ςʔϒϧઃܭͦͷ··ͩͱೖྗ͕ͮ͠Β͍
   

   View Slide

9. 2. ελσΟαϓϦʹ͓͚Δ
   Ϛελʔσʔλ؅ཧͷ࣮ફ
   

   View Slide

10. View Slide

11. ৽ن։ൃϓϩδΣΫτͷ঺հ
    • ։ൃ͢Δ΋ͷ
    • iOS / Android / PC Web Apps
    • Backend APIs
    • ίϯςϯπΛ؅ཧ͢ΔγεςϜ => ࠓ೔ͷ࿩ͷத৺͸͜͜
    • ։ൃظؒ: > 1೥
    • ։ൃऀͷਓ਺: > 10ਓ
    

    View Slide

12. ৽ن։ൃϓϩδΣΫτͷ঺հ
    • client => gateway => backends

    શମͰ GraphQL Λ࠾༻
    • gateway ͸ schema stitching Λར༻͍ͯ͠Δ
    • ͦͷଞར༻ٕज़
    • Ruby on Rails
    • Node.js + TypeScript + Apollo Server +
    Prisma 2
    • React, Apollo Client
    

    View Slide

13. ৽ن։ൃϓϩδΣΫτͷ঺հ
    • ڵຯ͕͋Δํ͸ͥͻɺաڈͷొஃࢿྉΛΈ͍ͯͩ͘͞
    • JSConf JP 2021 ʹొஃ͠ɺGraphQL + Prisma ʹ͍ͭͯ࿩͢༧ఆͰ͢
    

    View Slide

14. ελσΟαϓϦʹ͓͚ΔϚελʔσʔλ
    • ֶशऀֶ͕श͢ΔͨΊͷ໰୊΍ಈըͱɺ

    ͦΕΒΛ֊૚ߏ଄ʹ·ͱΊͨ΋ͷ
    • ʮίϯςϯπʯͱݺΜͰ͍Δ
    

    View Slide

15. ίϯςϯπͱ͸
    • ໰୊ (Question)
    • ໰୊จ
    • બ୒ࢶɾਖ਼ղ
    • ղઆจ
    • ͦͷଞɺ෇Ճతͳ৘ใ (ඪ४ղ౴࣌ؒͳͲ)
    • ಈը
    • ໰୊΍ಈըͷू߹ (Hierarchy)
    • ֊૚ߏ଄ʹͳ͍ͬͯΔ
    

    View Slide

16. ίϯςϯπͷಛ௃
    • ྔ͕ଟ͍
    • ߋ৽ස౓͕ߴ͍
    • جຊతʹ͸ࣾ಺ͷਓ͕σʔλΛ࡞Δ
    • ࣾ಺ʹʮίϯςϯπνʔϜʯ͕͋Δ
    

    View Slide

17. ελσΟαϓϦͷ
    طଘͷίϯςϯπ؅ཧγεςϜ
    • ΋ͱ΋ͱɺҰൠϢʔβʔ͕ίϯςϯπΛ࡞Δ͜ͱΛલఏͱͯ͠
    ࡞ΒΕ͍ͯͨ (UGC, User-Generated Contents)
    • ػೳ๛෋ͳ Web ؅ཧը໘͕ଘࡏ͢Δ
    

    View Slide

18. طଘͷίϯςϯπγεςϜͷ՝୊
    

    View Slide

19. ՝୊ (1) staging ؀ڥͰͷ֬ೝ͕೉͍͠
    • Web ؅ཧը໘ͳͷͰ staging => ຊ൪ ʹσʔλΛҠ͢ͷ͕೉͍͠
    • σʔλͷϦϦʔε·ͰͷྲྀΕ
    • ຊ൪σʔλ౤ೖ (͜ͷ࣌఺Ͱ͸ΤϯυϢʔβʔʹ͸ະެ։)
    • ݕূ༻ΞΧ΢ϯτͰσʔλΛ֬ೝ
    • ΤϯυϢʔβʔʹެ։ (ϑϥάΛཱͯΔΠϝʔδ)
    • ͜Ε͸͜ΕͰߟ͑ํͱͯ͠͸͋Γ͕ͩ...

    staging ؀ڥͰಉ౳ͷ΋ͷΛ֬ೝ͢Δखஈ͕ͳ͍
    

    View Slide

20. ՝୊ (2) σʔλͷଟॏ؅ཧ
    • ػೳ๛෋Ͱ͸͋Δ͕ɺ͋͘·Ͱ Web ্ͷ؅ཧը໘ͳͷͰɺ

    ͜Ε্Ͱશͯ࡞ۀΛ׬݁͢Δʹ͸ػೳ͕ऑ͍
    • ྫ: ਤͳͲͷը૾Λ࡞Δ࡞ۀͳͲ͸ɺผͷΞϓϦέʔγϣϯͰߦ͏
    • ͦͷը૾ͷݩͱͳΔσʔλ͸ɺγεςϜͰ͸؅ཧͰ͖ͳ͍
    • ݁ՌɺίϯςϯπͷݩʹͳΔσʔλ͕Ұݩ؅ཧ͞Εͣɺ

    ֤࡞ۀऀͷϩʔΧϧʹࢄΒ͹ͬͯ͠·͏
    

    View Slide

21. ՝୊ (3) ࡞੒ͱೖߘ͕෼཭͞Ε͍ͯΔ
    • Web ؅ཧը໘͚ͩΛ࢖ͬͯίϯςϯπ࡞੒͢Δͷ͸೉͘͠ɺ

    ίϯςϯπ࡞੒ͱೖߘͷؒʹߔ͕ଘࡏ͢Δ
    • ίϯςϯπ͸ Word ౳Ͱ࡞੒͞Ε͍ͯΔ
    • ͔ͦ͜ΒεΫϦʔϯγϣοτΛࡱͬͨΓɺWeb ؅ཧը໘ʹೖྗ(సه)ͨ͠Γ͢Δ࡞ۀ͕ൃੜ͢Δ
    • ʮೖߘνʔϜʯ͕ಠཱͯ͠ଘࡏ͍ͯ͠Δɻ

    "ίϯ΢ΣΠͷ๏ଇ" ͷయܕతͳঢ়ଶ (γεςϜͷܗͱ૊৫ͷܗ͸Ұக͢Δ)
    • ཧ૝తʹ͸ɺ࡞੒ͨ͠Βͦͷ··ೖߘ͞Εͯ΄͍͠
    

    View Slide

22. View Slide

23. View Slide

24. ৽ίϯςϯπ؅ཧγεςϜ
    

    View Slide

25. ৽ίϯςϯπ؅ཧγεςϜͰ໨ࢦͨ͜͠ͱ
    • طଘͷ՝୊Λղܾ͢Δ
    • σʔλଟॏ؅ཧΛ๾໓͢Δ
    • ࡞੒ͱೖߘΛ෼͚ͣɺ࡞ͬͨ΋ͷ͕ͦͷ··ೖߘ (γεςϜʹΠϯϙʔτ) ͞ΕΔঢ়ଶʹ͢Δ
    • ίϯςϯπ࡞੒ͷۀ຿ʹଈͨ͠ɺ࢖͍΍͍͢΋ͷΛ࡞Δɻ

    ͦͷͨΊʹɺ։ൃऀͱίϯςϯπνʔϜͰີʹڠྗ͢Δ
    • ͳΔ΂͘ "࡞Βͳ͍" ͜ͱͰɺ࣮૷ίετΛ௿͘͢Δ
    • ੈͷதʹଘࡏ͢Δπʔϧ΍ɺ͢ͰʹଞͰ։ൃ͍ͯ͠Δ࣮૷Λ૊Έ߹ΘͤͯγεςϜԽ͢Δ
    

    View Slide

26. ৽ίϯςϯπ؅ཧγεςϜ֓ཁ
    • Git, GitHub Λར༻ (WebΞϓϦͰ͸ͳ͘ɺϩʔΧϧͰ࡞ۀ͢Δ)
    • Question ͷઃ໰จ͸ HTML Λར༻͢Δ
    • ֶशը໘͸ Web ΞϓϦͱͯ͠࡞͍ͬͯΔ (ωΠςΟϒΞϓϦͰ͸ WebView ར༻) ͨΊɺHTML ΛಡΈࠐΊΔ
    • Question ͸ YAML Ͱೖྗ
    • YAML ͷதͷҰ෦ʹ HTML (໰୊จ) ؚ͕·ΕΔΑ͏ͳܗ
    • Question ͷೖྗࢧԉπʔϧΛ VSCode Extension ͱͯ͠࡞Γɺఏڙ͢Δ
    • ίϯςϯπ࡞੒ऀʹ͸ VSCode Λར༻ͯ͠࡞ۀͯ͠΋Β͏
    • Hierarchy ͸ CSV Ͱೖྗ
    

    View Slide

27. Question ೖྗࢧԉπʔϧ
    • ໾ׂ
    • Question (YAML + HTML) ͷೖྗࢧԉ
    • ϓϨϏϡʔπʔϧ
    • ͜ΕΛ VSCode Extension ͱͯ͠࡞ͬͨ
    

    View Slide

28. View Slide

29. VSCode Extension ͱͯ͠࡞Δཧ༝
    • ϩʔΧϧͰͷςΩετΤσΟλͱͯ͠ͷػೳΛͦͷ··࢖͑Δ
    • ͦͷ෦෼͔Β࡞Βͳ͍ͰࡁΉͷ͸େ͖͍
    • طଘͷ VSCode Extension ͷΤίγεςϜʹ৐ΕΔ෦෼͕͋Δ
    • Web ͷٕज़͕࢖͑Δ
    • ϓϨϏϡʔπʔϧʹ͸ Web ΞϓϦͷ੒Ռ෺Λ࢖͍·Θ͍ͨ͠
    

    View Slide

30. YAML ೖྗࢧԉ
    • VSCode Plugin ͷ YAML Λͦͷ··ར༻
    • JSON Schema Λॻ͘͜ͱͰɺYAML ͷೖྗิ׬ͱ
    όϦσʔγϣϯ͕Ͱ͖Δ
    • JSON Schema ͔Β TypeScript ͷܕΛੜ੒͠ɺίϯ
    ςϯπΛimport͢Δίʔυ (Node.js) Ͱ࠶ར༻ͯ͠
    ͍Δ
    • => JSON Schema Λॻ͘ίετ͸࣮࣭ແྉ
    

    View Slide

31. View Slide

32. HTML ೖྗࢧԉ
    • VSCode ͷ snippets ػೳΛ׆༻
    • ίϯςϯπνʔϜ͕࢖͍͍ͨσβΠϯͷ༻్ʹ߹Θͤͯɺ

    CSS ΛϑϩϯτΤϯυʹهड़͠ɺCSS ΛؚΜͩλάશମΛ
    snippets ͱͯ͠ఏڙ͢Δ
    • σβΠϯ͸σβΠφʔͱ΋૬ஊܾͯ͠ΊΔ
    

    View Slide

33. ^ ͜ͷυΩϡϝϯτ΋ࣗಈੜ੒
    

    View Slide

34. ϓϨϏϡʔπʔϧ
    • ࡞ͬͨ໰୊σʔλΛϓϨϏϡʔ͢Δπʔϧ
    • ֶशը໘ Web ΞϓϦ͔ΒɺผͷϏϧυΛੜ੒͠ɺ

    VSCode Extension ʹόϯυϧ͍ͯ͠Δ
    • ΞϓϦͰݟΔͷͱશ͘ಉ͡ݟͨ໨Ͱ͸ͳ͍͕ɺίϯϙʔωϯτ
    Λ࢖͍ճ͢͜ͱͰɺݟͨ໨ͷࠩ෼Λগͳ͍ͯ͘͠Δ
    

    View Slide

35. View Slide

36. ΞʔΩςΫνϟ (ΤϯυϢʔβʔ޲͚)
    • content service ͸ Import εΫϦϓτ
    ͱ API (GraphQL) ʹ෼͔Ε͍ͯΔ
    • Import εΫϦϓτʹ YAML ϑΝΠϧͷ
    ॲཧ΋ؚ·ΕΔ
    

    View Slide

37. ΞʔΩςΫνϟ (ϓϨϏϡʔπʔϧ)
    • ϓϨϏϡʔ༻Ϗϧυͷ React Web ΞϓϦ͸ɺੜె޲͚ͷί
    ϯϙʔωϯτɾϩδοΫΛ࠶ར༻͍ͨ͠
    • API ͱಉ͡ܗͷ JSON ͕ཉ͍͠
    • YAML ϑΝΠϧͷॲཧ (JSON σʔλԽ) ͸ content service
    ʹ࣮૷͞Ε͍ͯΔͷͰɺ࠶ར༻͍ͨ͠
    • ͸͡Ί content service ͷϩδοΫΛϥΠϒϥϦԽͯ͠ڞ
    ༗͍͕ͯͨ͠ɺϦϦʔείϯτϩʔϧͳͲ͕೉͍͠
    • ϓϨϏϡʔπʔϧઐ༻ͷ API Λ content service ʹ༻ҙ͠ɺ
    ͦ͜Ͱ Import / Read API ྆ํͷϩδοΫΛݺͼग़͢Α͏ʹ
    ͨ͠
    

    View Slide

38. VSCode Extension ͷ࣮૷
    • TypeScript Ͱ࣮૷͍ͯ͠Δ
    • όϯυϧͯ͋͠Δ Web ΞϓϦ (React) ͷઐ༻ϏϧυΛɺ

    VSCode ಺ͷ webview panel ͱͯ͠Ξλον͢Δ
    • YAML ϑΝΠϧͷมߋΛݕ஌͠ɺ
    • YAML ͷσʔλΛ webview panel ʹจࣈྻͷ··౉͢ (postMessage)
    • webview ଆͰ Content API Λୟ͍ͯ YAML Λ JSON ʹม׵͢Δ
    • React Component ʹ JSON Λ౉͠ඳը͢Δ
    

    View Slide

39. Q. ίϯςϯπ࡞੒ऀ͸ 

    YAML Λهड़Ͱ͖Δͷ͔?
    

    View Slide

40. Q. ίϯςϯπ࡞੒ऀ͸ 

    YAML Λهड़Ͱ͖Δͷ͔?
    • A. Ͱ͖Δ
    

    View Slide

41. ॳظҊ: GUI (Form) ΋഑ஔ͢Δ
    • ͸͡Ί͸ʮYAML ॻ͔ͤΔͷ͸͕͢͞ʹແ஡ʯͱࢥ͍ͬͯͨ
    • YAML ೖྗͱಉظ͢Δ GUI (Form) ͷύωϧΛ഑ஔͨ͠
    • react-jsonschema-form Λར༻
    • YAML <=> Form ͸ 2-way binding
    

    View Slide

42. ॳظҊͷ՝୊
    • ࣮૷͕ෳࡶʹͳͬͨ
    • YAML ϑΝΠϧͷopen΍editΛϑοΫʹɺผύωϧΛมԽͤ͞Δͷ͸
    ൺֱత؆୯
    • ͕ͩɺଞͷύωϧͷมߋΛ YAML ϑΝΠϧଆʹӨڹͤ͞Α͏ͱ͢Δ
    ͱߟྀ͢΂͖͜ͱ͕૿͑ͯෳࡶʹͳΔ
    • =>ʮϑΥʔϜ͍Βͳ͍ͷͰ͸?ʯͱ͍͏ΞΠσΟΞ͕ग़ͨ
    

    View Slide

43. ΍ͬͨ͜ͱ
    • ίϯςϯπ࡞੒νʔϜͱͷϞϒ࡞ۀձ
    • ϢʔβʔςετɾώΞϦϯά
    • YAML ΍ͦͷதͷ HTML ͷิ׬ʹΑΓɺΤϯδχΞҎ֎Ͱ΋

    े෼࡞ۀͰ͖Δ͜ͱ͕Θ͔ͬͨ
    • Ή͠Ζɺ׳Εͯ͠·͑͹ Form Ͱૢ࡞͢ΔΑΓͣͬͱָ
    • ҰൠతͳΤϯυϢʔβʔͱ͸ҧ͍ɺֶशίετ͸ڐ༰Ͱ͖Δ
    • => ʮ࢖͍΍͍͢ & ࣮૷ίετ௿͍ʯͱ͍͏େ͖ͳ੒Ռʹͭͳ͕ͬͨ
    

    View Slide

44. ։ൃνʔϜͱίϯςϯπνʔϜͷڠಇ (1)
    ։ൃνʔϜͱͯ͠ɺҙࣝͨ͜͠ͱ:
    • ։ൃऀ͕ɺϓϩμΫτϚωδϝϯτͷ໾ׂΛड͚࣋ͭ
    • ։ൃن໛͕େ͖͘ɺશͯΛຊ৬ͷPMʹཔΔͷ͸೉͍͠
    • ۃྗؾܰʹཁ๬Λड͚ɺվળ͢Δ
    • "ӡ༻ͰΧόʔ" ͞ΕΔͱɺσʔλͷෛ࠴ʹͳΓɺղফ͕೉͘͠ͳΔ
    • ίϯςϯπपΓʹରԠ͢ΔͨΊͷӡ༻ͷόδΣοτΛ͓͖࣋ͬͯɺ

    ؆୯ͳमਖ਼͸ͦͷதͰରԠ͢ΔΑ͏ʹͨ͠
    • όοΫϩάʹճ͢ͱɺଞͷλεΫͱͷ༏ઌॱҐ͚͕ͮ೉͘͠ͳΔͨΊ
    

    View Slide

45. ։ൃνʔϜͱίϯςϯπνʔϜͷڠಇ (2)
    ࠷ۙͷಈ޲:
    • υϝΠϯۦಈઃܭͷ࣮ફ
    • ΑΓਖ਼֓͘͠೦Λཧղͯ͠ઃܭͨ͠Γɺ࢖͏ݴ༿Λ౷Ұ͢ΔΑ͏౒ྗத
    • ίϯςϯπνʔϜ͔ΒɺϓϩμΫτϚωδϝϯτΛࢤ͢ਓ͕ݱΕ͍ͯΔ
    • ։ൃऀͱͯ͠͸ΊͪΌ͋Γ͕͍ͨ
    • ΩϟϦΞύεͷଟ༷Խʹ΋ܨ͕ͬͯɺͱͯ΋͍͍࿩
    

    View Slide

46. ·ͱΊ
    • ελσΟαϓϦͷ৽ن։ൃʹ͓͍ͯɺίϯςϯπ؅ཧͷطଘͷ՝୊ (ଟॏ؅ཧ໰୊,
    etc...) ʹ޲͖߹͖ͬͯͨ
    • طଘͷπʔϧ౳Λ͏·͘ར༻͠ɺ௿ίετͰ࣮ݱͨ͠
    • ͦͷγεςϜͷҰ෦ͱͯ͠

    VSCode Extension Λར༻ͯ͠πʔϧΛ࡞ͬͨ
    • ίϯςϯπνʔϜͱ։ൃνʔϜ͕ڠಇ͠ɺ

    ΑΓศརͳ΋ͷΛ௿ίετͰ࡞ΕΔঢ়ଶΛ໨ࢦ͍ͯ͠Δ
    

    View Slide

47. ँࣙ
    • ࠓճ঺հͨ͠੒Ռ͸ɺ๻ݸਓʹଐ͢Δ΋ͷͰ͸ͳ͘ɺ

    ελσΟαϓϦ։ൃνʔϜ / ίϯςϯπνʔϜ /

    σβΠϯνʔϜ etc...ʹΑΔ΋ͷͰ͢
    • ಛʹɺ։ൃνʔϜ @ywada526 @indigolain

    ίϯςϯπνʔϜ @nozomikajimoto ͷߩݙʹײँ͍ͯ͠·͢
    

    View Slide

48. We're hiring!
    • GraphQL, Microservices ͸΋ͪΖΜ

    ϑϩϯτΤϯυ͔ΒόοΫΤϯυ·Ͱ

    ޿͍ٕज़ʹ৮ΕΒΕΔػձ͋Γ
    • ·ͣ͸ΧδϡΞϧ໘ஊ͔Βɺͥͻ͝Ԡื͍ͩ͘͞ 😁
    • ελσΟαϓϦ௚௨ https://www.saiyo-dr.jp/recruit/Entry/top.jsp?id=357
    • ϦΫϧʔτશମ https://recruit-saiyo.jp/technology/
    

    View Slide