Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
複数人で高速に開発するためのnpmモジュール
Search
sota ohara
April 21, 2018
5
2.6k
複数人で高速に開発するためのnpmモジュール
sota ohara
April 21, 2018
Tweet
Share
More Decks by sota ohara
See All by sota ohara
Re-Architecture of ReactNative
sottar
0
260
Implement prerendering w/ puppeteer
sottar
1
280
create own CMS from scratch
sottar
2
9k
Let’s try to hack AST of JavaScript
sottar
1
1.8k
フロントエンドエンジニアが伝えたい最近の事情
sottar
28
18k
new version of context in React 16.3
sottar
3
1.7k
2ヶ月半でサービスをリリースした話し
sottar
2
2.2k
Redux のディレクトリ構成を考える
sottar
2
15k
モダンなJavaScriptアプリケーションでモダンにスタイリングする方法
sottar
9
5k
Featured
See All Featured
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.5k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
21
1.4k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.5k
Being A Developer After 40
akosma
90
590k
Documentation Writing (for coders)
carmenintech
73
4.9k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Optimising Largest Contentful Paint
csswizardry
37
3.4k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
21k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Transcript
ෳਓͰߴʹ։ൃ͢ΔͨΊͷ npm Ϟδϡʔϧ Mercari, Inc. / Souzoh, Inc. Frontend Engineer
Sota Ohara Battle Conference U30 #2018 @ ܳೳՖࣷ
about me Sota Ohara / sottar Mercari, inc. / Souzoh,
inc. Frontend Engineer mercari NOW, CSTool @sottar_ sottar
ίʔυ̍ߦग़͖ͯ·ͤΜ
PR ͷϨϏϡʔͷ͓͠
PR ͷϨϏϡʔͯ͠·͔͢
PR ͷϨϏϡʔͰফͯ͠·͔͢
ϨϏϡʔͷର ίʔσΟϯάελΠϧʹଇͬͯΔ͔ ϏδωεϩδοΫ ઃܭͳ͍͔ ύϑΥʔϚϯεߟྀͰ͖ͯΔ͔ ؆ܿͳॻ͖ํͰ͖ͳ͍͔ σβΠϯ่Εͯͳ͍͔ ϨϏϡʔཷ·ͬͯͯΔؾͰͳ͍ or ϨϏϡʔͪͰ։ൃͰ͖ͳ͍
None
ϝϧΧϦͷ։ൃͰ ಋೖ͍ͯ͠ΔϞδϡʔϧ
ίʔσΟϯάελΠϧͷࣗಈԽ σβΠϯϨϏϡʔͷ (Ұ෦) ࣗಈԽ
ίʔσΟϯάελΠϧͷࣗಈԽ
• Πϯσϯτ͕ͣΕ͍ͯΔ • ແବͳεϖʔε / վߦ͕ೖ͍ͬͯΔ • ΧϯϚ, ηϛίϩϯ͕ͳ͍ •
͍ͬͯͳ͍ม͕ఆٛ͞Ε͍ͯΔ • ؔʹ͢Ҿͷ͕ҧ͏ ɹ …. ίʔσΟϯάελΠϧͷϨϏϡʔ
ESLint : JavaScript ͷ LinterɻελΠϧΨΠυʹ४ڌ͍ͯ͠ͳ͍ͷ͋Δ ɹɹɹɹύλʔϯίʔυΛݟ͚ͭͯ͘ΕΔ Prettier : code formatterɻίʔυΛҰ؏ͨ͠ελΠϧʹܗͰ͖Δ
FlowType, TypeScript : JavaScriptͷίʔυʹܕΛಋೖ͢Δ͜ͱ͕Ͱ͖Δ ίʔσΟϯάελΠϧ Stylelint : Styling ͷ Linterɻstyled-components ͳͲʹରԠ͍ͯ͠Δɻ
IVTLZHJUͰDPNNJUલʹίϚϯυΛ࣮ߦ͢Δ͜ͱ͕Ͱ͖Δ CircleCI, TravisCI : ciπʔϧɻgit ͷ push ʹରͯ͠ίϚϯυΛ࣮ߦͰ͖Δ ίʔσΟϯάελΠϧ
ίʔσΟϯάελΠϧ ESLint, StyleLint, FlowType or TypeScript Ͱͷ͋Δίʔυ͕ ͳ͍͔Λ֬ೝ by CircleCI
git commit ࣌ʹ Prettier ͰίʔυͷϑΥʔϚοτΛߦ͏ by husky
ίʔσΟϯάελΠϧ DPNNJU ίʔυܗ QSFUUJFS IVTLZ HJUDPNNJU HJUQVTI MJOU ܕνΣοΫ ϨϏϡʔ
σβΠϯϨϏϡʔͷ (Ұ෦) ࣗಈԽ
ͦͷϒϥϯνʹҠಈͯ͠ pull ͯ͠ build ͯ͠ ϩʔΧϧڥ্ཱͪ͛ͯ ɺɺɺ σβΠϯͷϨϏϡʔΛ͢Δʹɻɻ
None
IUUQTTUPSZCPPLKTPSH
Storybook ͷσϞ IUUQBJSCOCJPSFBDUEBUFT
͜ͷ storybook ্ͰPRͷσβΠϯϨϏϡʔΛ͢Δ
ͦͷϒϥϯνʹҠಈͯ͠ pull ͯ͠ ϩʔΧϧͰίϚϯυୟ͍ͯ ɺɺɺ ֬ೝ͢Δʹ
None
σβΠϯͷϨϏϡʔ HJUQVTI CVJME ϒϥϯν͝ͱʹϢχʔΫͳ63-
σβΠϯͷϨϏϡʔ
σβΠϯͷϨϏϡʔ IUUQBJSCOCJPSFBDUEBUFT
IUUQTUVEJPBOEZIBUFOBCMPHDPNFOUSZ
• PRͷϨϏϡʔϨϏϡϫʔͷෛ୲ʹͳΓνʔϜશମͷ։ൃʹӨڹ͕ग़͔Ͷ ͳ͍ͷͰɺͰ͖ΔݶΓෛ୲ΛݮΒ͢ྗ͕ඞཁ • Θ͔Γ͍͢ϨϏϡʔʹؔͯ͠ϞδϡʔϧΛ͏͜ͱͰࣗಈԽ͕Մೳ • σβΠϯͷϨϏϡʔ storybook Λ͏͜ͱͰ؆୯ʹϨϏϡʔͰ͖Δڥ Λ࡞ΕΔ
·ͱΊ ϨϏϡʔ͢Δ / ͞ΕΔ͜ͱͤͳͷͰϨϏϡʔ͍͢͠ڥΛ࡞Γ·͠ΐ͏