SlideShare a Scribd company logo
1 of 13
Download to read offline
Ruby on Rails
Course Day 5
By @AlSayedGamal
Views Haml and
bootstrap
Agenda
Views, partials and helpers
rendering and layout
adding haml and syntax difference
compared to ERB
adding twitter bootstrap and
responsive grid design basics
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.
Rendering and
layout
Each controller is
associated with
layout.
And each layout
has some regions

represented by
yield statement
and region name
Helpers
Helper example:
form_for
link_to
You can define
your own on app/
helpers folder.
Haml is DRY markdown
cleaner views in action
Haml Simple rules
%tagname#id.class
Twitter Bootstrap
Responsive and grid design in action
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
Add new regions to
layout
-if content_for?
= yield

= yield(:region)
= content_for do
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
Exercise

More Related Content

Similar to Rails course day 5

RoR 101: Session 2
RoR 101: Session 2RoR 101: Session 2
RoR 101: Session 2Rory Gianni
 
Building a Custom Theme in Drupal 8
Building a Custom Theme in Drupal 8Building a Custom Theme in Drupal 8
Building a Custom Theme in Drupal 8Anne Tomasevich
 
Templates, partials and layouts
Templates, partials and layoutsTemplates, partials and layouts
Templates, partials and layoutsKadiv Vech
 
Jasig Rubyon Rails
Jasig Rubyon RailsJasig Rubyon Rails
Jasig Rubyon RailsPaul Pajo
 
Write your Helm charts as a professional. Design templates and inheritance. B...
Write your Helm charts as a professional. Design templates and inheritance. B...Write your Helm charts as a professional. Design templates and inheritance. B...
Write your Helm charts as a professional. Design templates and inheritance. B...Volodymyr Shynkar
 
Ruby On Rails Tutorial
Ruby On Rails TutorialRuby On Rails Tutorial
Ruby On Rails Tutorialsunniboy
 
Zend_Layout & Zend_View Enhancements
Zend_Layout & Zend_View EnhancementsZend_Layout & Zend_View Enhancements
Zend_Layout & Zend_View EnhancementsRalph Schindler
 
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012Andy Maleh
 
The Render API in Drupal 7
The Render API in Drupal 7The Render API in Drupal 7
The Render API in Drupal 7frandoh
 
"Paragraphs are more powerful than you can expect" from Vasily Jaremchuk for ...
"Paragraphs are more powerful than you can expect" from Vasily Jaremchuk for ..."Paragraphs are more powerful than you can expect" from Vasily Jaremchuk for ...
"Paragraphs are more powerful than you can expect" from Vasily Jaremchuk for ...DrupalCamp Kyiv
 
Useful Rails Plugins
Useful Rails PluginsUseful Rails Plugins
Useful Rails Pluginsnavjeet
 
Rails
RailsRails
RailsSHC
 
Angularjs2 presentation
Angularjs2 presentationAngularjs2 presentation
Angularjs2 presentationdharisk
 
AngularJS Fundamentals + WebAPI
AngularJS Fundamentals + WebAPIAngularJS Fundamentals + WebAPI
AngularJS Fundamentals + WebAPIEric Wise
 

Similar to Rails course day 5 (20)

Rails review
Rails reviewRails review
Rails review
 
RoR 101: Session 2
RoR 101: Session 2RoR 101: Session 2
RoR 101: Session 2
 
Building a Custom Theme in Drupal 8
Building a Custom Theme in Drupal 8Building a Custom Theme in Drupal 8
Building a Custom Theme in Drupal 8
 
Templates, partials and layouts
Templates, partials and layoutsTemplates, partials and layouts
Templates, partials and layouts
 
Jasig Rubyon Rails
Jasig Rubyon RailsJasig Rubyon Rails
Jasig Rubyon Rails
 
Actionview
ActionviewActionview
Actionview
 
