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
ikyu-frontend
Search
kentana20
March 29, 2016
Technology
21
7.3k
ikyu-frontend
3.29 Sansan✕一休.com 勉強会での発表資料です
kentana20
March 29, 2016
Tweet
Share
More Decks by kentana20
See All by kentana20
一休.comでの開発組織改善の取り組みとこれから /improve-ikyu-devlove-x
kensuketanaka
24
37k
株式会社一休 会社紹介資料 / introduce-ikyu
kensuketanaka
15
120k
一休での開発における改善の取組み /devops-at-ikyu
kensuketanaka
13
10k
一休.com における改善事例のご紹介 /ikyu-storage-improvement
kensuketanaka
6
11k
開発合宿@京都 /hack-camp-kyoto
kensuketanaka
0
3.9k
一休.comにおけるデプロイフローと自動化 /ikyu-deploy-flow
kensuketanaka
9
8.9k
sushi_route_2015
kensuketanaka
0
230
qiita meetup#12
kensuketanaka
4
71k
cross_2015_trave_ec
kensuketanaka
1
3.5k
Other Decks in Technology
See All in Technology
インサイト情報からどこまで自動化できるか試してみた
takas0522
0
120
SOC2取得の全体像
shonansurvivors
1
340
Pythonによる契約プログラミング入門 / PyCon JP 2025
7pairs
4
2.2k
LLMアプリケーション開発におけるセキュリティリスクと対策 / LLM Application Security
flatt_security
7
1.5k
Goに育てられ開発者向けセキュリティ事業を立ち上げた僕が今向き合う、AI × セキュリティの最前線 / Go Conference 2025
flatt_security
0
270
コンテキストエンジニアリングとは? 考え方と応用方法
findy_eventslides
4
820
Why React!?? Next.jsそしてReactを改めてイチから選ぶ
ypresto
9
3.6k
RailsのPostgreSQL 18対応
yahonda
0
1.2k
AIが書いたコードをAIが検証する!自律的なモバイルアプリ開発の実現
henteko
1
230
BirdCLEF+2025 Noir 5位解法紹介
myso
0
160
analysis パッケージの仕組みの上でMulti linter with configを実現する / Go Conference 2025
k1low
1
240
ユニットテストに対する考え方の変遷 / Everyone should watch his live coding
mdstoy
0
100
Featured
See All Featured
Large-scale JavaScript Application Architecture
addyosmani
513
110k
4 Signs Your Business is Dying
shpigford
185
22k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
3k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
Designing for Performance
lara
610
69k
Navigating Team Friction
lara
189
15k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.7k
Learning to Love Humans: Emotional Interface Design
aarron
274
40k
Statistics for Hackers
jakevdp
799
220k
Become a Pro
speakerdeck
PRO
29
5.5k
Transcript
Ұٳ.com ʹ͓͚Δ ϑϩϯτΤϯυ։ൃ ʙSansan✕Ұٳ ϑϩϯτΤϯυษڧձʙ kensuke tanaka (@kentana20)
About me • ాத ݈հ • @kentana20 • 20065݄͔ΒҰٳ •
॓ധαʔϏε։ൃ(9) →γεςϜຊ෦(1)
Agenda • Ұٳ.com & ࠾༻ٕज़ / Tools • ։ൃମ੍ɺ։ൃϑϩʔ •
σβΠφʔͱͷίϥϘϨʔγϣϯ • ϚʔέςΟϯάɺCSͱͷίϥϘϨʔγϣϯ
ຊͷςʔϚ ϑϩϯτΤϯυ։ൃͷ࣮ྫ
͝ҙ • ϑϩϯτΤϯυ։ൃͷલஈͷΛ͠·͢ • ͍͔ʹͯ͠σβΠφʔϚʔέςΟϯάɺCS ΤϯδχΞͷίϥϘϨʔγϣϯΛߴΊ͍ͯΔ͔ ͱ͍͏͕ϝΠϯͰ͢ • TechগͳΊ •
ޙฤͰผ్͓͍͖ͤͯͨͩ͞·͢
Ұٳ.com & ࠾༻ٕज़ / Tools
About Ұٳ.com
None
Ұٳ.com • ओྗαʔϏε • ্࣭ͳϗςϧɾཱྀؗͷ༧αʔϏε • 20005݄Φʔϓϯͷ15ࡀ
Ұٳ.com KPI (2015.03) • ձһ: 400ສ+ • ϗςϧ/ཱྀؗ: 2,600ࢪઃ+ •
ؒൢചࣨ: 189ສࣨ+
͓ྡ͞·
࠾༻ٕज़ / Tools
࠾༻ٕज़ / Tools • ASP.NET WebForms/MVC (VB/C#) • IIS, SQLServer,
Solr • Sass, Compass • GitHub Enterprise • nxlog, Fluentd, Elasticsearch, Google Big Query • Jenkins, Selenium WebDriver • NewRelic, Kibana, Bugsnag • Redmine, Trello, Slack, Hubot
࠾༻ٕज़ / Tools (2લ) • ASP.NET WebForms/MVC (VB/C#) • IIS,
SQLServer, Solr • Sass, Compass • GitHub Enterprise • nxlog, Fluentd, Elasticsearch, Google Big Query • Jenkins, Selenium WebDriver • NewRelic, Kibana, Bugsnag • Redmine, Trello, Slack, Hubot
࠾༻ٕज़ / Tools (1લ) • ASP.NET WebForms/MVC (VB/C#) • IIS,
SQLServer, Solr • Sass, Compass • GitHub Enterprise • nxlog, Fluentd, Elasticsearch, Google Big Query • Jenkins, Selenium WebDriver • NewRelic, Kibana, Bugsnag • Redmine, Trello, Slack, Hubot
։ൃମ੍ɾ։ൃϑϩʔ
։ൃମ੍
։ൃମ੍(2016.3) αʔϏε։ൃ ΤϯδχΞ ໊ ج൫ܥΤϯδχΞ ໊ ΠϯϑϥΤϯδχΞ ໊ σβΠφʔ ໊
%FW %FT %FW 0QT Ϛʔέ एׯ໊ .LU
։ൃମ੍(2016.3) αʔϏε։ൃ ΤϯδχΞ ໊ ج൫ܥΤϯδχΞ ໊ ΠϯϑϥΤϯδχΞ ໊ σβΠφʔ ໊
%FW %FT %FW 0QT Ϛʔέ एׯ໊ .LU
σβΠφʔ3ͭͷάϧʔϓͰߏ ը૾ ੩తϖʔδ ΫϦΤΠςΟϒ σβΠϯ ίʔσΟϯά
ը૾ ੩తϖʔδ ΫϦΤΠςΟϒ σβΠϯ ίʔσΟϯά %FW σβΠφʔ3ͭͷϢχοτ ΤϯδχΞͱΑ͘ίϥϘ͢Δͷ ΫϦΤΠςΟϒσβΠϯͱίʔσΟϯά Λ͍ͯ͠ΔνʔϜ
σβΠφʔͱͷίϥϘϨʔγϣϯ
աڈ
ίϥϘϨʔγϣϯ͕ͮ͠Β͔ͬͨ • ։ൃڥ • ΤϯδχΞ֤ࣗϩʔΧϧͰ࡞ۀ • σβΠφʔڞ༻αʔό্Ͱશһ͕࡞ۀ • ڞ༻αʔόΤϯδχΞ͕ि࣍Ͱߋ৽ •
ڞ༻αʔόͷࢿࡐΤϯδχΞ͕ίϛοτ
چࣜͷίϥϘϨʔγϣϯ ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ڞ༻σβΠϯڥ 3FQPTJUPSZ
$PNNJU
ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ڞ༻σβΠϯڥ ߋ৽ ि࣍
3FQPTJUPSZ $PNNJU 6QEBUF چࣜͷίϥϘϨʔγϣϯ
ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ڞ༻σβΠϯڥ ߋ৽ ि࣍
3FQPTJUPSZ $PNNJU 6QEBUF σβΠϯ࡞ۀ چࣜͷίϥϘϨʔγϣϯ
ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ڞ༻σβΠϯڥ ߋ৽ ि࣍
3FQPTJUPSZ $PNNJU 6QEBUF ཧ$PNNJU چࣜͷίϥϘϨʔγϣϯ
ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ڞ༻σβΠϯڥ ߋ৽ ि࣍
3FQPTJUPSZ $PNNJU 6QEBUF ཧ$PNNJU 4UBHJOHڥ %FQMPZ چࣜͷίϥϘϨʔγϣϯ
ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ڞ༻σβΠϯڥ ߋ৽ ि࣍
3FQPTJUPSZ $PNNJU 6QEBUF ཧ$PNNJU 4UBHJOHڥ %FQMPZ ຊ൪ڥ چࣜͷίϥϘϨʔγϣϯ
ͭΒ͍
ίϥϘͷͨΊͷίετ͕ߴ͔ͬͨ • ΤϯδχΞ • ڞ༻σβΠϯڥͷϝϯς͠ΜͲ͍ • ڞ༻ͳͷͰϒϥϯν͚ͯ࡞ۀ͓ئ͍ͮ͠Β͍ • σβΠφʔ •
ڞ༻σβΠϯڥ͕ϝϯς͞Εͳ͍ͱ࡞ۀͰ͖ͳ͍ • σβΠφʔಉ࢜Ͱ࡞ۀ͕ڝ߹
ޡͬͨํʹߦ͖͔͚ͨ • ΤϯδχΞ • (… ͳΔ͘1ճͰσβΠϯܾΊͯΒ͓͏) • σβΠφʔ • (…
͜ͷલ࡞ۀͨ͋͠ͷը໘ɺ͏ͪΐ͍վળ Ͱ͖Δ͚Ͳڞ༻ڥߋ৽͞Εͯͳ͍͠ɺདྷि ݴ͍͍͔͑)
ޡͬͨํʹߦ͖͔͚ͨ • ΤϯδχΞ • (… ͳΔ͘1ճͰσβΠϯܾΊͯΒ͓͏) • σβΠφʔ • (…
͜ͷલ࡞ۀͨ͋͠ͷը໘ɺ͏ͪΐ͍վળ Ͱ͖Δ͚Ͳڞ༻ڥߋ৽͞Εͯͳ͍͠ɺདྷि ݴ͍͍͔͑) ΤϯδχΞͱσβΠφʔͷڑ͕ ԕ͔ͬͨ
ޡͬͨํʹߦ͖͔͚ͨ • ΤϯδχΞ • (… ͳΔ͘1ճͰσβΠϯܾΊͯΒ͓͏) • σβΠφʔ • (…
͜ͷલ࡞ۀͨ͋͠ͷը໘ɺ͏ͪΐ͍վળ Ͱ͖Δ͚Ͳڞ༻ڥߋ৽͞Εͯͳ͍͠ɺདྷि ݴ͍͍͔͑) ͜ΕͰϢʔβʹ ՁΛૣ͘ಧ͚ΒΕͳ͍
None
σβΠφʔGitHub FlowͰ • ࡞ۀڥɺϫʔΫϑϩʔΛΤϯδχΞͱἧ͑ͨ • ΤϯδχΞͱಉ༷ʹϩʔΧϧʹ։ൃڥΛඋ (ڥߏஙͱ࠷৽ԽɺϏϧυͳͲࣗಈԽ) • σβΠφʔ։ൃ༻ϒϥϯνͰ࡞ۀ •
ϓϧϦΫ্ͰίϥϘϨʔγϣϯ
σβΠϯ࡞ۀͷϒϥϯνઓུ NBTUFS EYYYY EZZZZ EYYYY EYYYY EZZZZ EZZZZ DIFDLPVU DIFDLPVU
NFSHF 1VMM3FRVFTU NFSHF 1VMM3FRVFTU 4UBHJOH
ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ϩʔΧϧ ڥ 3FQPTJUPSZ
$PNNJU1VTI $IFDLPVU σβΠϯ࡞ۀ ΤϯδχΞͱͷίϥϘϨʔγϣϯ $PNNJU1VTI 4UBHJOHڥ ຊ൪ڥ %FQMPZ
࣮ࡍͷϓϧϦΫྫ
࣮ࡍͷϓϧϦΫྫ
࣮ࡍͷϓϧϦΫྫ
ಓͳྗ • Gitʹ׳ΕͯΒ͏ͨΊ • σβΠφʔ͚ͷࣾϫʔΫγϣοϓ • ಋೖ࣌ΦϯαΠτͰϑϧαϙʔτ • ಋೖޙʹ;Γ͔͑Γ
Sass
Sassಋೖͷഎܠ • ϗςϧɾཱྀؗΛѻ͏ Ұٳ.com • ϏδωεϗςϧΛѻ͏Ұٳ.com Ϗδωε
͓ޓ͍ͭΒ͔ͬͨ • ΤϯδχΞ • ϏϋΠϯυίʔυʹுΓ͍ͨۀϩδοΫͷ ॏෳ • σβΠφʔ • ྨࣅը໘ͷଘࡏ(CSSҰ෦Λআ͍ͯॏෳ)
ͭΒ͍
ϩδοΫ౷߹ʴSassಋೖ • ΤϯδχΞ • ϩδοΫ౷߹ͯ͠ϏϋΠϯυίʔυΛ1ͭʹ • σβΠφʔ • Sassಋೖͯ͠ޮԽɾߏԽ
׳ΕͯΒ͏ • Sassಋೖܦݧͷ͋ΔσβΠφʔओಋ • ߨٛࣜͷηϛφʔ • ΤϯδχΞϑΥϩʔ • Sass࡞ۀڥͳΔࣗ͘ಈԽ
લਐதʹࣄނ
None
None
ϩʔΧϧڥͰCSSޮ͔ͳ͍
߄ͯͯϏϧυόον͍͔͚ରԠ
Try&ErrorͰΞΫγϣϯܧଓ • ΤϯδχΞɺσβΠφʔͷʑͷෆຬΛΩϟον Ξοϓ • ղܾࡦΛߟ͑ͯTry&Error • ໎Λ͔͚Δ͜ͱ͋Δ͚Ͳલਐͯ͠·͢
ϚʔέςΟϯάɺCSͱͷ ίϥϘϨʔγϣϯ
աڈ
ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ϩʔΧϧ ڥ 3FQPTJUPSZ
$PNNJU1VTI $IFDLPVU σβΠϯ࡞ۀ GitಋೖޙͷϫʔΫϑϩʔ(લड़) $PNNJU1VTI 4UBHJOHڥ %FQMPZ
ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ϩʔΧϧ ڥ σβΠϯ࡞ۀ
ϚʔέςΟϯά / CSͷσϞ#1 ର໘ͰϚʔέςΟϯά $4ʹ͚ͯσϞ
ϩʔΧϧ ڥ ։ൃ ςετ σβΠϯ ϦϦʔε ݕূ ϩʔΧϧ ڥ 3FQPTJUPSZ
$PNNJU1VTI $IFDLPVU σβΠϯ࡞ۀ $PNNJU1VTI 4UBHJOHڥ %FQMPZ 4UBHJOHσϓϩΠޙʹ ϚʔέςΟϯά $4ϝϯόʔʹσϞ ϚʔέςΟϯά / CSͷσϞ#2
ίϥϘϨʔγϣϯ͕ͮ͠Β͔ͬͨ • ର໘ͰͷϨϏϡʔɾσϞ • ඇಉظʹݟͯΒ͑ͳ͍ • StagingσϓϩΠޙͷϨϏϡʔɾσϞ • λΠϛϯάతʹ͍
ίϥϘϨʔγϣϯ͕ͮ͠Β͔ͬͨ • ڞ௨ͷΈ • ςετσʔλ͕ΠϚΠν • ର໘ͰͷϨϏϡʔɾσϞ • ඇಉظʹݟͯΒ͑ͳ͍ •
StagingσϓϩΠޙͷϨϏϡʔɾσϞ • λΠϛϯάతʹ͍ ඇಉظʹ masterʹmerge͢Δલʹ ϨϏϡʔɾσϞ͍ͨ͠
σϞɾϨϏϡʔڥ
σϞɾϨϏϡʔڥ • ࡞ۀϒϥϯνΛࢦఆͯ͠σϓϩΠ • Webը໘͔Βϒϥϯν໊Λࢦఆͯ͠Ϙλϯ1ൃ • ϩʔΧϧ։ൃڥͱඇಉظʹ࡞ΕΔ • ίʔυϨϏϡʔʹԊ͑ͨΓɺΤϯδχΞҎ֎ (ϚʔέςΟϯάɾCSϝϯόʔ)ʹσϞͨ͠Γ
None
σϞ༻ڥͱͯ͠σϓϩΠͯ͠ ϓϧϦΫͰΓͱΓ
ίϥϘϨʔγϣϯ͕ͮ͠Β͔ͬͨ • ର໘ͰͷϨϏϡʔɾσϞ • ඇಉظʹݟͯΒ͑ͳ͍ • StagingσϓϩΠޙͷϨϏϡʔɾσϞ • λΠϛϯάతʹ͍
·ͱΊ • ϢʔβʹՁΛఏڙ͢ΔʹίϥϘϨʔγϣϯ͕େࣄ • ͓ޓ͍ͷΈ৳ͼ͠Ζ • ίϥϘ͢Δ૬खʹาΈدΔ • ΈͰղܾͰ͖Δ෦ҙ֎ͱଟ͍ •
վળͷ༨·ͩ·ͩ͋Δ • ଓ͖·ͨͲ͔͜Ͱ͓͍ͤͯͩ͘͞͞ʂ
ଓ͍ͯۙͰͷϦϓϨΠε ʹΑΔࣄྫΛ͝հ͠·͢ (ότϯλον)