rails初心者レッスン lesson2

13
Rails3 初心者レッスン by Minami.rb しきりなおしの Lesson 2

Upload: satomi-tsujita

Post on 27-May-2015

1.211 views

Category:

Technology


0 download

DESCRIPTION

Minami.rb

TRANSCRIPT

Page 1: Rails初心者レッスン lesson2

Rails3 初心者レッスンby Minami.rb

しきりなおしの

Lesson 2

Page 2: Rails初心者レッスン lesson2

このレッスンでやること一覧1. Railsで何をする?どうしてRails?2. Railsを通してデータベースをブラウザから扱う3. 作ってみよう事始め4. プロジェクトとテーブル5. Railsはどんなふうに働いてる?6. URLが大事7. 見た目をキレイに8. リレーションを考える9. 日本語対応10.プラグインを使う11.ちょっとRubyに働いてもらう12.herokuに公開しよう

Page 3: Rails初心者レッスン lesson2

Lesson1の復習使ったコマンド

$ rails new$ rails generate scaffold entry event_id:integer member_id:integer(rails generate scaffold entry event:references member:references)$ rake db:migrate$ rails console$ rails s$ rails generate -h$ rake routes

attention!

Page 4: Rails初心者レッスン lesson2

画面遷移とURLの確認

現状の URLと、index,show,new,edit,delete は、

 どうなってる?

Page 5: Rails初心者レッスン lesson2

URLを作る画面遷移図よりURL例 http://host/members/entries http://host/members/entries/new http://host/members/entries/edit http://host/members/entries/id

config/routes.rbを設定 resources :members do #親 resources :entries #子 end

Page 6: Rails初心者レッスン lesson2

リンクのしくみviewの記述(link_toの場合)

例1:members#indexからmember#newへ① $ rake routes で確認 new_member GET /members/new(.:format)

{:action=>"new", :controller=>"members"}

② app/views/members/index.html.erb を設定 <%= link_to '表示文字', routesが作ったパス_path %> <%= link_to 'New Member', new_member_path %>

Page 7: Rails初心者レッスン lesson2

Top画面をつくる&設定

welcomeページを作成 (controller+viewだけ作る) $ rails generate controller コントローラ名 メソッド名 e.g. rails generate controller welcome index

public/index.html を削除

config/routes.rbを設定 root:to => “welcome#index”

実は、routes.rbに書いてある

Page 8: Rails初心者レッスン lesson2

リンクの設定viewの記述(link_toの場合)

例2:welcomeページからmembers#indexへ① $ rake routes で確認 members GET /members(.:format)

{:action=>"index", :controller=>"members"}

② app/views/welcome/index.html.erb を設定 <%= link_to 'Member', members_path %>

Page 9: Rails初心者レッスン lesson2

リンクの設定viewの記述(button_toの場合)

例1:welcomeからmembers#indexへapp/views/welcome/index.html.erb を設定 <%= button_to 'Member', members_path %>

又は <%= button_to_function 'Member', "location.href = '#{members_path(@member)}'"%>

Page 10: Rails初心者レッスン lesson2

見た目をきれいにデフォルトで用意されている全体のstylesheet

app/layout/application.html.erbpublic/stylesheet/application.csspublic/stylesheet/scaffold.css

application.css scaffold.css

member.css event.css

Page 11: Rails初心者レッスン lesson2

見た目をきれいにstylesheet(cssファイル)の呼び方

app/views/members/index.html.erb の一行目に追加 <%= stylesheet_link_tag "member" %>

imageファイル(gif, png, jpg)の呼び方ファイルを public/images の下に保存app/views/members/index.html.erb で置きたいところに追加 <%= image_tag('line_1.gif') %>

Page 12: Rails初心者レッスン lesson2

画面遷移に従って、URLを作成してください。(entryはeventの下とします。)welcomeページを作成し、TOP画面に設定してください。

画面遷移に従って、viewにリンクをはってください。showのリンクはボタン(button_to)にしてください。NewMemberのリンクをRuby関西のtwitterアイコンにしてください。

 (参考:image_submit_tag)

デザイナーさんから素材(デザイン)をもらったとして、このプロジェクトに反映させてください。welcomeページでlayout(application.html.erb)を反映させないようにしてください。利用規約ページを作成し、/agreementでアクセスできるようにしてください。(ついでに利用規約も考えてください。)

演習

Page 13: Rails初心者レッスン lesson2

Lesson2は、これで終わりです。お疲れさまでした。