Gon gem. For RDRC 2013, June 7

1. Alex Gaziev’s GEM GON @gazay (github, twitter) Saturday, June 8, 13

2. Saturday, June 8, 13

3. SURFING JAZZ OSS :russia => ‘BALI’ Saturday, June 8, 13

4. Some of my works gon talks gon-sinatra tonik is hockeypuck ... Saturday, June 8, 13

5. A little about GON Send data from action to JS Started 2 years ago ~800 stars 50+ forks and PRs Saturday, June 8, 13

6. Data to JS: data-attribute Instance variable in controller Data-attribute in view Find tag and parse data attribute Saturday, June 8, 13

7. Data to JS: data-attr example controller # home_controller.rb def index # some logic @products = counted_products_collection end Saturday, June 8, 13

8. Data to JS: data-attr example view # views/home/index.html.erb ... some content <%= contant_tag “div”, id: “products”, data: { products: @products } do %> Loading products... <% end %> Saturday, June 8, 13

9. Data to JS: data-attr example JS # assets/javascripts/pages/home.js.coffee jQuery -> doSomething $(‘#products’).data(‘products’) Saturday, June 8, 13

10. Data to JS: javascript_tag Excess lines inside your views You should think what you write Saturday, June 8, 13

11. Data to JS: javascript_tag view # views/home/index.html.erb ... some content <%= javascript_tag do %> window.prodsURL = “<%=j products_url %>” window.prods = <%=raw @prods.to_json %> <% end %> Saturday, June 8, 13

12. Data to JS: javascript_tag JS # assets/javascripts/pages/home.js.coffee jQuery -> doSomething prods Saturday, June 8, 13

14. Data to JS GON Views step - once (perfect - in layout) Don’t have to think about escaping Stored uniq data per request Saturday, June 8, 13

15. Data to JS: GON example controller # home_controller.rb def index # some logic gon.products = counted_collection gon.products_url = products_url end Saturday, June 8, 13

16. Data to JS: GON example view # views/layouts/layout.html.erb <head> <%= include_gon(options) %> ... your js, css etc Saturday, June 8, 13

17. Data to JS: GON example JS # assets/javascripts/pages/home.js.coffee jQuery -> doSomething gon.products Saturday, June 8, 13

18. Usual ways: cons Escaping ( “</script><script>evil()</ script>”) Excess lines in your views Search for tag and parse attributes Views step Saturday, June 8, 13

19. GON: pros Automatically escape and transform to_json all data What you write in action – you’ll get in JS Should modify views once Saturday, June 8, 13

20. GON. Next versions Generate json with template engines Share data between requests Renew data in JS gon easy way Saturday, June 8, 13

21. GON RABL and jBuilder Success! Screencast Ruby Weekly More users => more PRs Saturday, June 8, 13

22. GON, RABL and jBuilder why so cool? All power of RABL and jBuilder Clean your controller new way Render multiple templates with GON Saturday, June 8, 13

23. GON and RABL multi templates # home_controller.rb def index gon.rabl ‘path_to_temlpate1’, as: ‘posts’ gon.rabl ‘path_to_template2’, as: ‘users’ gon.rabl ‘path_to_template3’, as: ‘admins’ gon.rabl # app/views/home/index.rabl end Saturday, June 8, 13

24. GON and jBuilder problems jBuilder rendering ﬂow Metaprogramming Whole environment for eval Saturday, June 8, 13

26. GON Global Share data application-wide Initial data Change settings everywhere by event Saturday, June 8, 13

27. GON Global init data example # conﬁg/initializers/gon.rb Gon.global.pictures_per_user = 4 # app/assets/javascripts/imageboard.js.coffee setLimitToUser = gon.global.pictures_per_request Saturday, June 8, 13

28. GON Global change data example # app/model/user.rb after_save :change_users_limit def change_users_limit if User.count > 1000 Gon.global.pictures_per_request = 3 end end Saturday, June 8, 13

29. GON watch Renew data for variable No excess LOC Use current state of action Saturday, June 8, 13

30. GON watch: how it works # home_controller.rb def index num = User.count * factor + params[:some].to_i gon.watch.pictures_per_request = num gon.watch.other_num = num * factor2 end Saturday, June 8, 13

31. GON watch: how it works # layout.html.erb <head> <%= include_gon(watch: true) %> ... Saturday, June 8, 13

32. GON watch: how it works # home_index.js.coffee renewLimit = (count) -> $(‘#limit-counter’).text(count) gon.watch(‘pictures_per_request’, interval: 1000, renewLimit) Saturday, June 8, 13

33. GON watch example Saturday, June 8, 13

34. Thank you! Any questions? http://github.com/gazay/gon Saturday, June 8, 13

Gon gem. For RDRC 2013, June 7

Gon gem. For RDRC 2013, June 7

Recommended

More Related Content

Similar to Gon gem. For RDRC 2013, June 7

Similar to Gon gem. For RDRC 2013, June 7(20)

Recently uploaded

Recently uploaded(20)

Gon gem. For RDRC 2013, June 7