Write your Helm charts as a professional. Design templates and inheritance. B...
Write your Helm charts as a professional. Design templates and inheritance. B...Write your Helm charts as a professional. Design templates and inheritance. B...
Write your Helm charts as a professional. Design templates and inheritance. B...
 
Ruby On Rails Tutorial
Ruby On Rails TutorialRuby On Rails Tutorial
Ruby On Rails Tutorial
 
Zend_Layout & Zend_View Enhancements
Zend_Layout & Zend_View EnhancementsZend_Layout & Zend_View Enhancements
Zend_Layout & Zend_View Enhancements
 
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
 
The Render API in Drupal 7
The Render API in Drupal 7The Render API in Drupal 7
The Render API in Drupal 7
 
What Is Hobo ?
What Is Hobo ?What Is Hobo ?
What Is Hobo ?
 
Ruby on rails RAD
Ruby on rails RADRuby on rails RAD
Ruby on rails RAD
 
"Paragraphs are more powerful than you can expect" from Vasily Jaremchuk for ...
"Paragraphs are more powerful than you can expect" from Vasily Jaremchuk for ..."Paragraphs are more powerful than you can expect" from Vasily Jaremchuk for ...
"Paragraphs are more powerful than you can expect" from Vasily Jaremchuk for ...
 
Useful Rails Plugins
Useful Rails PluginsUseful Rails Plugins
Useful Rails Plugins
 
Rails
RailsRails
Rails
 
Mvc in symfony
Mvc in symfonyMvc in symfony
Mvc in symfony
 
Angularjs2 presentation
Angularjs2 presentationAngularjs2 presentation
Angularjs2 presentation
 
AngularJS Fundamentals + WebAPI
AngularJS Fundamentals + WebAPIAngularJS Fundamentals + WebAPI
AngularJS Fundamentals + WebAPI
 
Create a new project in ROR
Create a new project in RORCreate a new project in ROR
Create a new project in ROR
 

More from Al Sayed Gamal

9 patterns of microservices
9 patterns of microservices9 patterns of microservices
9 patterns of microservicesAl Sayed Gamal
 
Racist syndrome (composition over inheritance)
Racist syndrome (composition over inheritance)Racist syndrome (composition over inheritance)
Racist syndrome (composition over inheritance)Al Sayed Gamal
 
OpenStack Murano Application Catalog
OpenStack Murano Application CatalogOpenStack Murano Application Catalog
OpenStack Murano Application CatalogAl Sayed Gamal
 
Python Novice to Ninja
Python Novice to NinjaPython Novice to Ninja
Python Novice to NinjaAl Sayed Gamal
 
Web development Hackathon
Web development HackathonWeb development Hackathon
Web development HackathonAl Sayed Gamal
 
Python novice to ninja
Python novice to ninjaPython novice to ninja
Python novice to ninjaAl Sayed Gamal
 
Python 45 minutes hangout #3
Python 45 minutes hangout #3Python 45 minutes hangout #3
Python 45 minutes hangout #3Al Sayed Gamal
 
Python 45 minutes Hangouts #4
Python 45 minutes Hangouts  #4Python 45 minutes Hangouts  #4
Python 45 minutes Hangouts #4Al Sayed Gamal
 
Python45s - Session 01
Python45s - Session 01Python45s - Session 01
Python45s - Session 01Al Sayed Gamal
 
Mansoura University CSED & Nozom web development sprint
Mansoura University CSED & Nozom web development sprintMansoura University CSED & Nozom web development sprint
Mansoura University CSED & Nozom web development sprintAl Sayed Gamal
 

More from Al Sayed Gamal (20)

9 patterns of microservices
9 patterns of microservices9 patterns of microservices
9 patterns of microservices
 
Elixir introduction
Elixir introductionElixir introduction
Elixir introduction
 
Racist syndrome (composition over inheritance)
Racist syndrome (composition over inheritance)Racist syndrome (composition over inheritance)
Racist syndrome (composition over inheritance)
 
