https://shuuu-mai.connpass.com/event/103940/ での発表スライドです。

1. Rails
2018/11/06 Hiroaki Ninomiya
Ruby on Rails

2. • Hiroaki Ninomiya (@treby006)
• Vue.js, AWS(ECS, EMR), Go
• Repro
•

4. ( )
• (2013 ) (PHP)
• 2015 (Rails)
• 2016 (Rails, Django)
• 2017 Repro (Rails)

6. DAU
/day Push

7. https://d1.awsstatic.com/events/jp/2017/summit/devday/D3T7-6.pdf

8. https://d1.awsstatic.com/events/jp/2017/summit/devday/D3T7-6.pdf

9. Repro Tech Meetup
• 12/4( ) 19:30 Repro
•

10. Frontend Conference Fukuoka
• 12/8( ) / 40
• https://frontend-conf.fukuoka.jp/

11. Agenda
• Rails-
•
•

12. Agenda
•
•
•
•
•

13. !

14. Rails

15. Rails
1. 1 (2017 )
2. 2 (2016 )
3. 3 (2015 )
4. 4 (2014 )
5.

16. Rails Release
• v5.1.0(2017/04): Webpack
• v5.0.0(2016/07): Action Cable / Rails API
• v4.2.0(2014/12)
• v4.0.0(2013/06)
• v3.1.0(2012/01): Asset Pipeline

17. Rails

19. :

20. :

21. 2015, 2016

22. Rails 4 5

23. Rails4 (3,4 )
•
• Sprockets(Asset Pipeline)
• jQuery
• CoffeeScript
• Rails JavaScript
• rails-assets

24. Rails4 Gemfile
source 'https://rubygems.org'
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.0.2'
:
:
# Use CoffeeScript for .js.coffee assets and views
gem 'coffee-rails', '~> 4.0.0'
# Use jquery as the JavaScript library
gem 'jquery-rails'

25. Rails4
$ ->
$btn = $("[data-toggle='backToTop']")
$btn.hide()
$(window).scroll ->
if window.scrollY > 100
$btn.fadeIn()
else
$btn.fadeOut()
$btn.on 'click', (e) ->
$('html,body').animate({ scrollTop: 0 }, 500)

26. Rails5 ( 1,2 )
•
• Webpack / Browserify
• React / Vue.js
• Flux
• ESNext AltJS
• Rails JavaScript

27. Rails5 Gemfile
gem "rails", "5.2.0"
:
:
gem "sass", "3.4.16"
# JS translation generator
gem "i18n-js", require: false
group :assets do
:
:
gem "sassc-rails"
gem "browserify-rails"
:
end

28. Rails5
import cookie from 'utils/cookie';
import Deactivater from 'mixins/deactivater';
export default {
mixins: [Deactivater],
data() {
return {
expanded: true,
appListShown: false,
};
},
methods: {
toggleAppList() {
this.appListShown = !this.appListShown;
},
closeAppList() {
this.appListShown = false;
},
:
}
:
};

29. Rails JS
Rails JS

30. Rails Release
• v5.1.0(2017/04)
!
Repro
• v5.0.0(2016/07): Action Cable / Rails API
• v4.2.0(2014/12)
• v4.0.0(2013/06)
"
Repro
• v3.1.0(2012/01): Asset Pipeline

31. Rails

33. Rails
• assets
•
• jQuery
• CoffeeScript ESNext / AltJS

34. •
•
•
•
( )

35. •
•
•
•

38. • Qiita Rails
• Rails

39. •
!
• PR
•
•
•

40. Repro
•
• Slack / GitHub / esa
•
•

41. • Repro
• Vuex
• or
•
• package : npm or yarn

42. esa

43. esa

44. esa

45. esa
Repro

47. • ( )
• 30
•
•
•
•

48. https://speakerdeck.com/joker1007/realworld-
domain-model-on-rails

53. • Rails
• Rails JS Rails
JS
• Rails

54. •
•
•
•

55. Happy Hacking!!