2 : Ruby on Rails 的基础

上章:什么是网路?

Header2

0 : 这个章的目的

 理解用 Ruby on Rails 作网路的方法,作 Ruby on Rails 的动作环境。


1 : Ruby on Rails

从这个章,我們解释作网站的方法。
在这里,我們使用 Ruby on Rails 的软件作网站。

在上章解释了「网路在作资料的显示跟保存」
Ruby on Rails 是会先做好简单的网站。然后在这个做好的网站上自己设定「资料的显示跟保存」,作自己的网站。

 在 Ruby on Rails是,自己设定「资料的显示跟保存」作网站的软件。
 Ruby on Rails 是要设定什么呢?

自己设定的內容有两个。
第一个是网页,第二个是资料

 ① : Ruby on Rails的网页


为了作网站,Ruby on Rails上必须要自己设定这么样显示网页。

可是网站不只是在显示网页,还必须要保存资料。在 Ruby on Rails 上,随着资料显示跟保存的方法,有几个作网页的方法。
用 Ruby on Rails 作网站的时候要用这个资料的显示跟保存的方法,自己设定网页。

我們用Twitter的例子,解释 Ruby on Rails 上的资料的显示跟保存的方法跟设定的网页吧。
 资料的显示
Tweet index and show 在这个网页,显示在资料库里保存的资料。
显示的方法有两个。一个是显示资料库里全部的资料的方法,另一个是选择资料库里的资料的方法。

有两种的是,可以说是推特的主页推特的差别。
 作资料
Tweet new 在这个网页,保存利用者打入的资料。
这里有打入內容的网页跟保存资料的网页。
 编辑资料
Tweet edit 在这个网页,随着打入的內容,更新利用者选择的资料
这里也有打入內容的网页跟随着打入的资料更新资料的网页。
 删除资料
Tweet destroy 在这个网页,从资料库里删除选择的资料。
 Ruby on Rails上,自己设定这么样作资料的显示,新增,编辑,删除的四种网页。


 ② : Ruby on Rails的资料


我們解释了,Ruby on Rails是随着资料的显示跟保存的方法自己设定要这么样作网站的软件。
我們解释好了资料的显示,呢么资料的保存是这么样做呢?
在上章说明了,利用者发信的资料会保存在动网站的机器(服务器)里的资料库里。这个保存资料的资料库在做「资料的保存」。
Fb save data
用Facebook的例子的话,

利用者的投稿
  • 投稿的人的名字是「山田太郎」
  • 投稿的內容是「Hello world」
  • 地方是「東京都新宿」
  • 图像是「沒有」
  • 等等...

这样子的资料会保存在动网站的机器(服务器)里的资料库(Excel软件的表)

在Ruby on Rails上保存下來的资料也是一样,利用者发信的资料会保存在动网站的机器(服务器)里的资料库里,然后这个资料会显示在网页上面。
所以在 Ruby on Rails上,首先為了要保存资料作资料库
之后自己设定资料的新增,编辑,删除

  • 作资料库
  • 用Facebook的例子说的话,作可以保存名字,內容,地方 等等的资料库(Excel软件的表)。

  • 资料库上保存利用者的资料
  • 新增,编辑,删除在网页上打入的资料。

 ⑴ : 作资料库


为了资料库里保存资料、先决定好要打入这么样的资料。
用 Excel 软件的时候打入资料之前,也先決定好最上面的一行吧?

跟这个一样,作资料库的时候要先作好最上面的一行
使用这个一行,保存利用者打入的资料。
Ruby on Rails上保存资料的时候,必须要決定好最上面的一行

我們用 amazon 的商品解释。 Amazon expensive amazon的商品上有「商品的名字・价钱・图画・消费者评鉴」等等的资料,这些资料会保存在资料库里。
基本的简单的资料库会是下面的样子吧。 Amazon database
 在Ruby on Rails,要自己设定这样子资料库的最上面的一行。
 想想看 Twitter 的第一行是这么样子设定吧。


 ⑵ : 资料的保存


网站上按着打入的资料,新的资料会保存在资料库里。
用Facebook投稿的例子说的话,利用者投稿后,资料库会有新投稿的资料。 Fb database 虽然Ruby on Rails的网站是随着資料保存的方法,指定各个资料保存的網頁,但是资料的保存要跟资料的显示另外设定。

所以除了网页的显示以外,各个网页上要设定
  • 显示什么资料」
  • 新增什么资料」
  • 编辑什么资料」
  • 删除什么资料」
等等要这么样操作资料(资料的显示,新增,编辑,删除)的设定。
 Ruby on Rails上的资料的保存是、先作资料库之后,自己设定要这么操作资料。


 ③ : 总结


Ruby on Rails是先做好的简单的网站之后,在这里设定网页的显示跟资料的操作。



2 : Ruby on Rails的准备

我們解释了, Ruby on Rails 是这么样作网站。
但是用 Ruby on Rails 作网站的时候,Ruby on Rails以外还有需要的软件。

