Upgrade to Pro — share decks privately, control downloads, hide ads and more …

WordFes2017 制作現場のこれから 開発ワークフローとコーディング規約

Yousan_O
October 28, 2017

WordFes2017 制作現場のこれから 開発ワークフローとコーディング規約

WordFes2017のスライドです。
実際にコーディング規約を制作現場に導入してみて感じたこと、コーディング規約を導入するメリットについての内容です。

Yousan_O

October 28, 2017
Tweet

More Decks by Yousan_O

Other Decks in Programming

Transcript

  1. ੍࡞ݱ৔ͷ͜Ε͔Β
    ։ൃϫʔΫϑϩʔͱίʔσΟϯάن໿
    2017೥10݄28೔ @ WordFes Nagoya 2017

    View full-size slide

  2. ૣ଎Ͱ͕͢

    View full-size slide

  3. λϒεϖʔε໰୊

    View full-size slide

  4. ෆໟͳίϛοτ…

    View full-size slide

  5. ໘౗ͳϨϏϡʔ…

    View full-size slide

  6. ੍࡞ݱ৔΋ͬͱշదʹ…ʂ

    View full-size slide

  7. ࠓ೔͓఻͍͑ͨ͜͠ͱ

    View full-size slide

  8. ࠓ೔͓఻͍͑ͨ͜͠ͱ
    • ։ൃϫʔΫϑϩʔͷΩʔϫʔυ
    • πʔϧָ͍͠Ͱ͢
    • λϒεϖʔε໰୊ͷղܾ
    • ݱ৔ಋೖίετ

    View full-size slide

  9. ࣗݾ঺հɹ

    View full-size slide

  10. ࣗݾ঺հ
    • ਆ֞ɹ૱
    • ϓϩάϥϜɺαʔό
    • Web੍࡞ձࣾ
    • ओʹWordPressͰݱ৔10೥

    View full-size slide

  11. ࣗݾ঺հ
    • ෋ࢁݝͷձࣾ
    • ʢ΄΅ʣϑϧϦϞʔτͰ෱ౡݝࡏॅ
    • ͓٬͞Μ΋͋ͪͪ͜ʹ

    View full-size slide

  12. ࣭໰͍ͤͯͩ͘͞͞

    View full-size slide

  13. օ͞Μ͸Կ԰͞Μʁ
    • σΟϨΫλʔ԰͞ΜʢӦۀɺϚωʔδϟʣ
    • σβΠφʔ԰͞Μ
    • ίʔμʔ԰͞Μʢϑϩϯτ԰͞Μʣ
    • ϓϩάϥϚɺαʔό԰͞Μ

    View full-size slide

  14. ΞδΣϯμ
    • ։ൃϫʔΫϑϩʔʹ͍ͭͯ
    • ίʔσΟϯάن໿ʹ͍ͭͯ
    • ಋೖͷίετ࣮ྫ

    View full-size slide

  15. ։ൃϫʔΫϑϩʔʹ͍ͭͯ

    View full-size slide

  16. ։ൃϫʔΫϑϩʔʹ͍ͭͯ
    • ։ൃͷྲྀΕʢϑϩʔʣ
    • ޻਺࡟ݮ
    • ϛεܰݮ
    • ָ͍͠

    View full-size slide

  17. όʔδϣϯ؅ཧ
    CIࣗಈԽ
    ςετ
    πʔϧ
    PHPCS

    View full-size slide

  18. ੍࡞ͰGit࢖͍ͬͯ·͔͢ʁ
    • ࢖͍ͬͯΔ
    • ࢖͍ͬͯͳ͍

    View full-size slide

  19. GitͱGitͷϫʔΫϑϩʔ
    • Git flow
    • GitHub flow

    View full-size slide

  20. ࣗࣾͷGitͷ࢖͍ํ
    • ϒϥϯνͷৼΓํΛܾΊΔ
    • جຊ͸Git flowʹԊ͏
    • master, develop, feature, release
    • Ϛʔδ͸ϓϧϦΫΤετͱϨϏϡʔ

    View full-size slide

  21. ։ൃϫʔΫϑϩʔ
    • ϫʔΫϑϩʔ͸։ൃͷྲྀΕ
    • ϫʔΫϑϩʔࢧԉͷπʔϧ͕ͨ͘͞Μ͋Δ
    • शಘʹ͕͔͔࣌ؒΔ
    • शಘ͢ΔͱࣗಈԽͰ͖ͯศར

    View full-size slide

  22. ΞδΣϯμ
    • ։ൃϫʔΫϑϩʔʹ͍ͭͯ
    • ίʔσΟϯάن໿ʹ͍ͭͯ
    • ಋೖͷίετ

    View full-size slide

  23. ίʔσΟϯάن໿

    View full-size slide

  24. ίʔσΟϯάن໿஌ͬͯ·͢ʁ
    • ݱ৔ͰίʔσΟϯάن໿࢖ͬͯ·͢
    • ͳΜͱͳ͘஌͍ͬͯ·͢
    • ࠓճ͸͡Ίͯฉ͖·ͨ͠

    View full-size slide

  25. λϒεϖʔε໰୊

    View full-size slide

  26. ίʔσΟϯάن໿ͱ͸
    • ίʔυΛॻ্͘ͰͷϧʔϧʢStandardsʣ
    • PHPͱ͔WordPressͱ͔Ͱఆٛ
    • CSSͩͱBEMͱ͔
    • Ͱ΋͋Ε͸ݫ֨

    View full-size slide

  27. WordPressͷίʔσΟϯάن໿
    • PHP ίʔσΟϯά
    • ΞΫηγϏϦςΟίʔσΟϯά
    • CSS ίʔσΟϯά
    • HTML ίʔσΟϯά
    • JavaScript ίʔσΟϯά

    View full-size slide

  28. WordPressίʔσΟϯάن໿

    View full-size slide

  29. ίʔσΟϯάن໿ྫ

    View full-size slide

  30. ίʔσΟϯάن໿ྫ

    View full-size slide

  31. λϒεϖʔε໰୊

    View full-size slide

  32. ͪΌΜͱௐ΂·͠ΐ͏ʂ

    View full-size slide

  33. ίʔσΟϯάن໿ͷࣗಈνΣο
    Ϋ
    • ΤσΟλ
    • πʔϧ
    • Git࿈ܞ

    View full-size slide

  34. ΤσΟλͰͷྫ

    View full-size slide

  35. ίʔσΟϯάن໿Λἧ͑Δͱ
    • ଞͷਓ͕ݟͨ࣌ʹ
    • ݟ΍͍͢
    • ϛε͕ݮΔ
    • έϯΧʹͳΒͳ͍
    • ʮଞͷਓʯ === ʮ3೔ޙͷࣗ෼ʯ

    View full-size slide

  36. ಋೖͷϝϦοτ
    • ϛεͷܰݮ
    • ೋ౓໨Ҏ߱ͷίετ࡟ݮ

    View full-size slide

  37. ΞδΣϯμ
    • ։ൃϫʔΫϑϩʔʹ͍ͭͯ
    • ίʔσΟϯάن໿ʹ͍ͭͯ
    • ಋೖͷίετ

    View full-size slide

  38. ݱ৔ಋೖͷίετ

    View full-size slide

  39. Έͳ͞Μͷਓ݅අ͍͘ΒͰ͔͢ʁ
    • ෼͔Βͳ͍ɺ಺ॹ
    • ~ 3,000ԁ / ࣌ؒ
    • 3,001ԁ ~ 8,000 ԁ / ࣌ؒ
    • 8,000 ԁ Ҏ্ / ࣌ؒ
    • ਓ݄ܭࢉ͕ྑ͍ͱ͸ݶΒͳ͍͕…

    View full-size slide

  40. ਓ݄୯Ձ
    • Ұ೔8࣌ؒ 20೔ => 160࣌ؒ / ݄
    • 3,000ԁ / ࣌ؒ => 48ສ / ݄
    • 5,000ԁ / ࣌ؒ => 80ສ / ݄
    • 8,000ԁ / ࣌ؒ => 128ສ / ݄

    View full-size slide

  41. ࣮ྫ
    • WordPressΛ࢖ͬͨγεςϜ։ൃ
    • ςʔϚ͸ࢧڅ
    • ໿2.4ਓ݄
    • ϓϩάϥϚ3ਓ͕ࢀՃ

    View full-size slide

  42. ίʔσΟϯάن໿ͷಋೖʹֻ͔
    Δίετ
    • शಘɺಋೖɺઃఆʹ໿80࣌ؒ
    • Ұ೔8࣌ؒ => 10೔ => 0.5ਓ݄
    • Ͱɺ͍͘Βʁ

    View full-size slide

  43. ਓ݄୯Ձ
    • Ұ೔8࣌ؒ 20೔ => 160࣌ؒ / ݄
    • 3,000ԁ / ࣌ؒ => 48ສ / ݄
    • 5,000ԁ / ࣌ؒ => 80ສ / ݄
    • 8,000ԁ / ࣌ؒ => 128ສ / ݄

    View full-size slide

  44. ࣮ࡍͷඅ༻͸
    ͝૝૾ʹ͓·͔ͤ͠·͢

    View full-size slide

  45. ࣮຿΁ಋೖͯ͠
    • ։ൃָ͕͘͠ͳͬͨ
    • Πϯσϯτ໰୊͕ղܾͨ͠
    • ίʔσΟϯάن໿͸౴͕͑͋Δ

    View full-size slide

  46. ࠓ೔ͷ·ͱΊ
    • ։ൃϫʔΫϑϩʔͷπʔϧ
    • WordPress༻ͷίʔσΟϯάن໿
    • ϛεܰݮʂೋ౓໨͔Βίετ࡟ݮʂ
    • 2.4ਓ݄Ͱ0.5ਓ݄

    View full-size slide

  47. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·͠
    ͨ

    View full-size slide

  48. ͔͜͜Β࡟আҊ

    View full-size slide

  49. ϓϧϦΫΤετ

    View full-size slide

  50. ࣗಈςετ

    View full-size slide

  51. CI
    • ܧଓతΠϯςάϨʔγϣϯ
    • ιʔείʔυʹΤϥʔ͕ςετΛࣗಈԽ
    • TravisCI
    • CircleCI
    • Jenkins

    View full-size slide

  52. CIͰͰ͖Δ͜ͱ
    • PHPίʔυͷ୯ମςετࣗಈԽ
    • ϒϥ΢βͷςετࣗಈԽ
    • ࣗಈσϓϩΠ

    View full-size slide

  53. ϓϧϦΫΤετͱCI
    • ϓϧϦΫΤετൃߦ࣌ʹςετ
    • ιʔείʔυͷਖ਼౰ੑςετ
    • ιʔείʔυͷίʔσΟϯάن໿ςετ
    • ςετʹ௨͍ͬͯΕ͹Ϛʔδ

    View full-size slide

  54. ࣗࣾͰ࢖͍ͬͯΔπʔϧ
    • Docker (ϩʔΧϧ։ൃ)
    • GitHub (՝ۚͰϓϥΠϕʔτϦϙδτϦ)
    • CircleCI (ແྉͰϓϥΠϕʔτ)

    View full-size slide