Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Rails course day 5


Published on

Rails have a nice template engine called erb and it's cool however haml is super cool and in this class we practiced using haml along with bootstrap while understanding partials and helpers.

Published in: Software
  • Be the first to comment

  • Be the first to like this

Rails course day 5

  1. 1. Ruby on Rails Course Day 5 By @AlSayedGamal
  2. 2. Views Haml and bootstrap
  3. 3. Agenda Views, partials and helpers rendering and layout adding haml and syntax difference compared to ERB adding twitter bootstrap and responsive grid design basics
  4. 4. Views, partials and helpers Views are loaded by convention. Normal content will fall in main yield part. _ prefixed files are called partials and are rendered inside views for reusability sake. Example: _form in any scaffold.
  5. 5. Rendering and layout Each controller is associated with layout. And each layout has some regions
 represented by yield statement and region name
  6. 6. Helpers Helper example: form_for link_to You can define your own on app/ helpers folder.
  7. 7. Haml is DRY markdown cleaner views in action
  8. 8. Haml Simple rules %tagname#id.class
  9. 9. Twitter Bootstrap Responsive and grid design in action
  10. 10. Installation and Usage add following gems to your Gemfile and bundle gem 'twitter-bootstrap-rails' gem 'haml' gem ‘haml-rails' now install bootstrap static assets rails generate bootstrap:install static Generate fluid layout rails g bootstrap:layout application fluid* Scaffold and style rails g bootstrap:themed <scaffold_model>s *remove the .erb default one
  11. 11. Add new regions to layout -if content_for? = yield
 = yield(:region) = content_for do
  12. 12. Associated Model form best practices Use
 ”accepts_nested_att ributes_for” to accept data from associated model. Use
 “fields_for” to show this associated model fields. Use ”validated_associate d” to validate related model Use
 form builder’s collection_* to link related models
 Example: collection_select
  13. 13. Exercise