在这里,我們安裝 Ruby on Rails跟其他软件。在这里作可以用 Ruby on Rails 作网站的环境。





 用 Windows 的电脑的话、请看这里的说明








先解释安装的时候要用的「terminal」的应用程序吧。


 ① : terminal


先打开「terminal」的应用程序。参考下面的图像打开看看吧。 Terminal open Terminal open done 「terminal」有打开了嗎?
这个「terminal」是在做什么呢?
 「terminal」是什么样的应用程序呢?

「terminal」是,给电脑命令的应用程序。
Ruby on Rails 的网站是用「terminal」的命令作。
 在这里用terminal,移動桌面(Desktop)里吧!

用半母字母数字打入「cd Desktop」之后,点击「Enter」吧。
有没有显示,像下面一样的新的一行嗎?
下面图像的红线在表现现在的位置。现在在DesktopTerminal cd desktop after 用「cd」、可以移动到指定的文件夹Finder desktop  用「cd」,移动到「Desktop」里的自己喜欢的文件夾吧。
  打入「open 文件的名字」,可以打开指定的文件。

※ 打入「cd ..」可以移动到前面的文件夾、打入「cd ~/Desktop」可以移动到「Desktop」。
※ 使用半母字母数字打入。


 ② : Ruby on Rails 的安裝


呢么,咱們安裝 Ruby on Rails 吧!
这个有一点长,加油!

安裝的环境是
  • Ruby 2.1.3
  • Ruby on Rails 4.2.6

如果已经安裝好的话、不用再安裝环境。看下一個安裝吧!

 我們先安裝叫做「Command Line Tools」的软件。

 请准备好AppleID,用AppleID从这里登录。
※ 注册AppleID请從这里做

有下面一样的画面嗎? Chrome apple developer 從这里安裝Command Line Tools
 安裝之前,先确认Mac的环境。
※ 随着Mac的环境,安裝的东西也不同。请注意。

跟下面一樣子,点击 ,之后点击里面的About This MacSettiing about this mac 会显示下面的画面,请确认红线的地方。 About this mac overview About this mac overview detail 确认您 Mac 的环境之后,参考下面表下载「Command Line Tools」。
Mac的环境 Command Line Tools
10.11.x Command Line Tools(OS X 10.11)for Xcode x.x.x
10.10.x Command Line Tools(OS X 10.10)for Xcode x.x.x
10.9.x Command Line Tools(OS X 10.9)for Xcode x.x.x
10.8.x Command Line Tools(OS X Mountain Lion)for Xcode x.x.x
10.7.x Command Line Tools(OS X Lion)for Xcode x.x.x
如果有几个的话,选最新的东西吧!

下载之后,打开download」文件夾,点击刚刚下载的文件, Finder downloads command line tools 之后打开安裝的文件就OK了。 Finder command line tools
 咱們安裝「Ruby on Rails」。
在terminal上,打入下面的命令吧。


  在这里我們使用terminal。
   呢么,打开看terminal吧。

※ 打开terminal的方法请参考这里 Terminal open 打开之后打入,

 terminal(用半角字母数字打入)
1 cd

这样,terminal回到刚开始打开的时候的地方。

 呢么,开始吧!

  • Homebrew的安裝

  • 先打入下面的命令。这个是安裝叫做Homebrew的工具。
    选择文字之后点击Command」跟「c可以复制文字,点击Command」跟「v可以黏贴复制的文字。

     terminal(用半角字母数字打入)
    1 ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

    途中会有要求打入密码,那个时候打入自己电脑Mac的密码吧。

    安裝完了之后,打入

     terminal
    1 brew -v

    之后,显示Homebrew的环境的话OK。
  • rbenv跟ruby-build的安裝

  • 這两个工具在管理,动「Ruby on Rails」的叫做「Ruby」的程序语言的版本
    呢么,开始安裝吧!在terminal上,打入下面两个命令。

    ※ 选择文字之后点击Command」跟「c可以复制文字,点击Command」跟「v可以黏贴复制的文字。

     terminal(用半角字母数字打入)

     有时候,会有不能做复制与黏贴。那个时候,请直接打入。
    1 brew install ruby-­build

     terminal(用半角字母数字打入)
    1 brew install rbenv

    这样安裝好了!

     可是现在的状态还不能用,请打入下面的命令。

    ※ 选择文字之后点击Command」跟「c可以复制文字,点击Command」跟「v可以黏贴复制的文字。

     terminal(用半母字母数字打入)
    1 echo 'eval "$(rbenv init -)"' >> ~/.bash_profile

    之后,打入

     terminal(用半母字母数字打入)
    1 source ~/.bash_profile

    这样设定好了。
  • readline的安裝

  • 为了避免汉子的乱码,安裝叫做readline的工具。

    打入下面的命令,安裝「readline」吧!

    ※ 选择文字之后点击Command」跟「c可以复制文字,点击Command」跟「v可以黏贴复制的文字。

     terminal(用半母字母数字打入)
    1 brew install readline

     下次设定为了使用「readline的命令。

    ※ 选择文字之后点击Command」跟「c可以复制文字,点击Command」跟「v可以黏贴复制的文字。

     terminal(用半母字母数字打入)
    1 brew link readline --force

     terminal(用半母字母数字打入)
    1 RUBY_CONFIGURE_OPTS="--with-readline-dir=$(brew --prefix readline) --with-openssl-dir=$(brew --prefix openssl)"

  • Ruby 的安裝

  • 用刚才安裝的「rbenv」,安裝在动「Ruby on Rails」的叫「Ruby」的程序语言

    在这里安裝环境是「2.1.3」的「Ruby

     terminal(用半母字母数字打入)
    1 rbenv install 2.1.3

    这样安裝好了!咱們打入准备启动「Ruby」的命令。

     terminal(用半母字母数字打入)
    1 rbenv rehash

    这样安裝跟准备好了,咱們设定Ruby」的环境吧。打入下面的命令。

     terminal(用半母字母数字打入)
    1 rbenv global 2.1.3

    这样设定好了。打入下面的命令。

     terminal(用半母字母数字打入)
    1 ruby -v

    这样确认Ruby」的版本
    显示2.1.3的话OK。
  • rails 的安裝

  • 最后,安裝Ruby on Rails
    先、安裝味了使用Ruby on Rails」的工具

     terminal(用半母字母数字打入)
    1 gem install bundler

    下次安裝「Ruby on Rails

     terminal(用半母字母数字打入)
    1 gem install rails

    下次在打入

     terminal(用半母字母数字打入)
    1 rbenv rehash

    打入完后,确认Ruby on Rails」的版本。

     terminal(用半母字母数字打入)
    1 rails -v

     这样安裝好「Ruby on Rails」了!


 ③ : Sublime Text的安裝


