• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
DRYing Up Rails Views and Controllers
 

DRYing Up Rails Views and Controllers

on

  • 15,090 views

This was the fifth speech of a three day Rails training I gave in Tulsa, OK in the spring 2010.

This was the fifth speech of a three day Rails training I gave in Tulsa, OK in the spring 2010.

Statistics

Views

Total Views
15,090
Views on SlideShare
15,049
Embed Views
41

Actions

Likes
15
Downloads
111
Comments
0

1 Embed 41

http://www.slideshare.net 41

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />

DRYing Up Rails Views and Controllers DRYing Up Rails Views and Controllers Presentation Transcript

  • DRYing up Views and Controllers Layouts, partials, helpers, and filters
  • The Problem
  • The Problem I said Rails was big on DRY (don’t repeat yourself)
  • The Problem I said Rails was big on DRY (don’t repeat yourself) But we are duplicating a lot of code so far!
  • Add an Article Form A trivial page containing a form
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>Add an Article</title> </head> <body> <h1>Add an Article</h1> <% form_for @article do |f| %> <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> <%= f.submit "Post Article" %> <% end %> </body> </html> Add an Article Form A trivial page containing a form
  • Update Article Form Nearly the exact same page
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>Update Article</title> </head> <body> <h1>Update Article</h1> <% form_for @article do |f| %> <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> <%= f.submit "Save Article" %> <% end %> </body> </html> Update Article Form Nearly the exact same page
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>Update Article</title> </head> <body> <h1>Update Article</h1> <% form_for @article do |f| %> <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> <%= f.submit "Save Article" %> <% end %> </body> </html> Update Article Form Nearly the exact same page
  • Solutions
  • Solutions Rails has many different tools to reduce repetition
  • Solutions Rails has many different tools to reduce repetition Layouts
  • Solutions Rails has many different tools to reduce repetition Layouts Partials
  • Solutions Rails has many different tools to reduce repetition Layouts Partials Helpers
  • Solutions Rails has many different tools to reduce repetition Layouts Partials Helpers Filters
  • Solutions Rails has many different tools to reduce repetition Layouts Partials Helpers Filters Let’s take a look at what each of these is good for
  • Layouts A tool for separating page header and footer code
  • Repetitive HTML
  • Repetitive HTML Layouts help you to handle header and footer code
  • Repetitive HTML Layouts help you to handle header and footer code This is handy for HTML <head> … </head> sections and common site design code
  • Repetitive HTML Layouts help you to handle header and footer code This is handy for HTML <head> … </head> sections and common site design code Rails will render a layout for each page, if available
  • Layout Selection class ArticlesController < ApplicationController # ... end
  • Layout Selection class ArticlesController < Each controller can ApplicationController have it’s own layout # ... end
  • Layout Selection class ArticlesController < Each controller can ApplicationController have it’s own layout # ... end If a controller doesn’t, Rails will check parent controllers
  • Layout Selection class ArticlesController < Each controller can ApplicationController have it’s own layout # ... end If a controller doesn’t, Rails will check parent controllers application.html.erb is the easiest way to set a global layout
  • A Basic Layout Just yield where you want to insert the page content
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>My Blog</title> </head> <body> <%= yield %> </body> </html> A Basic Layout Just yield where you want to insert the page content
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>My Blog</title> </head> <body> <%= yield %> </body> </html> A Basic Layout Just yield where you want to insert the page content
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>My Blog</title> </head> <body> <%= yield %> </body> </html> A Basic Layout Just yield where you want to insert the page content
  • The Revised Add Form This code is inserted into the layout by Rails to create a full page
  • <h1>Add an Article</h1> <% form_for @article do |f| %> <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> <%= f.submit "Post Article" %> <% end %> The Revised Add Form This code is inserted into the layout by Rails to create a full page
  • The Revised Edit Form There’s still some duplication, but things are definitely improving
  • <h1>Update Article</h1> <% form_for @article do |f| %> <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> <%= f.submit "Save Article" %> <% end %> The Revised Edit Form There’s still some duplication, but things are definitely improving
  • Fixing the Title
  • Fixing the Title <% content_for :name, "Content" %> <% content_for :name do %> <script type="text/javascript" charset="utf-8"> // ... </script> <% end %> <%= yield :name %>
  • Fixing the Title content_for() can be used to pass content <% content_for :name, "Content" %> between files <% content_for :name do %> <script type="text/javascript" charset="utf-8"> // ... </script> <% end %> <%= yield :name %>
  • Fixing the Title content_for() can be used to pass content <% content_for :name, "Content" %> between files <% content_for :name do %> <script type="text/javascript" charset="utf-8"> One file sets content, // ... </script> using a Ruby String or <% end %> a block of HTML <%= yield :name %>
  • Fixing the Title content_for() can be used to pass content <% content_for :name, "Content" %> between files <% content_for :name do %> <script type="text/javascript" charset="utf-8"> One file sets content, // ... </script> using a Ruby String or <% end %> a block of HTML Another file yields to it <%= yield :name %> by name
  • Set Title Content Each page sets relevant title content
  • <% content_for :page_title, "Add an Article" %> <h1>Add an Article</h1> <!-- .... --> <% content_for :page_title, "Update Article" %> <h1>Update Article</h1> <!-- ... --> Set Title Content Each page sets relevant title content
  • Read the Title Content The layout will now make use of the title content if it exists
  • <title> <%= ["My Blog", yield(:page_title)].compact.join(" : ") %> </title> Read the Title Content The layout will now make use of the title content if it exists
  • Content Sharing in Action
  • Content Sharing in Action We now have dynamic titles based on the page you are viewing
  • Content Sharing in Action We now have dynamic titles based on the page you are viewing
  • Content Sharing in Action We now have dynamic titles based on the page you are viewing
  • Content Sharing in Action We now have dynamic titles based on the page you are viewing content_for() is also handy for sidebars and other shared content
  • Partials A tool for separating repeated chunks of view code
  • Duplicate Form Fields We need to remove more duplication, but be pragmatic about what to leave
  • <h1>Update Article</h1> <% form_for @article do |f| %> <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> <%= f.submit "Save Article" %> <% end %> Duplicate Form Fields We need to remove more duplication, but be pragmatic about what to leave
  • <h1>Update Article</h1> <% form_for @article do |f| %> <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> <%= f.submit "Save Article" %> <% end %> Duplicate Form Fields We need to remove more duplication, but be pragmatic about what to leave
  • <h1>Update Article</h1> <% form_for @article do |f| %> <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> <%= f.submit "Save Article" %> <% end %> Duplicate Form Fields We need to remove more duplication, but be pragmatic about what to leave
  • Shared HTML
  • Shared HTML Any shared HTML can be placed into a “partial”
  • Shared HTML Any shared HTML can be placed into a “partial” This is often used for form fields, and code that displays the details of an individual model
  • Shared HTML Any shared HTML can be placed into a “partial” This is often used for form fields, and code that displays the details of an individual model That partial can then be inserted into all needed places
  • Shared HTML Any shared HTML can be placed into a “partial” This is often used for form fields, and code that displays the details of an individual model That partial can then be inserted into all needed places By convention, partial files begin with an _ in Rails (for example: _article.html.erb)
  • _form.html.erb I’ve moved the form fields into a separate HTML file, starting with an _ so Rails knows it’s a partial
  • <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> _form.html.erb I’ve moved the form fields into a separate HTML file, starting with an _ so Rails knows it’s a partial
  • <%= f.error_messages %> <%= f.label :title %><br><%= f.text_field :title %><br> <%= f.label :body %><br><%= f.text_area :body %><br> _form.html.erb I’ve moved the form fields into a separate HTML file, starting with an _ so Rails knows it’s a partial
  • Forms render() the Partial We can render() the partial anywhere we need to reuse it and even pass variables into it
  • <% content_for :page_title, "Add an Article" %> <h1>Add an Article</h1> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Post Article" %> <% end %> <% content_for :page_title, "Update Article" %> <h1>Update Article</h1> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Save Article" %> <% end %> Forms render() the Partial We can render() the partial anywhere we need to reuse it and even pass variables into it
  • <% content_for :page_title, "Add an Article" %> <h1>Add an Article</h1> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Post Article" %> <% end %> <% content_for :page_title, "Update Article" %> <h1>Update Article</h1> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Save Article" %> <% end %> Forms render() the Partial We can render() the partial anywhere we need to reuse it and even pass variables into it
  • Partials for Models
  • Partials for Models Rails is smart about partials used to show a model
  • Partials for Models Rails is smart about partials used to show a model It can recognize them by name (more conventions!)
  • Partials for Models Rails is smart about partials used to show a model It can recognize them by name (more conventions!) It will render() the proper partial for a model or repeatedly render() the same partial for an entire collection of models
  • Partials for Models Rails is smart about partials used to show a model It can recognize them by name (more conventions!) It will render() the proper partial for a model or repeatedly render() the same partial for an entire collection of models A local variable is set holding the model, again named by the type
  • Manual Iteration This code works, but Rails is smart enough to help us if we follow some conventions
  • <h1>Articles</h1> <ul> <% @articles.each do |article| %> <li> <%= link_to h(article.title), article_path(article) %> <%= link_to "edit", edit_article_path(article) %> </li> <% end %> </ul> Manual Iteration This code works, but Rails is smart enough to help us if we follow some conventions
  • _article.html.erb I moved the Article display code into an _article.html.erb partial
  • <li> <%= link_to h(article.title), article_path(article) %> <%= link_to "edit", edit_article_path(article) %> </li> _article.html.erb I moved the Article display code into an _article.html.erb partial
  • <li> <%= link_to h(article.title), article_path(article) %> <%= link_to "edit", edit_article_path(article) %> </li> _article.html.erb I moved the Article display code into an _article.html.erb partial
  • Partial Found by Name Rails looks for an _article.html.erb to render() the Article (matching the names)
  • <h1>Articles</h1> <ul> <% @articles.each do |article| %> <%= render article %> <% end %> </ul> Partial Found by Name Rails looks for an _article.html.erb to render() the Article (matching the names)
  • One Step Further Rails can even recognize a collection (an Array), render()ing the partial once for each member
  • <h1>Articles</h1> <ul> <%= render @articles %> </ul> One Step Further Rails can even recognize a collection (an Array), render()ing the partial once for each member
  • Helpers A tool for separating out view logic
  • Where to Hide View Logic
  • Where to Hide View Logic Views should be pretty dumb template filling code
  • Where to Hide View Logic Views should be pretty dumb template filling code Logic in your views is hard to maintain and needs to be moved
  • Where to Hide View Logic Views should be pretty dumb template filling code Logic in your views is hard to maintain and needs to be moved Move business logic into model methods
  • Where to Hide View Logic Views should be pretty dumb template filling code Logic in your views is hard to maintain and needs to be moved Move business logic into model methods If it’s really view logic, write a helper method
  • Where to Hide View Logic Views should be pretty dumb template filling code Logic in your views is hard to maintain and needs to be moved Move business logic into model methods If it’s really view logic, write a helper method A helper is just a Ruby “Mixin” Rails adds to the view
  • These can be Combined This is some logic though, so it belongs in a helper method
  • <% content_for :page_title, "Add an Article" %> <h1>Add an Article</h1> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Post Article" %> <% end %> <% content_for :page_title, "Update Article" %> <h1>Update Article</h1> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Save Article" %> <% end %> These can be Combined This is some logic though, so it belongs in a helper method
  • <% content_for :page_title, "Add an Article" %> <h1>Add an Article</h1> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Post Article" %> <% end %> <% content_for :page_title, "Update Article" %> <h1>Update Article</h1> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Save Article" %> <% end %> These can be Combined This is some logic though, so it belongs in a helper method
  • Adding a Helper Method I added this method to the Module (“Mixin”) in app/helpers/application_helper.rb
  • module ApplicationHelper def page_title(title) content_for :page_title, title "<h1>#{title}</h1>" end end Adding a Helper Method I added this method to the Module (“Mixin”) in app/helpers/application_helper.rb
  • Switch to Using the Helper The views are a little cleaner now with the logic moved to the helper
  • <%= page_title "Add an Article" %> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Post Article" %> <% end %> <%= page_title "Update Article" %> <% form_for @article do |f| %> <%= render "form", :f => f %> <%= f.submit "Save Article" %> <% end %> Switch to Using the Helper The views are a little cleaner now with the logic moved to the helper
  • Built-in Helpers
  • Built-in Helpers Rails comes with a ton of helpers, available in all views
  • Built-in Helpers Rails comes with a ton of helpers, available in all views Date and time methods
  • Built-in Helpers Rails comes with a ton of helpers, available in all views Date and time methods Number and currency methods
  • Built-in Helpers Rails comes with a ton of helpers, available in all views Date and time methods Number and currency methods Link and form builders
  • Built-in Helpers Rails comes with a ton of helpers, available in all views Date and time methods Number and currency methods Link and form builders Image, CSS, and JavaScript support methods
  • Built-in Helpers Rails comes with a ton of helpers, available in all views Date and time methods Number and currency methods Link and form builders Image, CSS, and JavaScript support methods …
  • An Article Show Page Uses helpers to escape HTML, show time, and add simple formatting (like paragraphs) here
  • <%= page_title h(@article.title) %> <p>posted <%= time_ago_in_words @article.created_at %> ago</p> <%= simple_format @article.body %> An Article Show Page Uses helpers to escape HTML, show time, and add simple formatting (like paragraphs) here
  • <%= page_title h(@article.title) %> <p>posted <%= time_ago_in_words @article.created_at %> ago</p> <%= simple_format @article.body %> An Article Show Page Uses helpers to escape HTML, show time, and add simple formatting (like paragraphs) here
  • <%= page_title h(@article.title) %> <p>posted <%= time_ago_in_words @article.created_at %> ago</p> <%= simple_format @article.body %> An Article Show Page Uses helpers to escape HTML, show time, and add simple formatting (like paragraphs) here
  • <%= page_title h(@article.title) %> <p>posted <%= time_ago_in_words @article.created_at %> ago</p> <%= simple_format @article.body %> An Article Show Page Uses helpers to escape HTML, show time, and add simple formatting (like paragraphs) here
  • Filters A tool for separating repeated chunks of controller code
  • Controller Duplication It’s very common for show, edit, update, and destroy to start with the same lookup code
  • class ArticlesController < ApplicationController # ... def show @article = Article.find(params[:id]) end def edit @article = Article.find(params[:id]) end def update @article = Article.find(params[:id]) # ... end def destroy @article = Article.find(params[:id]) # ... end end Controller Duplication It’s very common for show, edit, update, and destroy to start with the same lookup code
  • class ArticlesController < ApplicationController # ... def show @article = Article.find(params[:id]) end def edit @article = Article.find(params[:id]) end def update @article = Article.find(params[:id]) # ... end def destroy @article = Article.find(params[:id]) # ... end end Controller Duplication It’s very common for show, edit, update, and destroy to start with the same lookup code
  • Before or After an Action
  • Before or After an Action Rails has filters that can be run before or after an action
  • Before or After an Action Rails has filters that can be run before or after an action before_filter() is often used to lookup model instances or check access control
  • Before or After an Action Rails has filters that can be run before or after an action before_filter() is often used to lookup model instances or check access control You can choose to skip the action that follows
  • Before or After an Action Rails has filters that can be run before or after an action before_filter() is often used to lookup model instances or check access control You can choose to skip the action that follows after_filter() isn’t used as much, but it can be handy for statistics tracking
  • Using a before_filter() You can specify a method to call before certain actions are run
  • class ArticlesController < ApplicationController before_filter :find_article, :only => %w[show edit update destroy] # ... def show end def edit end def update # ... end def destroy # ... end private def find_article @article = Article.find(params[:id]) end end Using a before_filter() You can specify a method to call before certain actions are run
  • class ArticlesController < ApplicationController before_filter :find_article, :only => %w[show edit update destroy] # ... def show end def edit end def update # ... end def destroy # ... end private def find_article @article = Article.find(params[:id]) end end Using a before_filter() You can specify a method to call before certain actions are run
  • class ArticlesController < ApplicationController before_filter :find_article, :only => %w[show edit update destroy] # ... def show end def edit end def update # ... end def destroy # ... end private def find_article @article = Article.find(params[:id]) end end Using a before_filter() You can specify a method to call before certain actions are run
  • class ArticlesController < ApplicationController before_filter :find_article, :only => %w[show edit update destroy] # ... def show end def edit end def update # ... end def destroy # ... end private def find_article @article = Article.find(params[:id]) end end Using a before_filter() You can specify a method to call before certain actions are run
  • Questions?
  • DRY up Your Views Lab Your book has instructions on how to remove the duplication in your code