Rails course day 8
Rails course day 8Rails course day 8
Rails course day 8
 
Rails course day 7
Rails course day 7Rails course day 7
Rails course day 7
 
Rails course day 6
Rails course day 6Rails course day 6
Rails course day 6
 
Rails course day 3
Rails course day 3Rails course day 3
Rails course day 3
 
Rails course day 2
Rails course  day 2Rails course  day 2
Rails course day 2
 
Rails01
Rails01Rails01
Rails01
 
OpenStack Murano Application Catalog
OpenStack Murano Application CatalogOpenStack Murano Application Catalog
OpenStack Murano Application Catalog
 
Failfast
FailfastFailfast
Failfast
 
Git workshop
Git workshopGit workshop
Git workshop
 
Python Novice to Ninja
Python Novice to NinjaPython Novice to Ninja
Python Novice to Ninja
 
Web development Hackathon
Web development HackathonWeb development Hackathon
Web development Hackathon
 
Python novice to ninja
Python novice to ninjaPython novice to ninja
Python novice to ninja
 
Python 45 minutes hangout #3
Python 45 minutes hangout #3Python 45 minutes hangout #3
Python 45 minutes hangout #3
 
Python 45 minutes Hangouts #4
Python 45 minutes Hangouts  #4Python 45 minutes Hangouts  #4
Python 45 minutes Hangouts #4
 
Python45 2
Python45 2Python45 2
Python45 2
 
Python45s - Session 01
Python45s - Session 01Python45s - Session 01
Python45s - Session 01
 
Mansoura University CSED & Nozom web development sprint
Mansoura University CSED & Nozom web development sprintMansoura University CSED & Nozom web development sprint
Mansoura University CSED & Nozom web development sprint
 

Recently uploaded

What is Binary Language? Computer Number Systems
What is Binary Language?  Computer Number SystemsWhat is Binary Language?  Computer Number Systems
What is Binary Language? Computer Number SystemsJheuzeDellosa
 
EY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityEY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityNeo4j
 
HR Software Buyers Guide in 2024 - HRSoftware.com
HR Software Buyers Guide in 2024 - HRSoftware.comHR Software Buyers Guide in 2024 - HRSoftware.com
HR Software Buyers Guide in 2024 - HRSoftware.comFatema Valibhai
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - InfographicHr365.us smith
 
The Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdfThe Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdfPower Karaoke
 
Salesforce Certified Field Service Consultant
Salesforce Certified Field Service ConsultantSalesforce Certified Field Service Consultant
Salesforce Certified Field Service ConsultantAxelRicardoTrocheRiq
 
Unveiling the Tech Salsa of LAMs with Janus in Real-Time Applications
Unveiling the Tech Salsa of LAMs with Janus in Real-Time ApplicationsUnveiling the Tech Salsa of LAMs with Janus in Real-Time Applications
Unveiling the Tech Salsa of LAMs with Janus in Real-Time ApplicationsAlberto González Trastoy
 
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...MyIntelliSource, Inc.
 
Building Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop SlideBuilding Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop SlideChristina Lin
 
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...gurkirankumar98700
 
Learn the Fundamentals of XCUITest Framework_ A Beginner's Guide.pdf
Learn the Fundamentals of XCUITest Framework_ A Beginner's Guide.pdfLearn the Fundamentals of XCUITest Framework_ A Beginner's Guide.pdf
Learn the Fundamentals of XCUITest Framework_ A Beginner's Guide.pdfkalichargn70th171
 
Unit 1.1 Excite Part 1, class 9, cbse...
Unit 1.1 Excite Part 1, class 9, cbse...Unit 1.1 Excite Part 1, class 9, cbse...
Unit 1.1 Excite Part 1, class 9, cbse...aditisharan08
 
why an Opensea Clone Script might be your perfect match.pdf
why an Opensea Clone Script might be your perfect match.pdfwhy an Opensea Clone Script might be your perfect match.pdf
why an Opensea Clone Script might be your perfect match.pdfjoe51371421
 
