第九次视频——Rails框架概况——的文稿

这一次视频讲一下Rails框架的概貌,以及一个Rails Web应用为什么会这样运行。我们先从外表看一看,然后再从表面逐渐往深处学习,学习,就要由浅入深,先从表面上来学,然后逐渐的学习原理。不止是编程如此,我觉得任何技巧都是如此,表面功夫,浅显的知识用的最多,可能占九成,深入的功夫,用的实际上是比较少的,可能只占一成。这也就所谓的九浅一深的来历。

在Rails开发中,大部分都是重复的用法,只要掌握了,并不比数据库的增删查改困难多少。

我接下来会把Rails框架拆解一下讲一讲大概的原理。

A. 英语的重要性

平常我都会说,学好英语对计算机有重要的意义,如果那时候算是有用的废话的话,在Rails里,那可真的是有特别重大的意义。因为这里的英语已经不仅仅是起个变量名什么的了,变量名的单复数已经开始决定程序能否可以正常运行了。

在给数据库建立表项的时候,正确的使用英语的单复数,将会有特别神奇的事情发生。这个机制在Rails里叫Inflector或者Inflections。具体翻译成啥我也不清楚。在讲到数据库的时候,我们还会再看到这个东西,到时候再细讲,现在是九浅阶段,这个阶段只要大体了解Rails就好。

这个阶段先有个印象就好,英语名词的单复数在Rails里非常的重要。

B. 静态页面

所谓的静态页面,就是你写一个HTML页面,然后通过网络传到最终用户的电脑上。这个其实没有太多的技巧,你写什么东西,就会给你发送什么东西。

因为不变,所以叫静态的。

现在有一些博客也逐渐开始在技术人员的小圈子里流行,就是静态博客,比如Hexo和Jekyll。这种博客软件的原理就是在本地将文件(用户写的文章+主题)生成最终的HTML文件,然后上传到服务器上。

静态页面主要是HTML+CSS组成的。

在Ruby on Rails中也有静态页面。我们可以打开我们上次的项目,看到有一个文件夹的名字叫public,这个里面的文件就是静态文件。比如说有404.html,这个大家都非常熟悉。500.html是服务器内部出现了一个错误,没法响应了。

如果我们也有什么要用到的静态文件,也是可以放在这个文件夹里的。

静态文件就是HTML文件,原封不动的发送给客户端。

C. 动态页面

现在我们用的都是动态页面,动态页面能做静态页面做不了的事,现在我们登录的网站,比如douban.com这都是动态网站。我们看到的HTML内容都边请求边生成的,否则的话,我们就没法在网上吵架了。

比如在douban和weibo这种网站上吵架,流程大概是这样的:

  1. 有个人发了个帖子,这个帖子会通过网络存到weibo的服务器上。
  2. 然后有人恰好有人刷微博,这个帖子会刷出来,整个过程都是动态的。
  3. 这个人可能看了一眼这个帖子,就开始喷了,这些喷的话,会再次传回weibo的服务器里,并存储在数据库里
  4. web会自动刷新页面,然后提示发帖子的人,有人骂你了
  5. 然后再不停的重复3-4,两个人开始进入循环状态,基本上骂战不可能分出胜负的

我们可以推测一下,到最终用户电脑上的HTML页面,肯定不是事先就写了的。肯定有一个软件自动生成了这个HTML页面,然后将这个页面发送给了最终用户。

在Rails中,用的机制是erb(embedded Ruby),就是将ruby代码嵌入到HTML文件中,在发送给用户之前,先执行一遍,在执行的过程中,会将ruby代码运行的结果输出成HTML,从而生成动态的页面。

同样的道理,在PHP中,也是将PHP运行以后,生成的结果输出成HTML文件。

用代码做个实验(详见视频),实验中主要讲清以下几个知识点:

  1. 如何使用git新建一个分支以及这么做的好处
  2. 如何生成Controller以及Controller的方法和相关的View
  3. 如何在view(erb)文件中编程,生成动态内容
  4. <% %> 和 <%= %>的区别以及其中隐含的一个类型转换(to_s)

D. Layout布局

当我们右键去查看客户端页面源代码的时候,就会发现,这里有一些不是我们写的,不知道哪里跑出来的东西。那么这些东西是哪里来的呢?

简单的来说,是Ruby on Rails帮我们生成的。

当我们用rails g controller命令生成controller的时候,同时还会生成与之相关的方法,还有与方法相关联的view,这个view是以.html.erb结尾的。我们编程的时候,大部分也是处理的这个文件。但是在生成最终的HTML发送给客户端的时候,并不是这么简单,只把这个view.html.erb发送过去,而是以这个view为核心,将其再包装到另外的一个文件之中,那个文件是:

app/views/layouts/application.html.erb

可以用文本编辑器打开这个文件,里面的内容如下:

