View Asset Pipeline Integration

Transcript

1. Asset Pipeline Integration Raphael Randschau w e l u s

   e G m b H Sunday, October 30, 11

2. current state Sunday, October 30, 11

3. our GOAL first visit Sunday, October 30, 11

4. our GOAL subsequent visits Sunday, October 30, 11

5. our GOAL view assembled on the client-side thin controllers fast

   page load times! less load! single-page application interesting things can be achieved: - 100% offline apps AppCache - Sunday, October 30, 11

6. welcome to the asset pipeline not build for view- construction

   write HTML yourself no Helper localization won’t do Sunday, October 30, 11

7. some problems rendering & templating engine ActionView::Helpers attribute binding localization

   authorization Sunday, October 30, 11

8. partial solutions haml_assets haml_handlebars_assets template engine Sunday, October 30, 11

9. partial solutions haml_assets haml_handlebars_assets = hbs_form_for :user do |f| =

   f.text_field :name template engine Sunday, October 30, 11

10. partial solutions haml_assets haml_handlebars_assets = hbs_form_for :user do |f| =

    f.text_field :name template engine Sunday, October 30, 11

11. partial solutions <form> <input type=”text” value=”{{name}}” /> </form> haml_assets haml_handlebars_assets

    = hbs_form_for :user do |f| = f.text_field :name template engine Sunday, October 30, 11

12. partial solutions Routes handlebars_routes_assets Sunday, October 30, 11

13. partial solutions r.edit_user_path Routes handlebars_routes_assets Sunday, October 30, 11

14. partial solutions r.edit_user_path Routes handlebars_routes_assets /users/{{id}}/edit Sunday, October 30, 11

15. partial solutions = hbs_form_for :user, action: r.edit_user_path, method: :put do

    |f| = f.text_field :name <form action=”/users/{{id}}/edit” method=”put”> <input type=”text” value=”{{name}}” /> </form> Sunday, October 30, 11

16. partial solutions t(:‘hello.world’) Localization jquery-localization-engine Sunday, October 30, 11

17. partial solutions t(:‘hello.world’) <span rel=”localize[hello.world]”> Hello World! </span> Localization jquery-localization-engine

    Sunday, October 30, 11

18. partial solutions t(:‘hello.world’) <span rel=”localize[hello.world]”> Hello World! </span> $("[rel*=localize]").localize("locales/de") Localization

    jquery-localization-engine Sunday, October 30, 11

19. partial solutions review HAML - rendering ActionView::Helpers handlebars templating dynamic

    localization Sunday, October 30, 11

20. partial solutions questions integrate I18n into FormHelpers ? authorization in

    the client? data-filter in the server? restore state when accessing URLs directly? Sunday, October 30, 11

21. samples https://github.com/leahpar/backbone-asset-pipeline-example http://nicolai86.eu Sunday, October 30, 11

22. Discussion Sunday, October 30, 11