Ruby on Rails 学习手记(五)

以前以为网上说的30天从入门到精通是吹牛

现在觉得还是有一点可行性的

Day 5

目前进度是第五章

不出意外的话

可以14天从入门到入门

真好

话不多说

第五章看起来有点长

好像提到了html5

rails partials

css

Bootstrap

sass

routes

还有test

先喝一口果汁壮壮胆

在这双十一的日子

我们正式开始第五章的学习

这里说前面做出来的页面只有内容

没有样式

所以我们要来介绍一个样式框架

以及自己添加一些东西进去

同时还要添加用户注册页面

和最后的重要的集成测试

来确保我们app的链接都是正确的

首先

我们大概要把之前的页面重新设计成这样

对比一下

我们现在大概是这样。。。

任重道远啊

as usual

git checkout -b filling-in-layout

老规矩

开始新的工作前

为了避免之前的成果功亏一篑

先建个分支

然后

app/views/layouts/application.html.erb

直接把教程里的代码复制过去先

再慢慢解读每一个变更的

起因经过结果

写一篇600字的分析报告

。。。

有点飘远了

感觉把方向盘转回来

分析报告如下:

增加IE支持

增加了带三个class的header

为什么是三个

为什么选像navbar这样的名字

究竟是道德的沦丧

还是。。。

看来今天不在学习的状态

没办法

各大群都在直播双十一

就我认真在学习Bootstrap

Bootstrap是上面两个为什么的答案

接着link_to是用来添加超链接的

yield是用来插入layout的

这就算是改好了一个页面

接着继续改

app/views/static_pages/home.html.erb

依然是先复制再细看

复制完之后

我随手rails s了一下

结果出错了

因为太急了没下载logo图片

curl -o app/assets/images/rails.png -OL railstutorial.org/rails.png

看来还是要按部就班

对比一下教程里的截图

和自己的成果

一模一样

identical

然后这一小节就结束了

在练习模块里

猫咪乱入

It’s well-known that no web page is complete without a cat image.

说得好

无猫不成站

撸完猫

依依不舍的继续下一小节的学习

现在是凌晨一点多

这首歌已经单曲循环了几十次

我在研究bundle安装bootstrap

修改Gemfile

Bundle install

新建css文件

touch app/assets/stylesheets/custom.scss

@import调用bootstrap

这就是更新后的效果图

手动更新app/assets/stylesheets/custom.scss

再更新

再三更新

瞬间好看多了

略有所得

继续看Partials

这感觉就是把重复的代码块单独拿出来

作为一个partial来调用

有点意思

这很php

果然rails兼顾了很多语言的优点

利用partial的原理

我们把header

footer和shim单独做好

代码简洁多了

界面也好看多了

越来越像一个网站了

再看一下进度条

第五章已经看完一半了

到目前为止

不虚

继续asset pipeline

one of the most useful features of Rails

看概念有点抽象

再怎么抽象也得具象化一下

好吧

大概看懂了

基本就是用来优化(简化)css,script的

先看css

scss,兼容css,用sass写

同时更强大

因为scss支持nesting和variable

看这个light gay的例子

应该能理解

还剩三分之一了

趁热打铁

陈胜追击

吴广。。。抓兔子

关于页面的布局

基本讲的差不多了

现在还有一个小问题

就是页面里的超链接

好像都不能点啊

给他们赋值就好

添加完毕

rails s运行

一个一个点开

都没问题

现在网站小

还能人工一个个点

以后要是大了怎么办

不要紧

有专门的test来。。。

怎么有种打脸的感觉

之前还说test浪费时间来着

rails generate integration_test site_layout

新建一个针对site_layout的集成test

修改test/integration/site_layout_test.rb

有点像css选择器啊

test了一下没有问题

迷迷糊糊继续往下看

练习题也是值得做一下的

不知不觉间

最后一小节了

前面基本就是优化了页面显示

添加了超链接

设置了test来验证这些链接

最后我们要开始接触用户注册功能了

rails generate controller Users new

然后一顿操作猛如虎

rails s

可以了

然而天都快亮了

但是还是得做好收尾工作

$ git add -A

$ git commit -m “Finish layout and routes”

$ git checkout master

$ git merge filling-in-layout

$ git push origin master

存档打卡

生命在于运动

技术改变生活

天大地大

睡觉最大

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20181111G05X6H00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券

玩转腾讯云 有奖征文活动