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

React+Webpackを利用したRailsアプリケーションをHerokuで本番運用する...

Yoshiki Iida
September 29, 2016
1.4k

 React+Webpackを利用したRailsアプリケーションをHerokuで本番運用するノウハウ

https://eventdots.jp/event/599919
「【クラウドワークス×クラスメソッド×ネクスト】『新サービス・技術に興味があるエンジニア向け勉強会 』今サービスづくりをするのに選びたい技術はこれだ。」登壇資料

Yoshiki Iida

September 29, 2016
Tweet

More Decks by Yoshiki Iida

Transcript

  1. SourceMapରԠ • Webpack͔ΒSourceMapΛੜ੒͢ΔΑ͏ʹͨ͠ • σϓϩΠͷࡍʹRollbarͱ࿈ܞ • ৄࡉ͸
 ΤϥʔϞχλϦϯάαʔϏε Rollbar ͱ

    GitHub Issue Λ ར༻ͨ͠ΤϥʔରԠϑϩʔ
 ʢhttp://engineer.crowdworks.jp/entry/2016/08/29/111434ʣ
  2. pumaʹ͍ͭͯ • ϚϧνϓϩηεɺϚϧνεϨουͰಈ͔ͤΔ ΞϓϦέʔγϣϯαʔόʔ • Herokuਪ঑
 Puma is Now the

    Recommended Ruby Webserver
 (https://devcenter.heroku.com/changelog-items/594)
  3. ·ͱΊ • ஌ݟθϩ͔ΒͰ΋Rails+React+Redux+Webpackߏ੒Ͱ
 ϓϩμΫτ͸࡞ΕΔ • ׳Ε͍ͯͳ͍ஈ֊Ͱ͸ৗʹߏ੒ΛٙͬͯઌΛݟਾ͑ͳ͕Β
 ։ൃͨ͠΄͏͕Αͦ͞͏ • ͱΓ͋͑ͣಈ͘Α͏ʹͳͬͨ΋ͷ͸ɺ·֦ͩுੑ΍ϝϯςφϯεੑͷߴ͍ ઃܭɾߏ଄ʹͳͬͯͳ͍Մೳੑେ

    • Ͱ΋ɺ΍Δͱ͖͸ࢥ͍੾ͬͯಋೖͯ͠΋ҙ֎ͱͳΜͱ͔ͳΔ • Heroku͸੍໿͕͋Δ͕ɺ্ཱ͔ͪ͛ΒετϨεͳ͘Πϯϑϥߏ ஙͰ͖Δʢͦͷ੍໿ͷதͰಈ͘ͱ͍͏ϝϦοτ΋ੜ·ΕΔʣ
  4. Q.
 ReactͱRailsͷ૬ੑͬͯඍົ͡Όͳ͍Ͱ͔͢ʁ SPAͱ͔ͩͱGoͱ͔ʹͨ͠΄͏͕Αͦ͞͏͡Όͳ͍Ͱ͔͢ʁ A. • ͦͷ௨Γͩͱࢥ͍·͢ɻαʔόʔαΠυ͕RailsͰ͋Δඞવੑ͸ͳ͘ɺ΍ΕΔ͔Ͳ͏͔ͩͱ ࢥ͍ͬͯ·͢ɻ • զʑͷ৔߹͸νʔϜϝϯόʔͷεΩϧηοτͱͯ͠Rails͕Ұ൪ࣄۀతʹίϛοτͰ͖Δ͔Β ͱ͍͏എܠ͕͋ΓɺͦͷதͰJavaScript΋ͳΜΒ͔ͷܗͰߏ଄Խ͍ͨ͠ͱ͍͏Ϟνϕʔγϣ

    ϯͰ͜ͷ૊Έ߹ΘͤΛબ୒͍ͯ͠·͢ɻ • SPAͰ͋Ε͹αʔόʔαΠυ͸׬શAPIͱͯ͠GoʹৼΓ੾Δͷ͸ਖ਼͍͠ͱࢥ͍·͕͢ɺͦΕ ͳΓͷ֮ޛ΋ඞཁʹͳͬͯ͘Δͱࢥ͍·͢ɻ
 (Ҿ༻) SPAͱ֮ޛ http://www.slideshare.net/teppeis/spa-66093931 • ࣄۀత੒Ռͱٕज़తʹΑ͍ϓϩμΫτ͔Ͳ͏͔͸τϨʔυΦϑʹͳΒ͟ΔΛಘͳ͍ঢ়گ΋͋ Δͱࢥ͍·͢ͷͰɺϓϩδΣΫτͦΕͧΕͰόϥϯεΛߟ͑ͯબ΂͹Α͍ͱߟ͍͑ͯ·͢ɻ
  5. Q.
 ৽نͩͱReact͍Ε΍͍͚͢Ͳطଘͷେ͖͘ͳͬͯ͠ ·ͬͨjQueryͷϦϓϨΠε͸΍ͬͺΓେมͰ͢ΑͶ A. • ͔ͨ͠ʹ৽نϓϩμΫτ͔ͩΒখ͘͞͸͡ΊΔͱ͍͏ߟ͑ํ͕ద༻Ͱ͖ͨͱ͍͏ ͜ͱ͸͋Δͱࢥ͍·͢ɻ • Ϋϥ΢υϫʔΫεͷຊମͷαʔϏε͸ංେԽͨ͠jQuery͕ଘࡏ͍ͯͯ͠ɺ͍ͭ͘ ͔͸vue.jsʹஔ͖׵͑ͨ෦෼͕͋Γ·͕͢ɺ΍͸ΓҠߦ͸೉͔ͬͨ͠Α͏Ͱ͢ɻ

    • ΍Δͱͨ͠Βػೳ୯ҐͰ͔͠ஔ͖׵͑ΒΕͳ͍ͱࢥ͏ͷͰɺ̍ϖʔδ͝ͱʹͰ͔ ͍ίϯϙʔωϯτ܈Λʮ͍͑΍ʯͰ࡞͍ͬͯ͘͜ͱʹͳΓͦ͏Ͱ͢Ͷ… • ͦͷͨΊʹ͸΍͸ΓFeature SpecͳΜͳΓͷE2EࢼݧͰಈ࡞୲อ্ͨ͠ͰਐΊͯ ͍͘ͷͩͱࢥ͍·͢ɻ