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
Rails3で作り始めたアプリケーションをちょっとずつ改善してゆく道のり
Search
katryo
September 21, 2014
Programming
3
1.9k
Rails3で作り始めたアプリケーションをちょっとずつ改善してゆく道のり
#rubyhiroba の生活発表会で話した内容です
katryo
September 21, 2014
Tweet
Share
More Decks by katryo
See All by katryo
How to create an automated test suite for the Chromium based app and the Unity app
katryo
0
6.6k
Denkinovelをどうして作り続けているのか
katryo
0
2.2k
Sprockets絶ちに挑戦した
katryo
4
1.8k
業務で使えるGolang
katryo
3
1.7k
Railsアプリの運営とQOL爆アゲアイテム
katryo
0
380
Golang完全初心者がチュートリアルを完了させればなにができるようになるか
katryo
2
3.8k
Other Decks in Programming
See All in Programming
Ruby メモリ管理 プログラミング
megmogmog1965
0
130
CSC307 Lecture 11
javiergs
PRO
0
240
DynamoDB コスト最適化っぽいことの基本 with Terraform
kuro_kurorrr
2
250
最近追加した型の紹介とその振り返り
aki19035vc
0
180
MIERUNE BBQにおけるユーザー中心設計()
mierune
PRO
1
110
AWSでゲームサーバーを運用! Amazon GameLiftのお話
iriikeita
0
200
企業向け生成AIアプリの 開発から得られた知見
takaakikakei
0
310
DMMプラットフォームにおけるTiDBの導入から運用まで
pospome
7
3k
AWS CDKにおける「再利用性」を考える / aws-cdk-reusability
gotok365
6
1.3k
TiDB Serverless ~理想のServerless DBを考える~
soso_15315
1
160
ドメイン駆動設計の実践
masuda220
PRO
19
5.2k
Polarsの成長: v0.14からv1.0までの変遷と今後の展望
zerebom
1
350
Featured
See All Featured
Optimising Largest Contentful Paint
csswizardry
18
2.6k
Building Better People: How to give real-time feedback that sticks.
wjessup
357
18k
Building a Modern Day E-commerce SEO Strategy
aleyda
25
6.7k
Happy Clients
brianwarren
94
6.6k
Code Review Best Practice
trishagee
58
16k
Fireside Chat
paigeccino
25
2.8k
How STYLIGHT went responsive
nonsquared
93
5k
Mobile First: as difficult as doing things right
swwweet
219
8.8k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
228
16k
Building an army of robots
kneath
301
42k
Build your cross-platform service in a week with App Engine
jlugia
227
17k
Teambox: Starting and Learning
jrom
130
8.6k
Transcript
Rails3Ͱ࡞Γ࢝Ίͨ ΞϓϦέʔγϣϯΛ ͪΐͬͱͣͭվળͯ͠Ώ͘ ಓͷΓ katryo
࣍ 1. ࣗݾհ 2. Denkinovelͷհ 3. DenkinovelΛ࡞Δ·ͰͷܦҢ 4. DenkinovelͷΞοϓσʔτͷܦྺ 5.
ಘͨݟ·ͱΊ
1. ࣗݾհ
katryo • झຯͱࣄͰWebΞϓϦέʔγϣϯ࡞ͬͯ·͢ • ࣄͰPerlॻ͍ͯ·͢(´ɾωɾ`) • Rubyେ͖ʂ Ұ൪͖ͳLLͰ͢ʂ 5XJUUFSͷΞΠίϯ ࣗ࡞ϊϕϧήʔϜͷΩϟϥΫλʔ
WebΞϓϦέʔγϣϯΛ ࡞ΓɺΞοϓσʔτ͠ଓ͚Δ͜ͱͰ ಘΒΕͨݟʹ͍ͭͯ͠·͢ɻ
2. Denkinovelͷհ
ಈ͘খઆߘαΠτ Denkinovel
Denkinovelͱ • ԻָͱഎܠͱޮՌԻͷԋग़͕ग़དྷΔখઆߘαΠτ • ݸਓͰ։ൃӡӦ • 201211݄ʹӡӦ։࢝ • ͘͞ΒVPSͰಈ͍͍ͯΔ •
Rails4ʢݱࡏʣͰ։ൃ • ࡞ߘ500͘Β͍
σϞ
Denkinovelͷ͘͠Έ • ϊϕϧຊจจࣈྻͷ··DBʹอଘ • αʔόଆͰຊจΛJSONʹม • ͋ͱશ෦ɺJSONΛड͚औͬͨΫϥΠΞϯτ ଆ͕͏·͍͜ͱΔ
ΫϥΠΞϯτଆͰ༻͍ͯ͠Δ ϥΠϒϥϦ • Backbone.js • JSʹ͍͍͢ߏΛ༩͑Δ • pushStateͰͷrouterඋ͑Δ • ΦϒβʔόʔύλʔϯͰॻ͚ΔͷͰɺ
DenkinovelͷΑ͏ʹɺΫϥΠΞϯτ͕ෳͷ ঢ়ଶΛͭΞϓϦέʔγϣϯʹ͍͍ͯΔ
None
Ϣʔβʔͷೖྗ͢ΔςΩετ • ຊจͷதʹMarkdownΈ͍ͨͳλά Λॻ͖ೖΕΔ • [bgm happiness]ͱ͔ • ࣮ࡍͷྫ •
ಀ͛Δগঁͱ͋ͨ͠ͷ 1 • http://denkinovel.com/stories/662/open
None
None
None
1ϖʔδͣͭͷJSONʹม
None
දࣔɾ࠶ੜ • JSON͔Β1ϖʔδͣͭදࣔɾ࠶ੜ͢Δ • ϖʔδ͕Ί͘ΒΕΔͨͼɺBGMͳͲΛΓସ ͑Δ͔அ͢Δ • ͠લϖʔδͱҧ͏BGM͕ࢦఆ͞Ε͍ͯΔ ͳΒΓସ͑Δ
ϊϕϧ࡞σϞ
3. DenkinovelΛ࡞Δ·Ͱͷ ܦҢ
Denkinovelॳظܕ • େֶӃͷतۀ՝ɿRailsΞϓϦΛ࡞Δ͜ͱ • jQueryͰ༡ΜͰ͍ͨ • εΫϩʔϧҐஔʹ͋ΘͤͯഎܠΛม͑Δίʔ υΛݟ͚ͭͨ
ϒϩάͱΈ߹ΘͤͨΒ ໘ന͍ͷͰʁ
࣌ɺ࡞͍ͬͯͨWebαΠτ • ࣗ࡞ϊϕϧήʔϜͷWebαΠτͰڽͬͨԋग़ Λ͔ͨͬͨ͠ • ༧ࠂฤΛ࡞Γ͔ͨͬͨɻ • JavaScriptΛ͏·͑͘ɺWeb্Ͱ؆୯ͳ ԋग़͖ͭͷ༧ࠂฤ͕࡞ΕΔͷͰʁ
Denkinovelॳظܕ
ߨٛظؒऴྃޙվྑΛଓ͚ͨ • େֶͷ࡞αʔΫϧʹDenkinovelॳظܕΛ ͬͯΒͬͯΠϯλϏϡʔͨ͠ • ϒϩά෩ͷจষஔ͔Βɺ1ϖʔδ͝ͱͷஔ ʹมߋ
େֶͷֶԂࡇʹ͋Θͤͯެ։
ϒϩάʹహΛॻ͍ͨΒ ͯͳϒοΫϚʔΫ326USERS
͜ͷͱ͖ͷٕज़ྗ • DBͱ͔indexͱ͔Α͘Θ͔Βͳ͍ • γΣϧεΫϦϓτΛΒͳ͍ɻαʔόͰԿ͕ ى͍ͬͯ͜Δͷ͔Θ͔Βͳ͍ɻ • ΦϒδΣΫτࢦͱ͔Θ͔Βͳ͍ • ͔ͬͨͰ͢Ͷ……
ಘͨݟ • ͱΓ͋͑ͣ࡞ͬͯ͠·͓͏ • ਓʹݟͤΔ͜ͱ͕ՄೳʹͳΔ • ػೳՃɺվળͳͲɺਓʹݟͤΒΕΔΑ ͏ʹͳ͔ͬͯΒͰؒʹ߹͏
4. DenkinovelͷΞοϓσʔ τͷܦྺ
None
ϗετઌͷมߋ
ϗετઌҠߦͷܦҢ • ॳHerokuͰӡ༻ • ϨϙδτϦͷϑΝΠϧαΠζ੍ݶ (300MB) Λ ӽ͍͑ͯͨͷͰɺҠߦͤ͟ΔΛಘͳ͔ͬͨ • Ձ֨ͱਓؾ͔Β͘͞ΒVPSΛબ
• 2GBϓϥϯ
ϗετઌมߋ͚ͬ͜͏େม • DBɺυϝΠϯઃఆɺσϓϩΠखॱͷཱ֬…… • େͳ͜ͱ͍͍ͩͨRailsCasts͕ڭ͑ͯ͘Ε ͨ ༗ྉϓϥϯ͕Φεεϝɻ ͨͩ͠Ͱߋ৽ఀࢭɻ (P3BJMT͕ࢤΛड͚ܧ͍Ͱ͍Δʜʜʁ
ϗετઌมߋͰͬͨ͜ͱ • Ubuntu12.04ʹͯ͠ • HerokuͷpostgresʹೖͬͨσʔλΛVPSͷDBʹtaps gemͰೖΕ ͨΓ • CapistranoͰcap deployσϓϩΠͰ͖ΔΑ͏ʹͨ͠Γ
• VagrantͰstagingڥΛ࡞ͬͨΓ • ύεϫʔυΛڥมͱͯ͠ར༻Ͱ͖ΔΑ͏ʹͨ͠Γ • Qiitaʹॻ͍ͨͷͰಡΜͰ͍ͩ͘͞ http://qiita.com/katryo/items/f410916d5314dad2de96
ϗετઌมߋͰΘ͔ͬͨ͜ͱ • VPSͰͷΠϯϑϥཧɺ͔ͳΓ໘ • ษڧ͠ͳ͍ͱ͍͚ͳ͍͜ͱ͕ଟ͗͢Δ • ٯʹ͍͑ɺHerokuͱָͯ • ʮΞϓϦέʔγϣϯΛ࡞ͬͯެ։͢Δʯ͚ͩ ͳΒHerokuΛબͿ͖
Heroku, ͓͢͢Ίɻ
ChefͰͷαʔόཧ
Infrastructure as Code ྲྀߦͯ͠ΔΒ͍͠͠ɺͦΖͦΖΔ͔……
Chef͔ͳΓΊΜͲ͍ • DenkinovelͷαʔόChefͰཧ͍ͯ͠Δ • ͔͠͠Chef, ֶͿࣄ߲͕ଟ͗͢Δ • ݸਓͰগͷVPSΛ͏͚ͩͳΒɺਖ਼ʹ͍͏ͱ͓ ͢͢ΊͰ͖ͳ͍ •
࠷ۙItamaeͱ͔Ansibleͱ͔ɺखܰͳ͕ͭ͋Δ Β͍͠Ͱ͢Ͷ……ʢͬͨ͜ͱͳ͍ʣ
ݸਓͰͷαʔόཧ ͱΓ͋͑ͣख࡞ۀͰɻ ! ඞཁʹͳͬͨΒ Itamaeͱ͔Ansibleͱ͔͓͏
ґଘϥΠϒϥϦͷ Ξοϓσʔτ
bundle updateͰۤ࿑ͨ͠ͷ • Rails 3 => 4 • Strong parametersΛಓʹॻ͖͑
• Twitter Bootstrap 2 => 3 • HTMLλάͷΫϥεΛಓʹॻ͖͑ • CSSಓʹॻ͖͑
·ͱΊͯΞοϓσʔτ • Rails, Bootstrap, αʔόΛChefཧʹ͢ΔɺҎ ্ͷ͜ͱΛಉ࣌ʹਐΊͨ • ྃ·Ͱʹ8͔݄͔͔Γ·ͨ͠ • ಉ࣌ਐߦɺୡײΛಘΔ·Ͱͷো͕େ͖͍
• ಉ࣌ਐߦ͠ͳ͍΄͏͕͍͍Ͱ͢
ͦͦΞοϓσʔτ͖͢ͳ ͷ͔ʁ • ηΩϡϦςΟͷ͕ͳ͚Ε͠ͳͯ͘େ͖ͳແ ͍ɻ • ϥΠϒϥϦͷΞοϓσʔτʹ࣌ؒΛऔΒΕΔͷຊస • ͋ͱͰߟ͑ΔͱɺDenkinovelͷgemΞοϓσʔτ (BootstrapͳͲ)
ɺࣗݾຬͰ͍ͬͯͨͷ͕ଟ͔ͬ ͨɻ • ͔͠͠……ɻ
ͬͺΓΞοϓσʔτ͖͢ • ػೳతͳվྑΑΓɺʮ͍͔ͭݹ͍όʔδϣ ϯ͕Γ͞ΕΔΜ͡Όͳ͍͔ʯͱ͍͏ෆ҆ Λͳͤ͘Δͷ͕େ͖͍ • Rubyք۾ɺಛʹɺݹ͍ͷͲΜͲΜΓ ࣺͯΒΕΔ • جຊతʹͲΜͲΜΞοϓσʔτ͖͢
ؾܰʹΞοϓσʔτ͖͢Ͱͳ ͍ͷ • Twitter BootstrapͷΑ͏ʹɺΞοϓσʔτͨ͠ͱ ͜ΖͰՁ͕খ͍͞ͷ • HTMLɺCSSʹؔΘΔgemɺؾܰʹΞοϓσʔτ ͢ΔͱඍົʹσβΠϯ͕มΘͬͨΓ͢ΔͷͰΞο ϓσʔτ͖͢Ͱͳ͍
• HTMLCSSʹؔΘΔgemɺͦͦɺgemͱ ͯ͠ཧ͖͢Ͱͳ͍͔͠Εͳ͍ʢޙड़ʣ
JavaScriptͱؔΘΔ gem
JSؔ࿈ͷgemফͦ͏ • JS͕བྷΉgemΘͳ͍΄͏͕͍͍ • gemRubyͰ͔͑͠ͳ͍ɻ͔͠͠JavaScriptϥΠϒϥϦɺ αʔόαΠυͰͲΜͳݴޠΛ࠾༻͠Α͏ͱɺΫϥΠΞϯτଆͰ ͑Δ • JSͷཧJSͷྲّྀͰΔ͖ɻΑΓదͨ͠ΤίγεςϜ͕ͬ ͍ͯΔͷͰɻ
• backbone-railsͱ͔ࠓ͙ࣺͯ͢Δ͖ • gemϝϯς͞Εͳ͘ͳΔ͔
JSͲ͏ཧ͢Δʁ • bowerͱ͔Ͱཧ͠Α͏ • SprocketsRails͔ͩΒͱΓ͋͑ͣͬͯ·͢ • ͰɺSprockets͕ݪҼͰෆ۩߹͕ൃੜ͢Δ͜ͱ ͋Δ • ͔ͨ͠͠ΒɺSprocketsࣺͯͨํ͕͍͍ͷ͔
͠Εͳ͍
WebσβΠϯ
ςϯϓϨʔτΤϯδϯ • ERB͔ΒSlimʹҠߦ • Πϯσϯτ͕֊Λҙຯ͢Δ • هड़ྔ͕গͳ͘ɺཧղ͍͢͠ • ཁ͢ΔʹBetter Haml
• ͪͳΈʹϊϕϧ࠶ੜը໘ͰɺUnderscore.jsͷςϯ ϓϨʔτͰϖʔδ༰ॻ͖͑
ͱΓ͋͑ͣTwitterBootstrapͰ • CSSϑϨʔϜϫʔΫଟ͍ • Pure, gumby, Foundation,… • TwitterBootstrap͕࠷ΘΕ͍ͯΔ •
ʮ͋ͬɺ͜ͷαΠτBootstrapͩʯ͕͋ΓಘΔ • ͰɺͦΕ͕͔ʁ
DenkinovelͷΓ͔ͨ • ҰൠϢʔβʔTwitterBootstrapͳͲΒͳ͍ • ߴʹ։ൃͰ͖Εͳ͍ • TwitterBootstrapCSS, JSͷίϯϙʔωϯτͷू ߹ମɻଞͷCSSϑϨʔϜϫʔΫͱൺֱͯ͠େن ɻ
• JSͷϥΠϒϥϦΛ୳͞ͳͯ͘ࡁΉ
WebσβΠϯͷվྑ • ࡞ΛฒΔϨΠΞτ • λΠϧܕ => Ϧετܕ ! ! •
࣌ɺλΠϧܕʹฒΔσβΠϯ͕ྲྀߦ͍ͬͯͨɻ • jQuery-masonryͱ͍͏ศརϥΠϒϥϦ͕͋ͬͨ
͋ΔਓʹσβΠϯΛࢦఠͯ͠ Βͬͨ • จষϞϊԣͷ΄͏͕ ݟ͍͢ • ϊϕϧຊฤͱڞ௨ͷงғ ؾʹͨ͠ํ͕͍͍
ࣾษڧձͷࡐͱͯ͠ࢦఠͯ͠Βͬͨ
Before After
! WebΤϯδχΞͷͨΊͷ WebαʔϏεσβΠϯ࣮ફߨ࠲ https://speakerdeck.com/ken_c_lo/ webenziniafalsetamefalsewebsabisud ezainshi-jian-jiang-zuo Λݟ͍ͯͩ͘͞ʂ
োରԠ
όάϑΟοΫε • ςετΛॻ͍ͯɺόάग़ͯ͘Δ • αʔόʔΤϥʔ͕ൃੜͨ͠ͱ͖ϝʔϧͰ௨ ͢ΔΑ͏ʹ͍ͯ͠Δ • exception_notification gem ͬͯΔ
• Errbitʢͬͯͳ͍ʣ͍͍Β͍͠Ͱ͢Ͷ……
TwitterͰόάϨϙʔτड • όάϨϙʔτTwitterܦ༝ͰདྷΔ͜ͱ͕ଟ͍ • denkinovelͷTwitterΞΧϯτͰόάϨϙʔτ ʹରԠ͢Δ • ϒϥβɺOSͳͲͷڥΛ͑ͯ͜ͳ͍ਓ͕ ΄ͱΜͲ(´ɾωɾ`) ຖճʮ͓͍ͷϒϥβͱ
OSͳΜͰ͔͢ʯͱฉ͍ͯΔ
؊Λྫྷͨ͠ॠؒ • ChromeҎ֎ͷϒϥβͰද่͕ࣔΕ͍ͯͨ͜ͱ ʹ1िؒޙʹؾ͍ͮͨ • εϚʔτϑΥϯͰͷԻָ࠶ੜ͕1िؒ΄ͲͰ͖ͯ ͍ͳ͍ͱؾ͍ͮͨͱ͖ • ಛఆϖʔδʹΞΫηε͢Δͱɺ͋ΔҰఆͷ֬Ͱ αʔόʔΤϥʔ͕ൃੜ͢Δෆ۩߹͕ͤͳ͍ͱ͖
োରԠͰಘͨݟ • αʔόʔΤϥʔग़ͯͳΜͱ͔ͳΔ • ͳͷͰɺڪ͕ΒͣʹͲΜͲΜσϓϩΠ͍ͯ͠ ͍ • োରԠ૭ޱ࡞͓ͬͯ͜͏ • ϝʔϧɺTwitterɺ͓͍߹ͤϑΥʔϜ
ςετ
Denkinovelͷςετํ • ModelͷϢχοτςετͰ͖Δ͚ͩॻ͘ • RSpecͬͯΔɻ͚ͲࠓޙPower AssertΛminitestͰ Δͷ͕Αͦ͞͏……ʁ • ςετΛॻ͖ʹ͍͘ͱ͜ΖʢS3ͱͷ࿈ܞͳͲʣɺͨ·ʹ ॻ͔ͳ͍͜ͱ͋Δ
• Controllerςετ΄΅ॻ͔ͳ͍ɻ͔ΘΓʹCapybaraͰͷ E2Eςετ͕͋ΔͷͰେৎͩͱࢥ͏
ͦͷ΄͔ͷۤ࿑
ۤ࿑͍ͬͺ͍ • HTML5ͷaudio༷ • ը૾ɾԻָϓϦϩʔυ • ෳϒϥβʢεϚʔτϑΥϯʣରԠ • νϡʔτϦΞϧ࡞
5. ಘͨݟ·ͱΊ
ݟ • ໘ࣄ͚ͯ͞ɺͱΓ͋͑ͣ࡞ͬͯherokuͱ ͔Ͱָʹެ։͠Α͏ • ͍͍ͩͨͷ͜ͱɺࢥ͍࣮ͬͯߦͯ͠Έͯ େৎ • ϥΠϒϥϦͲΜͲΜΞοϓσʔτ͍͚ͯ͠ Ε……͍͍ͳ……
6. ͏Ε͔ͬͨ͜͠ͱ
ͨ·ʹײ͕ݟ͔ͭΔ
͔ͩΒɺ ߘ͕͋Δͱ͏Ε͍͠ʂʂʂ DenkinovelɺϊϕϧήʔϜΑΓָ͚ͩͲɺ খઆΑΓߘͷϋʔυϧ͕ߴ͍
ϑΝϯ͕Ͱ͖ͨΓ͢Δ Denkinovelͷࢠ (pdf) Λ࡞ͬͯ͘Ε·ͨ͠
શମ·ͱΊ • ָʹϊϕϧήʔϜΈ͍ͨͳখઆΛߘͰ͖Δ αΠτΛ࡞Γ·ͨ͠ • ݟΛಘ·ͨ͠ • ۤ࿑͚ͨ͠ΕͲخ͍͜͠ͱ͋Γ·ͨ͠
͓·͚
DenkinovelͷTips • jͱkͰϖʔδૹΓͰ͖Δ • ViϞʔυ͕ඪ४Ͱ͢ • EmacsϞʔυͳ͍Ͱ͢ • ेࣈΩʔͷˡͱˠͰϖʔδૹΓͰ͖Δ
εϚʔτϑΥϯΞϓϦ • Denkinovel for iOSΛ࡞Γ·͢ • Swift࢝Ί·ͨ͠ • Object-Cͪΐͬͱͬͯ·ͨ͠…… •
2͔݄ޙ͘Β͍Λϝυʹެ։͍ͨ͠ • Androidͪΐͬͱ͋ͱ·Θ͠Ͱ