ドットインストールでタスクアプリを作ってみたよ【projectの詳細を表示する】

今回はこのページの次のページを作ります。

f:id:natsuonatsu:20160505111904p:plain

要はp1にリンクをつけたいと思います。

流れとしては、

  1. projectのindexにlinkタグのような命令を入れる
  2. projectにshowを定義する

  3. show.htmlをviewの中に作る

といった感じです。

 

・linkをつける

まずはp1をクリックしたら詳細が見れるようにlinkをつけます。

htmlファイルを変更したいので

app/views/projects/index.html.erbに書いていきます。

p1を表示させているコードに追加して、以下のようにします。

<%= link_to project.title,project_path(project.id) %>

(pathを渡すときにidを渡さなきゃいけない)

 

そして、前にrake routeで出てきた結果を参考に、

products GET    /products(.:format)          products#index

             POST   /products(.:format)          products#create

new_product GET    /products/new(.:format)      products#new

edit_product GET    /products/:id/edit(.:format) products#edit

     product GET    /products/:id(.:format)      products#show

             PATCH  /products/:id(.:format)      products#update

             PUT    /products/:id(.:format)      products#update

             DELETE /products/:id(.:format)      products#destroy

 projectにshowというアクションを作ればいいことがわかります。

 

・コントローラにshowを定義する

project.controller.rbに

def show

  @project = Project.find(params[:id])

end

 を追加します。

これは、URLで渡ってきたidはparams でとれる、という意味らしい。

 

・showのviewを作る

views/projectの中にshow.html.erbを作ります。

中身は

<h1><% = @project.title %></h1>

というコードにします。

そうすると、しっかりp1にリンクがついて

そのページにはproject.title、要はp1と書いてあります。

 

おまけ

・ロゴを入れてみよう

まずロゴにしたい画像をapp/assets/imageに入れておきます。

そしてviews/layout/application.html.erbに

<%= image_tag"ファイル名" %>

と書きます。

 

・homeボタン(リンク)を作ろう

views/layout/application.html.erbに

<%= link_to "Home","/" %> 

 を追加するだけ!