<!DOCTYPE html>
<html>
  <head>
    <title>Lmzdx2</title>
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>

    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
  </head>

  <body>
    <%= yield %>
  </body>
</html>

在这里最重要的是倒数第三行

<%= yield %>

这一行的作用是直接将生成的每个controller所对应的view.html.erb文件包含进来。在我们这个例子之中,就是包含test.html.erb文件进来。

如果大家对application.html.erb中其它的文件内容有好奇的话,这个以后在讲到asset pip eline这个技术的时候再详细去讲,现在暂时先放一下,我们关注重点,抓大放小。我可以稍微的说一下这个asset pipeline是什么东西,为什么要用这么个技术。详细的技术和实现原理以后再讲。

因为我们做任何网站的时候,都要用到一些静态资源,这些静态资源包括但不限于CSS文件,JavaScript文件和一些图像。如果只有一个人开发,像我这样,没什么关系,难就难在要是这个开发是团伙作案,就不容易了。比如说张三用这个资源,李四用那个资源,可谓是蛤蟆坑的叫声,从来不是一个调。这怎么办呢?

方法是建立几个文件夹:

  1. app/assets这个文件夹里放当前正在跑的应用的静态资源文件。
  2. lib/assets这个文件夹里放开发团队自己开发的一些静态资源文件
  3. vendor/assets这个文件夹里放第三方的一些静态资源文件

这样的话,就不会出错了,虽然不简单,但是团队作案就这样,要互相配合一下。这样是不是就解决了问题呢?

只能说解决了部分问题吧。用我前面所说的方法,解决了开发的问题,但是没有解决production的问题。在部署的时候,要的是传输速度,开发使用的CSS和Javascript文件,为了程序员方便,这些文件中有大量的空格和注释。但是对传输来说,这些空格和注释除了占用带宽,一点用处也没有。这样,不如取消了。于是,asset pipeline就是对这两个需求妥协。

asset pipeline还有很多可以讲的,但是最主要的目的就是我所讲的,同时兼顾开发时候的程序员和布署时候的快速。具体的内容,比如预处理引擎什么的,以后再说。

网站的布局是application.html.erb文件控制

如果要改变网站的布局,也是修改这个文件。如果要添加其它的布局,可以在app/views/layouts这个文件夹里添加,具体情况具体分析,在此处,为了保持足够简单,我暂时不修改任何东西了。

E. Controller和View之间传递值

在写代码的过程中,经常犯的一个错误就是把原本属于controller的代码写到view中,我也经常这样写。但是,这样写是最简单的,因为这么写最明显了,凭借本能就可以写出这样的代码,并且在以前的时候,PHP还鼓励这样写,但是,这样写会有个问题,以后代码会越来越难以修改。

要把一段代码比较清晰的分在Model中,Controller中还是View中是要花很多时间去学习的。我绝对不敢说我能将一段代码完美的分配到不同的文件里。在这里为了演示,我们再来看看前一段演示代码,看看如何去修改会更符合MVC的标准。

视频演示,主要讲清楚这几个知识点:

  1. 为什么上一个演示中把逻辑写入view中虽然可以用,但是不够好
  2. 如何在view和controller中传值

这样的好处是,如果有多个国家的用户,只要在controller做相应的修改,view完全不用修改,就可以获得每个用户的准确时间。

虽然做的这个修改是非常简单的,但是仍然是值得鼓励的,毕竟这是向MVC的方向前进了一小步。这一小步让后端的前端的人都能受益。还有一点是view页面中会对传过来的值自动进行字符串处理,隐含着调用了to_s方法。

F. Partial Views(部分视图)

当我们在做一个web项目的时候,如果很小的项目,比如说就1-2个页面的话,其实怎么写都可以,如果页面变得非常的多,是一个网站了,就会有很多重复的地方,比如说,每个页面可能都有相同的页眉,相同的导航栏,相同的页脚什么的,如果这时候还是每次都要重复一下,以后改起来会麻烦死,因此Rails提供了一个非常方便的机制:

只要把部分视图保存在app/views/这个目录下,并且以下划线( _ )开始,比如 _footer.html.erb 文件,然后在需要插入footer的地方,调用这样一条语句即可:

<%= render "footer" %>

在现实中,也可以在app/views/这个文件夹下建立其它的文件夹。比如可以建立shared文件夹,但是,此时调用的时候要加上这个文件夹的名字。

<%= render "shared/footer" %>

使用部分视图也是任何web编程中都会采用的技术,这种技术的原理是DRY(Don’t Repeat Youself) 

视频演示,主要讲这几个知识点:

  1. 如何使用部分视图
  2. 如何向部分视图中传值

《第九次视频——Rails框架概况——的文稿》有2个想法

发表评论

电子邮件地址不会被公开。 必填项已用*标注