cybersecurity notes for mca students for learning
cybersecurity notes for mca students for learningcybersecurity notes for mca students for learning
cybersecurity notes for mca students for learningVitsRangannavar
 
XpertSolvers: Your Partner in Building Innovative Software Solutions
XpertSolvers: Your Partner in Building Innovative Software SolutionsXpertSolvers: Your Partner in Building Innovative Software Solutions
XpertSolvers: Your Partner in Building Innovative Software SolutionsMehedi Hasan Shohan
 
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptxKnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptxTier1 app
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)OPEN KNOWLEDGE GmbH
 
Cloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackCloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackVICTOR MAESTRE RAMIREZ
 
Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...OnePlan Solutions
 

Recently uploaded (20)

What is Binary Language? Computer Number Systems
What is Binary Language?  Computer Number SystemsWhat is Binary Language?  Computer Number Systems
What is Binary Language? Computer Number Systems
 
EY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityEY_Graph Database Powered Sustainability
EY_Graph Database Powered Sustainability
 
HR Software Buyers Guide in 2024 - HRSoftware.com
HR Software Buyers Guide in 2024 - HRSoftware.comHR Software Buyers Guide in 2024 - HRSoftware.com
HR Software Buyers Guide in 2024 - HRSoftware.com
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - Infographic
 
The Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdfThe Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdf
 
Salesforce Certified Field Service Consultant
Salesforce Certified Field Service ConsultantSalesforce Certified Field Service Consultant
Salesforce Certified Field Service Consultant
 
Unveiling the Tech Salsa of LAMs with Janus in Real-Time Applications
Unveiling the Tech Salsa of LAMs with Janus in Real-Time ApplicationsUnveiling the Tech Salsa of LAMs with Janus in Real-Time Applications
Unveiling the Tech Salsa of LAMs with Janus in Real-Time Applications
 
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
 
Building Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop SlideBuilding Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
 
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
 
Learn the Fundamentals of XCUITest Framework_ A Beginner's Guide.pdf
Learn the Fundamentals of XCUITest Framework_ A Beginner's Guide.pdfLearn the Fundamentals of XCUITest Framework_ A Beginner's Guide.pdf
Learn the Fundamentals of XCUITest Framework_ A Beginner's Guide.pdf
 
Unit 1.1 Excite Part 1, class 9, cbse...
Unit 1.1 Excite Part 1, class 9, cbse...Unit 1.1 Excite Part 1, class 9, cbse...
Unit 1.1 Excite Part 1, class 9, cbse...
 
why an Opensea Clone Script might be your perfect match.pdf
why an Opensea Clone Script might be your perfect match.pdfwhy an Opensea Clone Script might be your perfect match.pdf
why an Opensea Clone Script might be your perfect match.pdf
 
cybersecurity notes for mca students for learning
cybersecurity notes for mca students for learningcybersecurity notes for mca students for learning
cybersecurity notes for mca students for learning
 
Call Girls In Mukherjee Nagar 📱 9999965857 🤩 Delhi 🫦 HOT AND SEXY VVIP 🍎 SE...
Call Girls In Mukherjee Nagar 📱  9999965857  🤩 Delhi 🫦 HOT AND SEXY VVIP 🍎 SE...Call Girls In Mukherjee Nagar 📱  9999965857  🤩 Delhi 🫦 HOT AND SEXY VVIP 🍎 SE...
Call Girls In Mukherjee Nagar 📱 9999965857 🤩 Delhi 🫦 HOT AND SEXY VVIP 🍎 SE...
 
XpertSolvers: Your Partner in Building Innovative Software Solutions
XpertSolvers: Your Partner in Building Innovative Software SolutionsXpertSolvers: Your Partner in Building Innovative Software Solutions
XpertSolvers: Your Partner in Building Innovative Software Solutions
 
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptxKnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)
 
Cloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackCloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStack
 
Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...
 

Rails course day 5