协作环境和相关配置

操作系统:

OS X操作系统或者Ubuntu12.04操作系统(desktop版本)

相关软件(Ubuntu系统下面):

RVM:ruby版本控制工具
Ruby:2.3.0版本
Rails:4.2.6版本
#下面的数据库两者选择其一
SQLite:最新版本
MySQL:5.5版本及以上
Git:版本控制工具
Java:1.8版本  #因为文件搜索需要用到Java环境

使用git或者github进行代码协作

参考链接

#和jayzen进行协作,开发项目
git clone 项目地址(https和ssh两种形式)
#也可以直接在master分支上操作
git checkout -b dev origin/dev #本地生产远程库中的dev分支,默认只有master分支

#保持和远程库代码的实时更新
git pull  #只对目前所处的分支有效

#本地的文件修改和添加
git add . #添加所有的修改到暂存区
git commit -m "first commit" #将暂存区内容添加到仓库
git push origin dev #提交到远程库的dev分支上

拷贝代码到本地的后续工作

#到本地文件夹下面
bundle install  #安装gem
rake db:migrate  #生成数据库
rake db:seed #生成数据内容
rails g sunspot_rails:install #安装sunspot

#每次启动之前需要执行下面两个步骤
rake sunspot:solr:start #启动solr
rake sunspot:reindex #重新建立索引
rails s #启动服务器
httt://localhost:3000 #访问服务器

操作前端代码

#寻找前端页面的文件
1.html文件位置app/views文件夹内,文件名称后缀为html.erb
2.css文件位置app/assets文件夹内,该文件夹有三个文件
image #放置图片
javascript #放置js代码
stylesheet #放置css代码,后缀为scss

#操作前端代码
1.一般情况下,可以认为view下有几个文件夹,就是有几个资源,比如article,但是有例外,比如layout。
2.以资源article为例,参考浏览器中的链接内容:
/articles  => articles/index.html.erb
/articles/1 => articles/show.html.erb
/articles/new => articles/new.html.erb
/articles/1/edit =>articles/edit.html.erb
3.指向root资源
如果http://localhost:3000有结果,说明程序指定了主页
查找config/routes.rb文件,出现下面语句
root ‘home#index’  #说明主页为home/index.html.erb
4.抽取一个可以被重复使用的页面
比如新建表格和更新表格需要使用同一个表单格式,可以将这个表单独立出来形成文件:
文件格式需要下划线形式:_form.html.erb
#如果引用文件和被引用文件在同一个文件目录中,在引用文件中写入:
<%= render 'form' %>
#如果两个文件不在同一个目录中,index.html.erb在articles文件中,_form.html.erb在layout文件中,在引用文件中写入:
<%= layout/form %>


#理解index.html.erb代码中内容
说明:ruby代码呈现在html文件中,需要添加标签<% ruby代码 %>
如果ruby语句表示判断,只要添加<% ruby代码 %>即可。
如果ruby语句需要呈现在前端,需要添加<%= ruby代码 %>

#rails中的css文件如何修饰html文件
1.rails会智能将stylesheet文件中的css文件合并到application.css文件中
2.rails也会智能将view文件中的html文件合并到application.html.erb文件中
3.rails会智能认为application.css修饰application.html.erb文件,所以不需要特意进行制定。
4.如果要修饰articles/index.html.erb文件,可以在stylesheet文件夹中新建任意文件名的文件,比如demo.scss,文件中的样式对index.html.erb有效。

使用bootstrap框架

#gemfile中添加gem
gem 'bootstrap-sass'
#注意每次在gem中添加内容,都需要终端执行bundle install

#定义自定义的custom.css.scss,文件格式不能错
#如上文件中,添加如下代码,这两行代码会引入bootstrap框架
@import "bootstrap-sprockets";
@import "bootstrap";

#下拉框生效
#application.js中引入bootstrap的javascript库
//= require bootstrap
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 178,316评论 25 709
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 136,442评论 19 139
  • 在还是烈日炎炎的八月下旬,高中新生就要面临着残酷的军训时期了。就在这天,左敏背着自己的行囊,超级开心的来到了她期待...
    盟主M阅读 254评论 0 1
  • 前两天和朋友在一起小聚,他问我,你说读了这么多的书有什么用呢?来到了社会当年在学校念的书基本都就着每天的工作餐消化...
    带着梦想去远方阅读 472评论 0 0
  • 一生中最美好的时光莫过于大学时代,在大学里闲下来时可以慵懒着晒晒太阳,爬爬山,骑骑车等等。如果想要社交广泛你可以参...
    雪儿love2017阅读 1,105评论 0 0

友情链接更多精彩内容