2016年3月14日 星期一

使用rails 產生靜態網頁(一)

keywords: static website

"在學習rails之前,我會javascript, css, html等 靜態網頁,而學習rails之後,我知道怎麼使用rails快速的開發一個網站,但是反而不知道該如何利用rails完成一個再簡單不過的靜態網站…"

如果您有這樣的想法,那這一篇文章就是逐步的解說如何使用rails建立一個簡單的靜態網頁。rails是個功能強大的框架,但是有時候我們想要做的反而是一個簡單的功能。對於從靜態網 頁開發者跨入 "網站"開發領域的開發者而言,也許會有困擾是如何使用這一個功能強大的工具,來完成自己之前熟悉的功能


1. 因為是靜態網站,所以不需要使用到model (與db作互動),所以MVC架構就退化成"View", 以 及"Controller"兩個部份。

首先建立controller: pages

terminal
rails g controller pages


2. 網站運作的概念是 routes 將網址在Controller中找到對應的action執行,因此我們需要設定routes, 以及 controller action

config/routes.rb
...
get "/pages/index" => "pages#show"
...

意即當瀏覽器輸入localhost:3000/pages/index 則routes將該網址轉換為pages 這個
 Controller下的show action,換句話說,我們指定要用show 這個action來 處理當瀏覽器輸入.../pages/index/ 後的動作

因為這個show action還沒有被實作 因此這時打開瀏 覽器輸入localhost:3000/pages/index會出現

The action 'show' could not be found for PagesController

app/controllers/pages_controller.rb (執行rails g controller pages後自動產生的檔案)加入以下show action的定義
def show
end


3. View
上一步定義了show action 之後,緊接著就是要來設定 view的部份,在rails中是套用一個模板的概念來產生網頁的外觀。即是跟傳統html, css比較有相關的部份了。因為還沒有定義模板的內容,所以瀏覽器會呈現template missing。

Template is missing


需要提醒讀者的是,在rails中MVC是三位一體的概念,意即隨時都要提醒自己,model, view, controller是息息相關的,每一個新功能的實作,必然同時要修改model, view, 以及controller

修改template, 在terminal中輸入以下程式碼以建立一個名為show的html template
vim app/views/pages/show.html.erb
這裡template名稱是show.html.erb,因為action也名為show的關係,這個名為show的template是預設的。因為controller中的show action 還沒有定義要render哪一個template, 所以會去找預設值。值得一提的是,若是想要render其他template,可以在def show 之中,設定要render哪一個template。

雖然這裡名為template,代表的是他可以套用進ruby的語法,但因為這裡要實作的是一個最簡單的靜態網頁,template是一個比較廣意的應用概念,也可以作靜態網頁這種比較單純的使用。

在這一回,我們介紹了如何實現一個指定的靜態網頁
在下一回我們會介紹如何實現多個靜態網頁,這需要在show action 中設定render 不同的template!我們下回分曉。使用rails產生靜態網頁(二)

reference
1. http://blog.teamtreehouse.com/static-pages-ruby-rails