编程向左,人生向右

去发现,去追求

Rails 程序中的布局

rails中的layout是指每个页面中都会出现的部分。比如说页面顶部的导航条(header)和页脚(footer),每个页面中都会出现,所以把它们的代码放到layout中最合适。

下面的笔记是读railsapps的Rails Application Layout教程记录下来的:

  • HTML5 Boilerplate从2010年开始推荐前端的一些“最佳实践”
  • 可以用前端框架来配合rails使用:
    • Bootstrap
    • Foundation
  • stylesheet_link_tagjavascript_include_tagRails asset pipeline中添加CSS stylesheets和Javascripts
  • data-turbolinks-track属性添加对Rails Turbolinks的支持
  • csrf_meta_tags元素是一个view helper,用于用户在表单中输入数据的时候,防止跨站请求的伪造( cross-site request forgeries)
  • yield这个关键字用来插入rails中view的内容。参考RailsGuides Layouts and Rendering in Rails部分,解释了Rails如何将view和layout结合起来
  • $ rails generate layout:install simple --force生成一个layout,--force参数用来替换当前的app/views/layouts/application.html.erb文件
  • viewport metatag用来让页面在手机上显示的效果更好。设定一个viewport告诉浏览器如何让内容适应屏幕。apple的开发者文档中如何配置viewport有详细的说明
  • 如果你想调用外部的javascript来执行,可以在body中添加类来区分开每个页面,让javascript在指定的页面中执行:<body class="<%= controller_name %> <%= action_name %>">。具体可以参考railsapps上的给Rails添加JavaScript这篇文章
  • html5元素
    • <header> 用于branding或者导航
    • <main>中的内容对于一个页面来说是这个页面独有的,因此就不包括导航,网站logo,页脚等。W3C建议使用ARIA role=“main”属性给main元素添加残疾人的支持。
  • flash message:rails提供的一套标准的惯例来显示警告(alert)和通知(notice),叫做flash message。这个名字来源于flash memory。具体可以参考RailsGuides的文档
  • content_tag view helper: <%= content_tag :div, msg, :class => "flash_#{name}" %>(完)

Comments