SlideShare a Scribd company logo
Catalog Display
What we’ll cover Writing our own views Using layouts to decorate pages Integrating CSS / styling Using Helpers Writing functional tests
Generate a store controller rails generate controller store index This sets up the scaffolding for /store/index http://localhost:3000/store/index
Make / point to the store Right now when you go to http://localhost:3000/ you get the “default” rails page Let’s make / load the store we just created config/routes.rb root :to => ‘store#index’, :as => ‘store’ :as allows us to use store_path later
Try it out http://localhost:3000/ Still the default page, why?
Try it out http://localhost:3000/ Still the default page, why? Remove public/index.html rm public/index.html
Display a list of products available app/controllers/store_controller.rb def index @products = Product.all end app/models/product.rb default_scope :order => ‘title’
Update our view app/views/store/index.html.erb
Sanitize your HTML We use the sanitize method to escape HTML http://api.rubyonrails.org/classes/ActionView/Helpers/SanitizeHelper.html Also use the image_tag helper to provide <img> tags
Adding a page layout Most pages on a site have a similar look Header Side bar Footer application.html.erb is the “default” layout Unless a controller specifies otherwise
Application Layout app/views/layouts/application.html.erb curl -o app/views/layouts/application.html.erb http://media.pragprog.com/titles/rails4/code/depot_e/app/views/layouts/application.html.erb
New concepts in Layout <%= stylesheet_link_tag “depot”, :media => “all” %> Generates a HTML <link> tag for our stylesheet <link href="/stylesheets/depot.css?1289056297" media="all" rel="stylesheet" type="text/css" /> <%= csrf_meta_tag %> Helps prevent cross site request forgery attacks Covered in detail in chapter 12 <%= @page_title || “Pragmatic Bookshelf” %> If @page_title is defined, print it, otherwise “Pragmatic Bookshelf” <%= yield %> Rails puts the stuff from the app/views/* files in at this point
Update stylesheet http://media.pragprog.com/titles/rails4/code/depot_e/public/stylesheets/depot.css
Reload the page http://localhost:3000/ What’s wrong with the prices Displaying 5.0 instead of $5.00 We’ll fix that with a helper
Keep code out of your views <%= sprintf(“$%0.02f”, product.price) %> Embeds knowledge in your views Makes internationalization hard Don’t Repeat Yourself Helper methods help you display things in your views
number_to_currency app/views/store/index.html.erb <%= product.price %> becomes <%= number_to_currency(product.price) %> Rails provides number_to_currency for you http://api.rubyonrails.org/classes/ActionView/Helpers/NumberHelper.html
Write tests! Did we break anything? rake test No failures, yay! Functional tests verify that a model, view and controller work together properly
Functional Tests (cont.)
assert_select selectors # matches on id attributes <div id=“mydiv”>  => ‘#mydiv’ . matches on class attributes <div class=“myclass”> => ‘.myclass’ No prefix match on element names <a> => ‘a’
What do these match? assert_select ‘#main .entry img’ An image tag in an element with a entry class inside an element with an id of main assert_select ‘.sidebar ulli.odd’ An li item with a class of odd inside of a ul item inside of an item with a class of sidebar assert_select ‘span.widediv.even a img’ An image tag within an anchor (a) tag within a div with a class of even within a span with a class of wide
What we just did Created a new store controller Made the store controller our root page Made Products be sorted by title by default Implement a view and an application layout Use a Rails helper to format prices Make use of a CSS stylesheet Write functional tests for our controller
Homework Add a date and time to the sidebar Investigate the options to number_to_currency and play with a couple http://api.rubyonrails.org/classes/ActionView/Helpers/NumberHelper.html Write some functional tests for the products controller (test/functional/product_controller_test.rb) Commit your work in Git

More Related Content

What's hot

5 Reasons To Love CodeIgniter
5 Reasons To Love CodeIgniter5 Reasons To Love CodeIgniter
5 Reasons To Love CodeIgniternicdev
 
Be happy with Ruby on Rails - CEUNSP Itu
Be happy with Ruby on Rails - CEUNSP ItuBe happy with Ruby on Rails - CEUNSP Itu
Be happy with Ruby on Rails - CEUNSP ItuLucas Renan
 
Telling Stories With RSpec
Telling Stories With RSpecTelling Stories With RSpec
Telling Stories With RSpecrahoulb
 
Testing C# and ASP.net using Ruby
Testing C# and ASP.net using RubyTesting C# and ASP.net using Ruby
Testing C# and ASP.net using RubyBen Hall
 
Ajax on drupal the right way - DrupalCamp Campinas, São Paulo, Brazil 2016
Ajax on drupal the right way - DrupalCamp Campinas, São Paulo, Brazil 2016Ajax on drupal the right way - DrupalCamp Campinas, São Paulo, Brazil 2016
Ajax on drupal the right way - DrupalCamp Campinas, São Paulo, Brazil 2016Nicolás Bouhid
 
SPA using Rails & Backbone
SPA using Rails & BackboneSPA using Rails & Backbone
SPA using Rails & BackboneAshan Fernando
 
Presentation.Key
Presentation.KeyPresentation.Key
Presentation.Keyguesta2b31d
 
Cart creation-101217222728-phpapp01
Cart creation-101217222728-phpapp01Cart creation-101217222728-phpapp01
Cart creation-101217222728-phpapp01Jason Noble
 
Rails Awesome Email
Rails Awesome EmailRails Awesome Email
Rails Awesome Emailimedo.de
 
RoR 101: Session 2
RoR 101: Session 2RoR 101: Session 2
RoR 101: Session 2Rory Gianni
 
jQuery Mobile Workshop
jQuery Mobile WorkshopjQuery Mobile Workshop
jQuery Mobile WorkshopRon Reiter
 
Rapid Application Development with CakePHP 1.3
Rapid Application Development with CakePHP 1.3Rapid Application Development with CakePHP 1.3
Rapid Application Development with CakePHP 1.3kidtangerine
 
Introduction to Ruby On Rails
Introduction to Ruby On RailsIntroduction to Ruby On Rails
Introduction to Ruby On RailsPiotr Imbierowicz
 
Automated layout testing using Galen Framework
Automated layout testing using Galen FrameworkAutomated layout testing using Galen Framework
Automated layout testing using Galen FrameworkSperasoft
 
RoR 101: Session 6
RoR 101: Session 6RoR 101: Session 6
RoR 101: Session 6Rory Gianni
 
Ride on the Fast Track of Web with Ruby on Rails- Part 2
Ride on the Fast Track of Web with Ruby on Rails- Part 2Ride on the Fast Track of Web with Ruby on Rails- Part 2
Ride on the Fast Track of Web with Ruby on Rails- Part 2A.K.M. Ahsrafuzzaman
 
RoR 101: Session 5
RoR 101: Session 5RoR 101: Session 5
RoR 101: Session 5Rory Gianni
 

What's hot (20)

5 Reasons To Love CodeIgniter
5 Reasons To Love CodeIgniter5 Reasons To Love CodeIgniter
5 Reasons To Love CodeIgniter
 
Apex & jQuery Mobile
Apex & jQuery MobileApex & jQuery Mobile
Apex & jQuery Mobile
 
Be happy with Ruby on Rails - CEUNSP Itu
Be happy with Ruby on Rails - CEUNSP ItuBe happy with Ruby on Rails - CEUNSP Itu
Be happy with Ruby on Rails - CEUNSP Itu
 
Telling Stories With RSpec
Telling Stories With RSpecTelling Stories With RSpec
Telling Stories With RSpec
 
Testing C# and ASP.net using Ruby
Testing C# and ASP.net using RubyTesting C# and ASP.net using Ruby
Testing C# and ASP.net using Ruby
 
Ajax on drupal the right way - DrupalCamp Campinas, São Paulo, Brazil 2016
Ajax on drupal the right way - DrupalCamp Campinas, São Paulo, Brazil 2016Ajax on drupal the right way - DrupalCamp Campinas, São Paulo, Brazil 2016
Ajax on drupal the right way - DrupalCamp Campinas, São Paulo, Brazil 2016
 
SPA using Rails & Backbone
SPA using Rails & BackboneSPA using Rails & Backbone
SPA using Rails & Backbone
 
Presentation.Key
Presentation.KeyPresentation.Key
Presentation.Key
 
Plugins unplugged
Plugins unpluggedPlugins unplugged
Plugins unplugged
 
Cart creation-101217222728-phpapp01
Cart creation-101217222728-phpapp01Cart creation-101217222728-phpapp01
Cart creation-101217222728-phpapp01
 
Rails Awesome Email
Rails Awesome EmailRails Awesome Email
Rails Awesome Email
 
RoR 101: Session 2
RoR 101: Session 2RoR 101: Session 2
RoR 101: Session 2
 
jQuery Mobile Workshop
jQuery Mobile WorkshopjQuery Mobile Workshop
jQuery Mobile Workshop
 
Rapid Application Development with CakePHP 1.3
Rapid Application Development with CakePHP 1.3Rapid Application Development with CakePHP 1.3
Rapid Application Development with CakePHP 1.3
 
Introduction to Ruby On Rails
Introduction to Ruby On RailsIntroduction to Ruby On Rails
Introduction to Ruby On Rails
 
Automated layout testing using Galen Framework
Automated layout testing using Galen FrameworkAutomated layout testing using Galen Framework
Automated layout testing using Galen Framework
 
RoR 101: Session 6
RoR 101: Session 6RoR 101: Session 6
RoR 101: Session 6
 
Ride on the Fast Track of Web with Ruby on Rails- Part 2
Ride on the Fast Track of Web with Ruby on Rails- Part 2Ride on the Fast Track of Web with Ruby on Rails- Part 2
Ride on the Fast Track of Web with Ruby on Rails- Part 2
 
RoR 101: Session 5
RoR 101: Session 5RoR 101: Session 5
RoR 101: Session 5
 
Web Controls Set-1
Web Controls Set-1Web Controls Set-1
Web Controls Set-1
 

Similar to Catalog display

Useful Rails Plugins
Useful Rails PluginsUseful Rails Plugins
Useful Rails Pluginsnavjeet
 
OSDC 2009 Rails Turtorial
OSDC 2009 Rails TurtorialOSDC 2009 Rails Turtorial
OSDC 2009 Rails TurtorialYi-Ting Cheng
 
Course CodeSchool - Shaping up with Angular.js
Course CodeSchool - Shaping up with Angular.jsCourse CodeSchool - Shaping up with Angular.js
Course CodeSchool - Shaping up with Angular.jsVinícius de Moraes
 
Introduction to ASP.NET MVC
Introduction to ASP.NET MVCIntroduction to ASP.NET MVC
Introduction to ASP.NET MVCMaarten Balliauw
 
243329387 angular-docs
243329387 angular-docs243329387 angular-docs
243329387 angular-docsAbhi166803
 
Templates, partials and layouts
Templates, partials and layoutsTemplates, partials and layouts
Templates, partials and layoutsKadiv Vech
 
Ruby on Rails + AngularJS + Twitter Bootstrap
Ruby on Rails + AngularJS + Twitter BootstrapRuby on Rails + AngularJS + Twitter Bootstrap
Ruby on Rails + AngularJS + Twitter BootstrapMarcio Marinho
 
Angular.js Fundamentals
Angular.js FundamentalsAngular.js Fundamentals
Angular.js FundamentalsMark
 
Intro To Mvc Development In Php
Intro To Mvc Development In PhpIntro To Mvc Development In Php
Intro To Mvc Development In Phpfunkatron
 
Resource and view
Resource and viewResource and view
Resource and viewPapp Laszlo
 
ASP.NET MVC introduction
ASP.NET MVC introductionASP.NET MVC introduction
ASP.NET MVC introductionTomi Juhola
 
Widgets: Making Your Site Great and Letting Others Help - WordCamp Victoria
Widgets: Making Your Site Great and Letting Others Help - WordCamp VictoriaWidgets: Making Your Site Great and Letting Others Help - WordCamp Victoria
Widgets: Making Your Site Great and Letting Others Help - WordCamp VictoriaJeff Richards
 
Zend - Installation And Sample Project Creation
Zend - Installation And Sample Project Creation Zend - Installation And Sample Project Creation
Zend - Installation And Sample Project Creation Compare Infobase Limited
 
Beautiful Java EE - PrettyFaces
Beautiful Java EE - PrettyFacesBeautiful Java EE - PrettyFaces
Beautiful Java EE - PrettyFacesLincoln III
 
Spring MVC
Spring MVCSpring MVC
Spring MVCyuvalb
 
AEM Sightly Deep Dive
AEM Sightly Deep DiveAEM Sightly Deep Dive
AEM Sightly Deep DiveGabriel Walt
 

Similar to Catalog display (20)

Useful Rails Plugins
Useful Rails PluginsUseful Rails Plugins
Useful Rails Plugins
 
OSDC 2009 Rails Turtorial
OSDC 2009 Rails TurtorialOSDC 2009 Rails Turtorial
OSDC 2009 Rails Turtorial
 
The Rails Way
The Rails WayThe Rails Way
The Rails Way
 
Course CodeSchool - Shaping up with Angular.js
Course CodeSchool - Shaping up with Angular.jsCourse CodeSchool - Shaping up with Angular.js
Course CodeSchool - Shaping up with Angular.js
 
Introduction to ASP.NET MVC
Introduction to ASP.NET MVCIntroduction to ASP.NET MVC
Introduction to ASP.NET MVC
 
243329387 angular-docs
243329387 angular-docs243329387 angular-docs
243329387 angular-docs
 
Templates, partials and layouts
Templates, partials and layoutsTemplates, partials and layouts
Templates, partials and layouts
 
Magento Indexes
Magento IndexesMagento Indexes
Magento Indexes
 
Ruby on Rails + AngularJS + Twitter Bootstrap
Ruby on Rails + AngularJS + Twitter BootstrapRuby on Rails + AngularJS + Twitter Bootstrap
Ruby on Rails + AngularJS + Twitter Bootstrap
 
Angular.js Fundamentals
Angular.js FundamentalsAngular.js Fundamentals
Angular.js Fundamentals
 
Intro To Mvc Development In Php
Intro To Mvc Development In PhpIntro To Mvc Development In Php
Intro To Mvc Development In Php
 
Resource and view
Resource and viewResource and view
Resource and view
 
ASP.NET MVC introduction
ASP.NET MVC introductionASP.NET MVC introduction
ASP.NET MVC introduction
 
Widgets: Making Your Site Great and Letting Others Help - WordCamp Victoria
Widgets: Making Your Site Great and Letting Others Help - WordCamp VictoriaWidgets: Making Your Site Great and Letting Others Help - WordCamp Victoria
Widgets: Making Your Site Great and Letting Others Help - WordCamp Victoria
 
Shopify Partner Social
Shopify Partner SocialShopify Partner Social
Shopify Partner Social
 
Zend - Installation And Sample Project Creation
Zend - Installation And Sample Project Creation Zend - Installation And Sample Project Creation
Zend - Installation And Sample Project Creation
 
Beautiful Java EE - PrettyFaces
Beautiful Java EE - PrettyFacesBeautiful Java EE - PrettyFaces
Beautiful Java EE - PrettyFaces
 
Spring MVC
Spring MVCSpring MVC
Spring MVC
 
Asp.Net MVC Intro
Asp.Net MVC IntroAsp.Net MVC Intro
Asp.Net MVC Intro
 
AEM Sightly Deep Dive
AEM Sightly Deep DiveAEM Sightly Deep Dive
AEM Sightly Deep Dive
 

More from Jason Noble

More from Jason Noble (13)

Intro to TDD and BDD
Intro to TDD and BDDIntro to TDD and BDD
Intro to TDD and BDD
 
Davinci git brown_bag
Davinci git brown_bagDavinci git brown_bag
Davinci git brown_bag
 
Rspec 101
Rspec 101Rspec 101
Rspec 101
 
Google apps
Google appsGoogle apps
Google apps
 
Smarter cart
Smarter cartSmarter cart
Smarter cart
 
Validation unit testing
Validation unit testingValidation unit testing
Validation unit testing
 
Creating the application
Creating the applicationCreating the application
Creating the application
 
Capistrano
CapistranoCapistrano
Capistrano
 
Atlanta Pm Git 101
Atlanta Pm Git 101Atlanta Pm Git 101
Atlanta Pm Git 101
 
Regex Intro
Regex IntroRegex Intro
Regex Intro
 
Git101
Git101Git101
Git101
 
Git Atlrug
Git AtlrugGit Atlrug
Git Atlrug
 
Git102
Git102Git102
Git102
 

Recently uploaded

Designing for Hardware Accessibility at Comcast
Designing for Hardware Accessibility at ComcastDesigning for Hardware Accessibility at Comcast
Designing for Hardware Accessibility at ComcastUXDXConf
 
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlPeter Udo Diehl
 
Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...
Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...
Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...CzechDreamin
 
Strategic AI Integration in Engineering Teams
Strategic AI Integration in Engineering TeamsStrategic AI Integration in Engineering Teams
Strategic AI Integration in Engineering TeamsUXDXConf
 
Linux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdf
Linux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdfLinux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdf
Linux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdfFIDO Alliance
 
Introduction to Open Source RAG and RAG Evaluation
Introduction to Open Source RAG and RAG EvaluationIntroduction to Open Source RAG and RAG Evaluation
Introduction to Open Source RAG and RAG EvaluationZilliz
 
Integrating Telephony Systems with Salesforce: Insights and Considerations, B...
Integrating Telephony Systems with Salesforce: Insights and Considerations, B...Integrating Telephony Systems with Salesforce: Insights and Considerations, B...
Integrating Telephony Systems with Salesforce: Insights and Considerations, B...CzechDreamin
 
Syngulon - Selection technology May 2024.pdf
Syngulon - Selection technology May 2024.pdfSyngulon - Selection technology May 2024.pdf
Syngulon - Selection technology May 2024.pdfSyngulon
 
Optimizing NoSQL Performance Through Observability
Optimizing NoSQL Performance Through ObservabilityOptimizing NoSQL Performance Through Observability
Optimizing NoSQL Performance Through ObservabilityScyllaDB
 
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdfThe Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdfFIDO Alliance
 
Powerful Start- the Key to Project Success, Barbara Laskowska
Powerful Start- the Key to Project Success, Barbara LaskowskaPowerful Start- the Key to Project Success, Barbara Laskowska
Powerful Start- the Key to Project Success, Barbara LaskowskaCzechDreamin
 
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...FIDO Alliance
 
ECS 2024 Teams Premium - Pretty Secure
ECS 2024   Teams Premium - Pretty SecureECS 2024   Teams Premium - Pretty Secure
ECS 2024 Teams Premium - Pretty SecureFemke de Vroome
 
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxWSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxJennifer Lim
 
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...CzechDreamin
 
UiPath Test Automation using UiPath Test Suite series, part 1
UiPath Test Automation using UiPath Test Suite series, part 1UiPath Test Automation using UiPath Test Suite series, part 1
UiPath Test Automation using UiPath Test Suite series, part 1DianaGray10
 
Buy Epson EcoTank L3210 Colour Printer Online.pdf
Buy Epson EcoTank L3210 Colour Printer Online.pdfBuy Epson EcoTank L3210 Colour Printer Online.pdf
Buy Epson EcoTank L3210 Colour Printer Online.pdfEasyPrinterHelp
 
Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...
Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...
Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...FIDO Alliance
 
Simplified FDO Manufacturing Flow with TPMs _ Liam at Infineon.pdf
Simplified FDO Manufacturing Flow with TPMs _ Liam at Infineon.pdfSimplified FDO Manufacturing Flow with TPMs _ Liam at Infineon.pdf
Simplified FDO Manufacturing Flow with TPMs _ Liam at Infineon.pdfFIDO Alliance
 
Speed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in MinutesSpeed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in Minutesconfluent
 

Recently uploaded (20)

Designing for Hardware Accessibility at Comcast
Designing for Hardware Accessibility at ComcastDesigning for Hardware Accessibility at Comcast
Designing for Hardware Accessibility at Comcast
 
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
 
Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...
Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...
Behind the Scenes From the Manager's Chair: Decoding the Secrets of Successfu...
 
Strategic AI Integration in Engineering Teams
Strategic AI Integration in Engineering TeamsStrategic AI Integration in Engineering Teams
Strategic AI Integration in Engineering Teams
 
Linux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdf
Linux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdfLinux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdf
Linux Foundation Edge _ Overview of FDO Software Components _ Randy at Intel.pdf
 
Introduction to Open Source RAG and RAG Evaluation
Introduction to Open Source RAG and RAG EvaluationIntroduction to Open Source RAG and RAG Evaluation
Introduction to Open Source RAG and RAG Evaluation
 
Integrating Telephony Systems with Salesforce: Insights and Considerations, B...
Integrating Telephony Systems with Salesforce: Insights and Considerations, B...Integrating Telephony Systems with Salesforce: Insights and Considerations, B...
Integrating Telephony Systems with Salesforce: Insights and Considerations, B...
 
Syngulon - Selection technology May 2024.pdf
Syngulon - Selection technology May 2024.pdfSyngulon - Selection technology May 2024.pdf
Syngulon - Selection technology May 2024.pdf
 
Optimizing NoSQL Performance Through Observability
Optimizing NoSQL Performance Through ObservabilityOptimizing NoSQL Performance Through Observability
Optimizing NoSQL Performance Through Observability
 
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdfThe Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
 
Powerful Start- the Key to Project Success, Barbara Laskowska
Powerful Start- the Key to Project Success, Barbara LaskowskaPowerful Start- the Key to Project Success, Barbara Laskowska
Powerful Start- the Key to Project Success, Barbara Laskowska
 
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
 
ECS 2024 Teams Premium - Pretty Secure
ECS 2024   Teams Premium - Pretty SecureECS 2024   Teams Premium - Pretty Secure
ECS 2024 Teams Premium - Pretty Secure
 
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxWSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
 
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
 
UiPath Test Automation using UiPath Test Suite series, part 1
UiPath Test Automation using UiPath Test Suite series, part 1UiPath Test Automation using UiPath Test Suite series, part 1
UiPath Test Automation using UiPath Test Suite series, part 1
 
Buy Epson EcoTank L3210 Colour Printer Online.pdf
Buy Epson EcoTank L3210 Colour Printer Online.pdfBuy Epson EcoTank L3210 Colour Printer Online.pdf
Buy Epson EcoTank L3210 Colour Printer Online.pdf
 
Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...
Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...
Choosing the Right FDO Deployment Model for Your Application _ Geoffrey at In...
 
Simplified FDO Manufacturing Flow with TPMs _ Liam at Infineon.pdf
Simplified FDO Manufacturing Flow with TPMs _ Liam at Infineon.pdfSimplified FDO Manufacturing Flow with TPMs _ Liam at Infineon.pdf
Simplified FDO Manufacturing Flow with TPMs _ Liam at Infineon.pdf
 
Speed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in MinutesSpeed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in Minutes
 

Catalog display

  • 2. What we’ll cover Writing our own views Using layouts to decorate pages Integrating CSS / styling Using Helpers Writing functional tests
  • 3. Generate a store controller rails generate controller store index This sets up the scaffolding for /store/index http://localhost:3000/store/index
  • 4. Make / point to the store Right now when you go to http://localhost:3000/ you get the “default” rails page Let’s make / load the store we just created config/routes.rb root :to => ‘store#index’, :as => ‘store’ :as allows us to use store_path later
  • 5. Try it out http://localhost:3000/ Still the default page, why?
  • 6. Try it out http://localhost:3000/ Still the default page, why? Remove public/index.html rm public/index.html
  • 7. Display a list of products available app/controllers/store_controller.rb def index @products = Product.all end app/models/product.rb default_scope :order => ‘title’
  • 8. Update our view app/views/store/index.html.erb
  • 9. Sanitize your HTML We use the sanitize method to escape HTML http://api.rubyonrails.org/classes/ActionView/Helpers/SanitizeHelper.html Also use the image_tag helper to provide <img> tags
  • 10. Adding a page layout Most pages on a site have a similar look Header Side bar Footer application.html.erb is the “default” layout Unless a controller specifies otherwise
  • 11. Application Layout app/views/layouts/application.html.erb curl -o app/views/layouts/application.html.erb http://media.pragprog.com/titles/rails4/code/depot_e/app/views/layouts/application.html.erb
  • 12. New concepts in Layout <%= stylesheet_link_tag “depot”, :media => “all” %> Generates a HTML <link> tag for our stylesheet <link href="/stylesheets/depot.css?1289056297" media="all" rel="stylesheet" type="text/css" /> <%= csrf_meta_tag %> Helps prevent cross site request forgery attacks Covered in detail in chapter 12 <%= @page_title || “Pragmatic Bookshelf” %> If @page_title is defined, print it, otherwise “Pragmatic Bookshelf” <%= yield %> Rails puts the stuff from the app/views/* files in at this point
  • 14. Reload the page http://localhost:3000/ What’s wrong with the prices Displaying 5.0 instead of $5.00 We’ll fix that with a helper
  • 15. Keep code out of your views <%= sprintf(“$%0.02f”, product.price) %> Embeds knowledge in your views Makes internationalization hard Don’t Repeat Yourself Helper methods help you display things in your views
  • 16. number_to_currency app/views/store/index.html.erb <%= product.price %> becomes <%= number_to_currency(product.price) %> Rails provides number_to_currency for you http://api.rubyonrails.org/classes/ActionView/Helpers/NumberHelper.html
  • 17. Write tests! Did we break anything? rake test No failures, yay! Functional tests verify that a model, view and controller work together properly
  • 19. assert_select selectors # matches on id attributes <div id=“mydiv”> => ‘#mydiv’ . matches on class attributes <div class=“myclass”> => ‘.myclass’ No prefix match on element names <a> => ‘a’
  • 20. What do these match? assert_select ‘#main .entry img’ An image tag in an element with a entry class inside an element with an id of main assert_select ‘.sidebar ulli.odd’ An li item with a class of odd inside of a ul item inside of an item with a class of sidebar assert_select ‘span.widediv.even a img’ An image tag within an anchor (a) tag within a div with a class of even within a span with a class of wide
  • 21. What we just did Created a new store controller Made the store controller our root page Made Products be sorted by title by default Implement a view and an application layout Use a Rails helper to format prices Make use of a CSS stylesheet Write functional tests for our controller
  • 22. Homework Add a date and time to the sidebar Investigate the options to number_to_currency and play with a couple http://api.rubyonrails.org/classes/ActionView/Helpers/NumberHelper.html Write some functional tests for the products controller (test/functional/product_controller_test.rb) Commit your work in Git