Rails5 APIではじめるSPA開発

Transcript

1. Rails5Ͱߦ͏SPA։ൃ Roppongi.rb #1
2. ࣗݾ঺հ —໊લ : ാத༔࡞ —Twitter : @hatappi —ձࣾ : גࣜձࣾSpeee —໾৬ : ίʔώʔ܎
4. SPAͱ͸ʁ
5. SinglePageApplicaton ӳޠͦͷ··Ͱ୯ҰϖʔδͰߏ੒͞ΕͨΞϓϦέʔγϣ ϯ ࠷ॳϖʔδશମΛಡΈࠐΜͩޙ͸javascriptͰඞཁͳ෦ ෼Λߋ৽͍ͯ͘͠ σʔλ࿈ܞ͸Ajax΍WebSocketʹͯߦ͏
6. Πϯϑϥߏ੒
8. GCP (GoogleCloudPlatform) —CDNΛ࢖͏ࡍʹ͸AWSͩͱ S3+CloudFront GCPͰ͸StorageʹΞοϓϩʔ υͯ͠ACLͷઃఆΛมߋ͢Ε͹ ެ։Ͱ͖Δ —੩తwebαΠτΛϗεςΟϯά Ͱ͖ΔͷͰαʔόʔϨεӡ༻͕ Մೳ!
9. Angular2 Googleͷ։ൃ͢ΔJavascriptͷϑ ϨʔϜϫʔΫ ݱঢ়͸rc4 React͕ViewͷίϯϙʔωϯτΛ ఏڙ͢Δͷʹରͯ͠MVCΛఏڙ͢ ΔϑϧελοΫͳϑϨʔϜϫʔΫ
10. Rails5ͷ࿩ ࠓ೔ͷϝΠϯ RubyͷwebΞϓϦέʔγϣϯɾϑ ϨʔϜϫʔΫ 7/1ʹrc͕ͱΕ͍ͯͭʹ5͕ϦϦʔ ε!
12. Rails5Ͱͷมߋ఺ —Action Cable —rakeλεΫΛrailsͰ࣮ߦ —turbolinks5 —sprockets3 —rails api
13. Rails5Ͱͷมߋ఺ —Action Cable —rakeλεΫΛrailsͰ࣮ߦ —turbolinks5 —sprockets3 —rails api <- ࠓ೔͸͜͜
14. Rails API ݩʑ͸gemͩͬͨrails-api͕RailsʹϚʔδ͞Εͨ —helper΍assets, views͕ͬͦ͝Γফ͑ͯΔ —cookieͱ͔session storeͷఆٛ΋ͳ͍ —config͔Βassetؔ࿈ͷ΋ͷ͕ͳ͘ͳ͍ͬͯΔ
15. γϯϓϧ!
16. Rails apiͷͱ͖ʹ͋ͨͬͨ՝୊ —view͕΄͘͠ͳͬͨΒ —CORS —Ϣʔβʔೝূ
17. Rails apiͷͱ͖ʹ͋ͨͬͨ՝୊ —view͕΄͘͠ͳͬͨΒ —CORS —Ϣʔβʔೝূ
18. ΍ͬͺΓView͕΄͍͠ɾɾ
19. View͸ޙ͔ΒͰ΋௥ՃͰ͖Δ ඞཁͳmiddlewareΛ௥Ճͯ͋͛͠Ε͹ݩͷඇAPIͷ Railsʹ͢Δ͜ͱ͸ग़དྷΔɻ ٯʹAPIʹ͢Δͷ͸͋Δ΋ͷΛ࡟আ͍͔ͯ͠ͳ͍ͱ͍͚ ͳ͍ͷͰ݁ߏେม!
20. Rails apiͷͱ͖ʹ͋ͨͬͨ՝୊ —view͕΄͘͠ͳͬͨΒ —CORS —Ϣʔβʔೝূ
21. CORSͱ͸?
22. CORS (Cross-Origin Resource Sharing) SameOriginPolicyʹΑΓXHRͱ͔ Ͱࠓ͍ΔαΠτͱผͷαΠτ͔Β σʔλΛಡΈࠐΉͱΤϥʔʹͳ Δɻ ͦΕΛڐՄ͞ΕͨαΠτʹରͯ͠ ͸OriginΛ͑ͯ͜ΞΫηε͑͞Δ ࢓૊Έ
23. rack-cors (https://github.com/cyu/rack-cors) originsͰڐՄ͢ΔϗετΛઃఆ '*'΋͍͚Δ͚Ͳຊ൪ʹ൓ө͢Δͱ͖͸஫ҙ Rails.application.config.middleware.insert_before 0, Rack::Cors do allow do origins 'roppongirb.com' resource '*', headers: :any, methods: [:get, :post, :put, :patch, :delete, :options, :head] end end
24. Rails apiͷͱ͖ʹ͋ͨͬͨ՝୊ —view͕΄͘͠ͳͬͨΒ —CORS —Ϣʔβʔೝূ
25. RailsApiͰ͸cookie΍ session͕ͦͬ͝ͱͳ͘ͳͬ ͯΔ!
26. cookieͰ͸ͳ͘tokenͰ؅ ཧͩ❗❗
28. ೝূॲཧࣗମ͸ GoogleOAuth2 Ͱߦ͍ͦͷޙτ ʔΫϯΛੜ੒
29. googleΛ࢖Θͣશ෦ࣗલͰߦ͏ͧͬͯํ —devise_token_auth deviseΛ࢖ͬͯRailsͰTokenBasedͷೝূΛߦ͏΋ ͷ —doorkeeper RailsͰOAuth2ͷϓϩύΠμʔΛ࢖͏ͨΊͷ΋ͷ
30. ·ͱΊ
31. ·ͱΊ —SPAා͘ͳ͍ —API modeʹͯ͠΋࠷ѱ໭ͤΔͷͰνϟϯϨϯδͯ͠ Έͯ΋ྑ͍͔΋ —turbolinksɺsprockets, coffeescriptͱ͍͏ݴ༿ʹർ Εͯ͠·ͬͨΒݕ౼ͯ͠΋ྑ͍͔΋