咱們安裝,编辑设定文件的文件编辑软件Sublime Text
首先,移动到Sublime Text的主页、下载文件。

请打开这里

显示下面一样的画面了嗎? Chrome sublime text 之后点击Download for OS X,开始下载。
下载完了之後,打开download」文件夾找有沒有下载的文件。 Finder downloads sublime text 点击之后, Finder after download sublime text 会这样显示。

边按「Shift」点击这里面的「Sublime Text」的图标,之后移动图标到「Applications」文件夾。 Finder move sublime text to applications 这样Sublime Text的安裝好了。
 为了确认,在打开一次吧。

点击右上边的放大镜标记、打入看看「Sublime Text」
Spotlight find sublime text 打入完后,点击Enter按键就可以打开「Sublime Text」了。 Window sublime text 有沒有出现这样子的画面嗎?
我們会用这个Sublime Text


 ④ : MySQL的安裝


在这里我們会用叫做MySQL的资料库。咱们安裝MySQL吧!
先打开termial、之后打入「brew install mysql」。

 terminal  
※ 用半母字母数字打入
1 brew install mysql

打入之后,显示下面一样的话OK!
==> Downloading https://downloads.sf.net/project/machomebrew/Bottles/mysql-5.6.22.yosemite.bottle.tar.gz
######################################################################## 100.0%
==> Pouring mysql-5.6.22.yosemite.bottle.tar.gz
==> Caveats
A "/etc/my.cnf" from another install may interfere with a Homebrew-built
server starting up correctly.

To connect:
    mysql -uroot

To have launchd start mysql at login:
    ln -sfv /usr/local/opt/mysql/*.plist ~/Library/LaunchAgents
Then to load mysql now:
    launchctl load ~/Library/LaunchAgents/homebrew.mxcl.mysql.plist
Or, if you don't want/need launchctl, you can just run:
    mysql.server start
==> /usr/local/Cellar/mysql/5.6.22/bin/mysql_install_db --verbose --user=tasukujp --basedir=/usr/local/Cellar/mysql/5.6.22 --datadir=/usr/local/var/my
==> Summary
🍺  /usr/local/Cellar/mysql/5.6.22: 9666 files, 339M

然后,打入下面的命令吧。
※ 一个一个复制与粘贴之后、请在terminal打入

 terminal  
※ 用半母字母数字打入
1 ln -sfv /usr/local/opt/mysql/*.plist ~/Library/LaunchAgents

 terminal  
※ 用半母字母数字打入
1 launchctl load ~/Library/LaunchAgents/homebrew.mxcl.mysql.plist

 到这里,Mysql的安裝完成了。


 ⑤ : Sequel Pro的安裝


在这里咱們安裝,简单的显示资料库里面的表的软件Sequel Pro吧。

 下载Sequel Pro(点击之后下载会开始)

下载完了之后,请打开下载的文件(普通的话,文件在download文件夾里)。 Sequel pro open 打开之后会出现像下面一样的画面、参考下面的图像点击「Connect」。 Sequel pro 显示下面的画面的话OK! Sequel pro main page


 恭喜你!这样作網站的环境作好了!
从下一章,用 Ruby on Rails 开始作网站吧。