[Ruby on Rails] 03. [Mac] 安裝程式編輯器與變更網站首頁

在開始修改程式之前，我們需要一個程式編輯器。課程裡面用的都是Adobe 的 Brackets，當然你也可以用Atom 或是 Sublime Text，在Rails的開發學習中使用哪一個基本上沒太大的差異，選你用的順手的就可以了。

 

第一件事情就是延續上一堂課，我們需要用到終端機(Terminal)，你可以使用搜尋的方式找到它，也可以在Finder裡面->應用程式(Applications) -> 工具程式(Utilities)-> 終端機(Terminal)。 找到以後就把他鎖在Dock上，以我們的(將來的)工作內容來說，幾乎每天都會用到它。所以還是跟他熟悉點比較好。

 

這邊複習一下指令，從常見Bash commad開始。那什麼是Bash?

 

 

最簡單的理解就是，因為電腦是很笨的，就連鍵盤輸入與程式輸出文字結果都需要"指定"。就算是Standard(基本/標準)輸入輸出，其實都是要設定的，更不用說如果我們想要執行各式各樣的「指令(command)」，至少我們要先知道「指令」放在哪裡。所以在作業系統的演進裡面，就出現了所謂的命令處理器。

 

終端機(Terminal)打開後，會從使用者設定裡面找到一個命令處理器去執行，執行成功就可以開始使用指令了。命令處理器自己本身也是個指令，就叫做bash。你可以嘗試執行bash，執行完畢後你會跳到另外一個新的命令處理器程式裡面，你可以下exit離開。不過這不是我們這堂課的重點，總之先知道我們的終端機開啟後在跑bash。這邊要講一下「Terminal」這個詞， 如果大家有坐過捷運到終點站的話，應該會聽到「Terminal station」這個詞，也就是終點站。那為什麼我們輸入的程式會被稱之為Terminal呢？這就要從「網路」去想。

 

網路他是由一台電腦做為「點」，兩台電腦組成「線」，三台以上就可能有面的概念，再更多的話就會變成「網」。你發出要求到某一台主機(比方說progressbar.tw)，這台主機會回你一段資料給你，兩邊互相傳輸的時候會經過很多「點」，網站把資料交給A電腦, A交給B，B交給C，C.....某台電腦交給你。所以你就是「終點」，中間過往的電腦都只是轉交而已直到你停下來...做什麼？當然就是下命令摟！所以Terminal其實是一種概念，網路末端的人機輸入介面而已，有很多程式可以滿足這個功能，其中一個就是Bash。

 

Mac預設終端機就是跑bash，同時bash也知道很多預設安裝的程式(也就是指令)的所在位置，一般來說都在：

1. /bin/

2. /usr/bin/

3 /usr/local/bin/

...  還有一些其他的，你可以看$PATH看出來有哪些。$PATH是系統變數，記錄著指令所在位置，只要在$PATH所記錄的位置，你都可以直接使用該程式。例如cd 是在 /usr/bin/ 底下，ls 是在 /bin/ 底下，你可以使用whereis這個指令去看其他指令所在位置，而whereis自己也是在 /usr/bin/ 底下。

 

 

上面一下指令，一下程式，搞得你很亂。其實這是故意的，因為指令就是程式。如果你用C語言寫了一個程式編譯過了以後就會變成可執行檔，然後如果把這個可執行檔放進上面的路徑其中之一，你就會發現它變成指令了！！

 

 

那我們現在回到Rails來，在上一篇文章裡面，我們嘗試了rails server (可縮寫成 rails s)。你有想過，這個rails為何突然可以用嗎？原因很簡單，因為rvm把ruby與rails裝好後，rvm 把rails丟進/usr/bin/裡面(另一個常用的指令 rake 也在裡面)。 所以我們自然就可以直接使用 rails s 而非使用絕對路徑 ./...PATH/rails s

 

 

 

複習一下指令，我們常用的有

1. pwd => 看目前路徑

 

2. ls    => 看當前資料夾內容

 

3. cd   => 進入某個路徑，例如cd Desktop，進入桌面。小技巧，當你打路徑的時候，如果不想打那麼多字，可以使用tab鍵讓它自動完成。如果同一個路徑底下有兩個一樣字首的路徑的話，你可以連按兩下tab，他就會顯示你可能的路徑選項，但是這樣不會自動完成。

 

 

4. cd ~ => 小蝌蚪 ~ 代表的是家目錄，所以無論你在哪個路徑想要回家目錄的話，可以直接使用cd ~

 

 

5. rm => 刪除檔案，rm [檔案路徑] 這樣去刪，但是無法刪除資料夾。想要刪除資料夾的話需要自帶參數為 rm -rf [檔案路徑]，r代表的是recursive(遞迴)，意思就是如果資料夾裡面還有資料的話，就一起刪掉。f代表的是force(強制)，如果不下f的話，他會再確認。如果一次刪大量的檔案，每個都要再確認很惱人。這邊特別提醒，rm -rf 是一個相當強力的指令，歷史上造成了無數的悲劇，每個工程師在他的生涯裡面都會碰到幾次。希望各位發生意外的時候，是有版本管理的。

 

 

接下來介紹一下這堂課會用到的 rails指令。

1.  rails new [project name]，建立新的rails專案。專案名稱有一些不能用此方式產生，例如test。

2. 進入 [project] 後執行rails s 啟動 web server。啟動成功就可以在http://localhost:3000 上看到。如果要跳出，必須用bash的快速鍵，ctrl + c。強制終止程式。

3. rails g controller [controller name] => 在專案中新增controller

 

 

 

 

那現在開始正式的修改首頁！！

 

 

Ruby on Rails 是一個遵守MVC概念的框架，所以主要有Model - View - Controller。其中因為Model曾跟資料庫有關，所以先不介紹。我們這邊要介紹的是View 和 Controller。

 

無論是MVC的那一段，最基本的部分都會放在 [專案]/app/  裡面，其中包含 controllers / models / views。我們之後大多數的時間都在關心這三個資料夾，所以位置要記好。如果要產生新的頁面，必須包含一個controller 而且裡面必須要有一個action method。聽起來很玄，但其實照做的話就跟下圖一樣而已。然後必須要在views 裡面也包含 [controller name]/[action].html.erb 之類的檔案。

 

 

 

例如建立這兩個檔案：

app/controller/home_controller.rb

app/views/home/index.html.erb

可以使用$ rails g controller home 來達成

 

 

之後修改home_controller.rb ，在裡面的Class加入

def index

end

 

然後把index.html.erb 改成你想要的內容，就差不多了。不過外部還是連不進來。

 

 

原因是因為Route還沒有設！程式沒有聰明到會自己知道要用哪個客製化頁面當首頁，所以我們這邊要設定一下。進入/config/routes裡面去修改！

 

其中root 就是對應首頁的意思，我們這邊要讓他去讀取home_controller 與 index action，所以就要寫成 root "home#index"，其中root是function，後面的是字串。但是root這隻程式預設會把字串再分成controller 與 action。

 

 

都設定完以後就可以按下重新整理，接者就可以看到我們設定的文字了！！

 

 

所以我們就成功地把首頁給換成我們自己的了！

 

最後，如果你喜歡我們的文章，別忘了到我們的FB粉絲團按讚喔!!