エンジニアとQAでコラボするフロントエンドリアーキテクチャ開発の事例

Transcript

1. ΤϯδχΞͱ2"ͰίϥϘ͢Δ
   ϑϩϯτΤϯυϦΞʔΩςΫνϟͷ։ൃࣄྫ
   #"3ϑϩϯτ͑ΜͲ͏ʮϑϩϯτΤϯυϦΞʔΩςΫτʯ
   /PLPHJSJ !OLHSOLHS
   ϑϩϯτΤϯυΤϯδχΞ!DZCP[V
   

   View Slide

2. /PLPHJSJ !OLHSOLHS
   
   w αΠϘ΢ζגࣜձࣾcϑϩϯτΤϯυΤϯδχΞ
   w ೥ೖࣾɻLJOUPOFͷ৽نػೳ։ൃνʔϜΛܦ
   ͯ೥͔ΒLJOUPOFͷϑϩϯτΤϯυͷج൫࡮
   ৽ϓϩδΣΫτʢϑϩϦΞʣͷ্ཱͪ͛ظ͔Βࢀ
   ըɻݱࡏ͸ϓϩδΣΫτΛਪਐཱ৔
   w ϙέϞϯରઓΨν੎ʢϙέιϧͷμϝܭࢉπʔϧͷ։ൃʣɺೋࣇͷ෕
   

   View Slide

3. LJOUPOFʹ͍ͭͯ
   w ۀ຿γεςϜΛࣗ༝ʹ࡞ΕΔΫϥ΢υϓϥοτ
   ϑΥʔϜ
   w ϦϦʔεͯ͠໿೥
   w άϩʔόϧల։த
   w ϓϥάΠϯͳͲΛ࡞੒͢Δύʔτφʔձ͕ࣾଟ਺
   ଘࡏ
   

   View Slide

4. ࠓ೔ͷΰʔϧ
   w ϑϩϦΞͷ׆ಈʹ͍ͭͯ
   w ΤϯδχΞͱ2"͸ಉ͡νʔϜͰ։ൃͰ͖Δ
   w ৬ೳͰઢΛҾ͔ͣʹาΈدΓͳ͕Β։ൃͰ͖Δ
   ҎԼʹ͍ͭͯ஌ͬͯ΋Β͑Δ
   

   View Slide

5. ͸ͳ͢͜ͱ
   w LJOUPOFͷϑϩϯτΤϯυϦΞʔΩςΫτϓϩδΣ
   ΫτʢϑϩϦΞʣͱ͸
   w ։ൃͷྲྀΕ
   w ΤϯδχΞ㱻2"ͷίϥϘϨʔγϣϯࣄྫ
   w ৬ೳΛލ͍ͩίϥϘϨʔγϣϯͷͨΊʹ
   

   View Slide

6. ϑϩϦΞͱ͸
   

   View Slide

7. ϑϩϦΞͱ͸
   w LJOUPOFͷϑϩϯτΤϯυΛϦΞʔΩςΫτ͢ΔϓϩδΣΫτ
   w LJOUPOFͷϑϩϯτΤϯυ͸$MPTVSF5PPMTͱ͍͏ϥΠϒϥϦͰॻ͔Ε
   ͓ͯΓɺ͜ΕΛ3FBDUʹஔ͖׵͍͑ͯ͘
   w ͨͩͷϦϥΠτͰ͸ͳ͘ɺܧଓతʹLJOUPOFͷϑϩϯτΤϯυͷվળ
   ͕Ͱ͖ΔΑ͏ͳج൫࡞Γ΋ؚΊͯߦ͏
   

   View Slide

8. ϓϩδΣΫτͷΰʔϧ
   w ʮLJOUPOFશͯͷϖʔδ͕3FBDUʹΑͬͯදࣔ͞Ε͍ͯΔʯ
   w ʮϑϩϯτΤϯυ͕ػೳ΍ίϯϙʔωϯτ୯ҐͰ෼ׂ͞ΕɺͦΕΛ؅
   ཧ͢Δ֤νʔϜ͕ಠཱͯ͠ϥΠϒϥϦߋ৽΍ٕज़બఆΛߦ͑Δঢ়ଶʹ
   ͳ͍ͬͯΔʯ
   w ʮఆৗతͳϢʔβʔମݧʹؔ͢Δࢦඪʢ8FCύϑΥʔϚϯεɺΞΫ
   ηγϏϦςΟͳͲʣͷܭଌ͕ߦΘΕɺνʔϜͷؔ৺ࣄʹͳ͍ͬͯΔʯ
   

   View Slide

9. ࣮ࡍʹ࡮৽͍ͯ͠Δը໘ͷྫ
   

   View Slide

10. ओͳϝϯόʔͱ৬ೳ
    w ϓϩμΫτΦʔφʔɺΤϯδχΞɺ2"ɺεΫϥϜϚελʔ͕̍νʔϜ
    ʹॴଐ͠։ൃΛ͍ͯ͠Δ
    w σβΠφʔɺBZΤΩεύʔτɺϩʔΧϥΠζ୲౰ͳͲ͸νʔϜ֎Ͱ
    దٓίϛϡχέʔγϣϯΛͱΓͳ͕Β։ൃ͍ͯ͠Δ
    w ͦΕͧΕͷओͳ໾ׂ͸͋Δ͕ɺ৬ೳΛΫϩεΦʔόʔ͠ͳ͕Β࡮৽Λ
    ਐΊ͍ͯΔ
    

    View Slide

11. αΠϘ΢ζͷ2"ͬͯͲΜͳ࢓ࣄʁ
    w ϓϩμΫτͷ඼࣭ʹ੹೚Λ࣋ͭϩʔϧ
    w ։ൃ͞Εͨػೳʹ͍ͨͯ͠ͲͷΑ͏ͳςετ͕ඞཁ͔ܭը
    w ςετΛ࣮ࢪ͢Δ
    w ࣗಈςετΛॻ͘ϝϯόʔ΋͍Δ
    w ಛʹϑϩϯτΤϯυͷ2"ϝϯόʔ͸Ϛ΢εૢ࡞ͳͲ͚ͩͰͳ͘Ωʔ
    Ϙʔυૢ࡞ͳͲBZपΓͷࢼݧΛߦ͏͜ͱ΋͋Δ
    

    View Slide

12. ։ൃͷྲྀΕ
    

    View Slide

13. ࡮৽ͷखॱ
    w ը໘΍ػೳ୯ҐͰͷ࡮৽ͯ͠ϦϦʔε
    w جຊతʹطଘͷ࢓༷࠶ݱ͢ΔΑ͏ʹॻ͖׵͑Λߦ͏ɻ
    w ׬શʹݱߦػೳอূ͢ΔΘ͚Ͱ͸ͳ͍
    w σβΠϯ࡮৽ͱηοτͰϦϦʔε͢Δ͜ͱ΋͋Γ·͢
    ৽ػೳ։ൃͱ͸લఏ͕গ͠ҟͳΔ
    

    View Slide

14. εϓϦϯτͷྲྀΕ
    w ࣮૷͢΂͖ػೳͷચ͍ग़͠
    w ࢼݧ؍఺ͷચ͍ग़͠
    w εϓϦϯτܭը
    w ࣮૷ ςετʢࣗಈɾखಈʣ
    w 13Ϛʔδ
    

    View Slide

15. ΤϯδχΞ㱻2"ͷ
    ίϥϘϨʔγϣϯࣄྫ
    

    View Slide

16. ࣮૷͢΂͖ػೳͷચ͍ग़͠
    w ΤϯδχΞͱ2"Ͱ࢓༷ॻɺڍಈΛ֬ೝ͠ͳ͕Β࡞Δ΂͖ػೳΛચ
    ͍ग़͢
    w 2"͸طଘ࢓༷΁ͷཧղ͕ਂ͍ͷͰʮ࣮͸࢓༷ॻʹ͔͔Ε͍ͯͳ͍
    ػೳ͕͋Δʯʮ͜͜͸ෆ۩߹͕͋ΔʯͳͲॿݴΛ͢Δͱ͕Ͱ͖Δ
    w طଘ࢓༷Λ࠶ݱ͢ΔϓϩδΣΫτ͔ͩΒͦ͜2"ͷ஌ݟ͕༗༻
    w ΤϯδχΞ͸طଘͷίʔυΛݟͯΑΓৄࡉͳৼΔ෣͍Λ֬ೝͰ͖
    Δ
    

    View Slide

17. 2"ͱΤϯδχΞͰ૬ஊ͠ͳ͕Β࡞͍ͬͯ͘
    

    View Slide

18. ࢼݧ؍఺ͷચ͍ग़͠
    w ओʹ2"͕։ൃ͢Δػೳʹରͯ͠ඞཁͳࢼݧͷચ͍ग़͠Λߦ͏
    w ΤϯδχΞࢹ఺Ͱ΋ಛʹ࣮૷໘͔ΒؾʹͳΔͱ͜ΖͳͲΛ఻͑Δ
    w ΤϯδχΞͱ2"Ͱ૬ஊ͠ͳ͕Βςετͷ࣮ࢪํ๏ΛܾΊ͍ͯ͘
    

    View Slide

19. ςετͷ࣮ࢪํ๏
    આ໌ ิ଍
    Ϣχοτ KFTUΛ࢖ͬͨςετ
    ؔ਺ͷ*Oͱ0VUΛݕࠪ͢Δ
    ΤϯδχΞ͕؅ཧɺ2"͸؅ཧ͠ͳ
    ͍
    ΠϯςάϨʔγϣϯ 3FBDU5FTUJOH-JCSBSZΛ࢖ͬͨςετ
    ը໘΍ػೳ୯ҐͷৼΔ෣͍Λݕࠪ͢Δ
    ϒϥ΢βςετ 4UPSZCPPLͱQMBZXSJHIUΛ࢖ͬͨςετ
    ओʹυϥοάΞϯυυϩοϓ͕ൃੜ͢ΔৼΔ෣͍Λݕࠪ͢Δ
    735 4UPSZCPPLͱ$ISPNBUJDΛ࢖ͬͨςετ
    ϥΠϒϥϦΞοϓσʔτͳͲͰ૝ఆ֎ͷݟͨ໨ͷࠩ෼͕ͳ͍͜ͱΛݕࠪ͢Δ
    && 4FMFOJVNΛ࢖ͬͨςετ
    αʔόʔαΠυͱͷ݁߹෦෼Λݕࠪ͢Δ
    جຊతʹ͸ϋοϐʔύεͰ̍ը໘਺
    έʔε
    खಈ ্هςετͰ୲อͮ͠Β͍Օॴ΍ɺ2"ͷܦݧ্ո͍͠ͱ͜ΖͳͲΛݟΔͨ
    ΊͷςετɻΫϩεϒϥ΢βςετͳͲ
    

    View Slide

20. ࣮ࡍͷςετͱछྨͷ۠෼͚
    

    View Slide

21. εϓϦϯτܭը
    w εϓϦϯτΛΤϯδχΞͱ2"ͰͲ͏ա͔͋͢͝Δఔ౓ܭը͢Δ
    w ܭըʹແཧ͕ͳ͍͔ॱௐ͔ͳͲΛேձͰνΣοΫ͢Δ
    

    View Slide

22. εϓϦϯτܭըͷྫ
    

    View Slide

23. ࣮૷ ςετʢࣗಈɾखಈʣ
    w ࣮૷͸ΤϯδχΞͰߦ͍ɺίʔυϨϏϡʔɺςετࣗಈԽ·Ͱ׬ྃ͠
    ͨΒ2"ʹखಈࢼݧΛґཔ͢Δ
    w ରԠ͢ΔػೳʹΑͬͯ͸ΤϯδχΞ͕ಈ࡞֬ೝͷΈͰ0,ͱ͢Δ΋͋
    Δ
    w 2"ͷखಈࢼݧ͕ؒʹ߹Θͳ͍৔߹͸ΤϯδχΞ͕ख఻͏͜ͱ΋͋Δ
    

    View Slide

24. ࣮૷ ςετʢࣗಈɾखಈʣ
    w 2"͕ࣗಈࢼݧͷίʔυΛϨϏϡʔ͢Δ͜ͱ΋͋Δ
    w ͦͷͨΊʹࣗಈࢼݧͷίʔυʹࢼݧखॱΛίϝϯτͱͯ͠هड़͢Δ
    ͜ͱ΋͋Δ
    w 2"͕ςετࣗಈԽʹνϟϨϯδ͢Δ͜ͱ΋͋ΓɺΤϯδχΞ͕ςε
    τͷ਽ܗ΍.PDLͷ࢓૊ΈΛ࡞੒ͯ͠2"͕ςετΛॻ͘͜ͱ΋͋Δ
    2"ͱΤϯδχΞͰ͓ޓ͍ʹͰ͖Δ͜ͱΛ૿΍͍ͯ͘͠
    

    View Slide

25. ৬ೳΛލ͍ͩ
    ίϥϘϨʔγϣϯͷͨΊʹ
    

    View Slide

26. ৬ೳΛ௒͑ͯίϥϘ͢ΔͨΊʹͰ͖Δ͜ͱ
    w ڞ௨ͷνʔϜͷ໨ඪΛઃఆ͢Δ
    w εϓϦϯτͷ׬ྃ৚݅ʹࢼݧ׬ྃΛೖΕΔ
    w ϓϩδΣΫτͷ໨ඪɺΫΦʔλʔͷ໨ඪɺεϓϦϯτͷ໨ඪ
    w ීஈ͔Βίϛϡχέʔγϣϯ͕औΕΔؔ܎ੑΛ࡞Δ
    w ຖ೔ேձͰձ࿩͢Δ
    w ෺ཧతʹձͬͯؔ܎ੑΛߏங͢Δ
    

    View Slide

27. ৬ೳΛ௒͑ͯίϥϘ͢ΔͨΊʹͰ͖Δ͜ͱ
    w ৬ೳͰ࢓ࣄΛ۠੾Β͓ͣޓ͍ͷ࢓ࣄΛ΍ͬͯΈΔ
    w ΤϯδχΞ͕ࢼݧઃܭɺ2"͕ςετࣗಈԽͳͲ
    w ڞ௨ͷ໨ඪୡ੒ͷͨΊʹྖҬΛΫϩεΦʔόʔ͍ͯ͘͠
    

    View Slide

28. View Slide

29. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ
    8&"3&)*3*/(
    

    View Slide