複数人で高速に開発するためのnpmモジュール

Transcript

1. 1.

   ෳ਺ਓͰߴ଎ʹ։ൃ͢ΔͨΊͷ npm Ϟδϡʔϧ Mercari, Inc. / Souzoh, Inc. Frontend Engineer

   Sota Ohara Battle Conference U30 #2018 @ ܳೳՖ఻ࣷ
2. 2.

   about me Sota Ohara / sottar Mercari, inc. / Souzoh,

   inc. Frontend Engineer mercari NOW, CSTool @sottar_ sottar
3. 3.

   ίʔυ͸̍ߦ΋ग़͖ͯ·ͤΜ

4. 4.

   PR ͷϨϏϡʔͷ͓࿩͠

5. 5.

   PR ͷϨϏϡʔͯ͠·͔͢

6. 6.

   PR ͷϨϏϡʔͰফ໣ͯ͠·͔͢

7. 7.

   ϨϏϡʔͷର৅ ίʔσΟϯάελΠϧʹଇͬͯΔ͔ ϏδωεϩδοΫ ઃܭ໰୊ͳ͍͔ ύϑΥʔϚϯεߟྀͰ͖ͯΔ͔ ؆ܿͳॻ͖ํͰ͖ͳ͍͔ σβΠϯ่Εͯͳ͍͔ ϨϏϡʔཷ·ͬͯͯ΍ΔؾͰͳ͍ or ϨϏϡʔ଴ͪͰ։ൃͰ͖ͳ͍

8. 8.

   None
9. 9.

   ϝϧΧϦͷ։ൃͰ ಋೖ͍ͯ͠ΔϞδϡʔϧ

10. 10.

    ίʔσΟϯάελΠϧͷࣗಈԽ σβΠϯϨϏϡʔͷ (Ұ෦) ࣗಈԽ

11. 11.

    ίʔσΟϯάελΠϧͷࣗಈԽ

12. 12.

    • Πϯσϯτ͕ͣΕ͍ͯΔ • ແବͳεϖʔε / վߦ͕ೖ͍ͬͯΔ • ΧϯϚ, ηϛίϩϯ͕ͳ͍ •

    ࢖͍ͬͯͳ͍ม਺͕ఆٛ͞Ε͍ͯΔ • ؔ਺ʹ౉͢Ҿ਺ͷ਺͕ҧ͏ ɹ …. ίʔσΟϯάελΠϧ΁ͷϨϏϡʔ
13. 13.

    ESLint : JavaScript ͷ LinterɻελΠϧΨΠυʹ४ڌ͍ͯ͠ͳ͍໰୊ͷ͋Δ ɹɹɹɹύλʔϯ΍ίʔυΛݟ͚ͭͯ͘ΕΔ Prettier : code formatterɻίʔυΛҰ؏ͨ͠ελΠϧʹ੔ܗͰ͖Δ

    FlowType, TypeScript : JavaScriptͷίʔυʹܕΛಋೖ͢Δ͜ͱ͕Ͱ͖Δ ίʔσΟϯάελΠϧ Stylelint : Styling ͷ Linterɻstyled-components ͳͲʹ΋ରԠ͍ͯ͠Δɻ
14. 14.

    IVTLZ
    
    
    HJU
    Ͱ
    DPNNJU
    લʹίϚϯυΛ࣮ߦ͢Δ͜ͱ͕Ͱ͖Δ CircleCI, TravisCI : ciπʔϧɻgit ͷ push ʹରͯ͠ίϚϯυΛ࣮ߦͰ͖Δ ίʔσΟϯάελΠϧ

15. 15.

    ίʔσΟϯάελΠϧ ESLint, StyleLint, FlowType or TypeScript Ͱ໰୊ͷ͋Δίʔυ͕ ͳ͍͔Λ֬ೝ by CircleCI

    git commit ࣌ʹ Prettier ͰίʔυͷϑΥʔϚοτΛߦ͏ by husky
16. 16.

    ίʔσΟϯάελΠϧ DPNNJU
    ίʔυ੔ܗ
    QSFUUJFS IVTLZ HJU
    DPNNJU
    HJU
    QVTI MJOU
    ܕνΣοΫ ϨϏϡʔ

17. 17.

    σβΠϯϨϏϡʔͷ (Ұ෦) ࣗಈԽ

18. 18.

    ͦͷϒϥϯνʹҠಈͯ͠ pull ͯ͠ build ͯ͠ ϩʔΧϧ؀ڥ্ཱͪ͛ͯ ɺɺɺ σβΠϯͷϨϏϡʔΛ͢Δʹ͸ɻɻ

19. 19.

    None
20. 20.

    IUUQTTUPSZCPPLKTPSH

21. 21.

    Storybook ͷσϞ IUUQBJSCOCJPSFBDUEBUFT

22. 22.

    ͜ͷ storybook ্ͰPRͷσβΠϯϨϏϡʔΛ͢Δ

23. 23.

    ͦͷϒϥϯνʹҠಈͯ͠ pull ͯ͠ ϩʔΧϧͰίϚϯυୟ͍ͯ ɺɺɺ ֬ೝ͢Δʹ͸

24. 24.

    None
25. 25.

    σβΠϯͷϨϏϡʔ HJU
    QVTI CVJME ϒϥϯν͝ͱʹϢχʔΫͳ63-

26. 26.

    σβΠϯͷϨϏϡʔ

27. 27.

    σβΠϯͷϨϏϡʔ IUUQBJSCOCJPSFBDUEBUFT

28. 28.

    IUUQTUVEJPBOEZIBUFOBCMPHDPNFOUSZ

29. 29.

    • PRͷϨϏϡʔ͸ϨϏϡϫʔͷෛ୲ʹͳΓνʔϜશମͷ։ൃʹӨڹ͕ग़͔Ͷ ͳ͍ͷͰɺͰ͖ΔݶΓෛ୲ΛݮΒ͢౒ྗ͕ඞཁ • Θ͔Γ΍͍͢ϨϏϡʔʹؔͯ͠͸ϞδϡʔϧΛ࢖͏͜ͱͰࣗಈԽ͕Մೳ • σβΠϯͷϨϏϡʔ͸ storybook Λ࢖͏͜ͱͰ؆୯ʹϨϏϡʔͰ͖Δ؀ڥ Λ࡞ΕΔ

    ·ͱΊ ϨϏϡʔ͢Δ / ͞ΕΔ͜ͱ͸޾ͤͳͷͰϨϏϡʔ͠΍͍͢؀ڥΛ࡞Γ·͠ΐ͏