1. RAILS HACKATHON
⼀一起來⽤用 Rails 打造有趣的網站
Jimmy

2. 學習⺫⽬目標
•
學習 Rails CRUD 基本功
•
Controller, model 概念
•
Routing 設定

3. WHY RAILS

4. • MVC
• RESTFUL
• USE BUNDLER
• DEFAULT
• SUPPORT SQLITE
• EASY TO TEST
最⽕火紅的語⾔言之⼀一

5. 開始吧

6. NEW PROJECT
•
rails new news

7. GENERAL MODEL
•
rails g model group title:string description:text
!
!
使⽤用 general model ⽣生成group 的model
•
rake db:migrate

8. GENERAL CONTROLLER
•
rails g controller groups

9. 修改 ROUTE
打開 route.rb
• 加⼊入 resource : groups
•

10. 修改 CONTROLLER
打開 groups_controller.rb
• 加⼊入 class method
•

11. 加⼊入 INDEX VIEW
•
app/views/groups 下新增 index.html.erb

12. 啟動 SERVER
•
rails s -p 8888
預設 port 3000

13. OPEN BROWSER
•
http://localhost:8888/groups

14. MODEL 說明

15. GROUPS MODEL
•
⾃自動加⼊入 id , create_at , update_at

16. RAILS CONSOLE
•
rails c
The console command lets you interact with your Rails application from the
command line. On the underside, rails console uses IRB, so if you've ever used it,
you'll be right at home. This is useful for testing out quick ideas with code and
changing data server-side without touching the website.

17. 使⽤用CONSOLE 新增資料
•
Group.create
!
!
!
•
Group.new
g = Group.new
g.title=‘t2’
g.description= ‘t2 description’
g.save

18. CONTROLLER 說明

19. CONTROLLER ACTION
REST 之所以能簡化開發,是因為其所引入的架構約束。︒Rails 中的
REST implementation 將 controller 的 method 限制在七個:
REpresentational State Transfer
def index
List all Groups
def show
show a single Groups
def new
show a new news forms
def edit
show an edit news forms
def create
create a new news
def update
update a news
def destroy
delete a news

20. CONTROLLER ACTION

21. CONTROLLER ACTION
Rails Maps Actions to HTTP Methods
<%= link_to (“List”,groups_path)%>
GET
讀取
<%= link_to (“New”,new_group_path)%>
<%= link_to (“show”,group_path(group))%>
<%= link_to (“edit”,edit_group_path(group))%>
POST
增加
<%= form_for @post , :url =>
posts_path , :html => {:method
=> :post} do |f| %>

22. CONTROLLER ACTION
HTTP 四種 verb.
PUT
更新
DELETE
刪除
<%= form_for @post , :url =>
post_path(@post) , :html => {:method
=> :put} do | f |%>
<%= link_to("Destroy",
post_path(@post), :method
=> :delete )

23. CONTROLLER ACTION
•
define index action

24. CONTROLLER ACTION
•
define index method
預設 render page 為 def 的名稱
指定 page 使⽤用 如下

25. 新增功能
Create

26. 建⽴立增新畫⾯面
•
修改 index.html.erb
link_to “new", new_group_path
等同 html <a href=“/groups/new“>new</a>
link_to “new", new_group_path, id: “newid", class: “btn"
等同 html <a href=“/groups/new“ class=“btn“ id=“newid“>new</a>

28. 建⽴立增新畫⾯面
•
修改 Controller
在GroupsController 裡加⼊入 new 的 action

29. 建⽴立增新畫⾯面
•
增加 new.html.erb

30. 建⽴立CREATE ACTION
•
在 Controller 中增加⼀一個 create 的 action

31. MODEL VALIDATE
•
在 Model 中增加檢核條件
!
!
!
•
!
在表單增加 error message

32. 修改功能
Update

33. 建⽴立修改畫⾯面
•
修改 index.html.erb
link_to “修改", edit_group_path
等同 html <a href=“/groups/1/edit“>修改</a>

34. 建⽴立UPDATE ACTION
•
修改 Controller

35. 建⽴立VIEW
•
新增 edit view

36. 刪除功能
Delete

37. 建⽴立修改畫⾯面
•
修改 index.html.erb
指定 method 為 delete

38. 建⽴立UPDATE ACTION
•
修改 Controller

39. ROUTING

40. 資料來源：rails 101

41. RAILS ROUTING SETTING
config/route.rb 檔設定 mapping rule
• 常⾒見幾種寫法
•
get “posts/new"
resources :posts
root :to => “posts#index”
match “/posts” => “posts#index”, as =>“posts“

42. RAILS ROUTING SETTING
resources :posts do
resouces :comments
end
namespace :admin do
resouces :posts
end

43. 資料來源：rails 101

44. THE END