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
270
Implement prerendering w/ puppeteer
sottar
1
290
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
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.5k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
The Power of CSS Pseudo Elements
geoffreycrofte
79
6k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.2k
Typedesign – Prime Four
hannesfritz
42
2.8k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.7k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
How STYLIGHT went responsive
nonsquared
100
5.8k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Designing for Performance
lara
610
69k
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 Λ͏͜ͱͰ؆୯ʹϨϏϡʔͰ͖Δڥ Λ࡞ΕΔ
·ͱΊ ϨϏϡʔ͢Δ / ͞ΕΔ͜ͱͤͳͷͰϨϏϡʔ͍͢͠ڥΛ࡞Γ·͠ΐ͏