tech fun rails_workshop
DESCRIPTION
2013/02/04にTechFUNでやったRails勉強会の資料ですTRANSCRIPT
RUBY ON RAILS WORKSHOP!
@equal_001
SELF-INTRODUCTION
• 杉谷 弥月(すぎや みつき)
• 去年の冬頃から TechFUN に入りました
• LOCAL学生部に所属してます
• 趣味は Web アプリケーションやAndroidアプリでゲーム作成したり、ハッカーの真似事したり、ビブリオバトルしたり…
• 好きな言語は C++,Ruby (ときどき Java )
• 「一人開発さびしいよー、学内の人と一緒に開発したい!」
@equal_001
CONTENTS
• What’s Rails?
• Creating the application!
• Put your application online
• Finally
LET'S START!
WHAT’S RAILS?
WHAT’S RAILS?
• Ruby on Rails• プログラミング言語 Ruby で構築された WEB アプリケー
ションフレームワーク• つまり、 Web アプリケーションを効率的に開発するため
のライブラリとツールの集まり
× =
WHAT’S RAILS?
• 設計哲学• 「同じことを繰り返さない」
• 定義の重複は避け、作業は一回で済ませよう
• 「設定より規約」• Rails の設計規約に従って開発をすることで、
設定を軽減できるよ
WHAT’S RAILS?
• 特徴その1:MVCアーキテクチャ• アプリケーションを Model View Controller 」の3つ
の部分に分割して設計・実装
• Model : データベース管理役、アプリケーションの状態保持
• View : ユーザインターフェースの生成、表示のためのロジック
• Controller : アプリケーション内のブレイン、外部イベントからの処理
を Model と View へ適切に渡す
WHAT’S RAILS?
• RailsのMVCアーキテクチャ図
Controller
view Model
Browser
DB
①リクエスト送信
②データ入出力③Viewの呼び出し
④画面生成の レスポンス
WHAT’S RAILS?
• 特徴その2:直観的なデータベース操作• SQL 言語で操作しなくて済む• Ruby のように直観的にコードを書ける
例) students というテーブルから ID が 1009173 のレコードを検索する
SQL SELECT * FROM students WHERE id = 1009173;
Ruby on Rails Student.find(1009173)
可読性が高まる
ミスの軽減、発見しやすさ
仕様変更もそんなに嫌
じゃなくなる
EXAMPLE
• COOKPAD• Twitter• GitHub
• 食べログ
Break time…
CREATING THE APPLICATION!
ところで皆さん、ちゃんと環境設定できましたか?
できてない方は挙手!(・ ω ・)ノ
CREATING THE APPLICATION!
• Rails Girls Guidesにあるチュートリアルに沿って、アイディアボートっぽいものをつくってみよう
• タイトル• 内容• 画像アップロード機能
花見
My Idea
大学生になったので、イメチェンして大学デビ…
編集 / 削除
入学式
はなみをしてすとれす解消する方法を…
編集 / 削除
こんなイメージ!
CREATING THE APPLICATION!
• Rails Girls Guides
http://railsgirls-jp.github.com/app/
CREATING THE APPLICATION
• オススメのエディタ(他にも良いものが沢山あるよ!)• Sublime 画面分割できる
ファイルの階層が見れる
コードが自動的に色分けされて見や
すい
CREATING THE APPLICATION
• Rails new [アプリケーション名 ]
• 新しいアプリケーションを作成するコマンド• アプリケーションとして成立させるための必要
最低の基盤を rails が自動生成してくれる
CREATING THE APPLICATION
• 開発用のWebサーバを起動してみよう
rails server
・デフォルトでポート 3000 を使っている・ http://localhost:3000 という URL を入力す ればアプリケーションにアクセスできる
CREATING THE APPLICATION
• 初期画面• これがでてくればアプリは正常に動いている
CREATING THE APPLICATION
• contentの scaffoldをする
• アプリケーションの基本的な機能の 一覧 (index)
詳細 (show)
新規作成 (new/create)
編集 (edit/update)
削除 (destroy)
を行うために必要なコントローラ、モデル、ビューをまとめて生成
rails generate scaffold content title:string description:text
image:string
CREATING THE APPLICATION
rails generate scaffold content title:string description:text
image:string
title string
description text
image string
contents
Intex,show,new,edit,destroy view
Model
このコマンドだけで、これだけのファイルが自動生成される!
CREATING THE APPLICATION
• 未実行のマイグレーションファイルをデータベースに適用する
• 「さっき scaffold して作った contents テーブルを、データベースに適用する」というコマンド
rake db:migrate
rails s
CREATING THE APPLICATION
• 写真アップロード機能を追加する• Gemfile に使用するライブラリを記述する• アップロード機能を追加するためのライブラリをインストー
ルする
• Terminal で bundle コマンドを入力し、’ carrierwave’ ライブラリをインストールする
gem ‘sqlite3’
gem ‘carrierwave’
Gemfile
bundle
CREATING THE APPLICATION
• 写真アップロード機能を追加する• 今のままだと、写真のファイルの path が表示されるので、
ちゃんと画像が表示されるようにする
<%= @idea.picture %>’
app/views/ideas/show.html.erb
<%= image_tag(@idea.picture_url, :width => 600) if @idea.picture.present?
%>Idea テーブルの picture の中身が nilまたは空のオブジェクトでは無い場合、 image_tag メソッドで画像を表示させる
image_tag( 画像ファイル path), オプション ) で HTML で画像を表示することができる
CREATING THE APPLICATION
• routes を調整する• デフォルトページ( http://localhost:3000) が
のままなので、 ideas にリダイレクトするように設定しましょう
• 下準備として、 の元である public/index.html を消す
• config/routes.rb でリダイレクト先を指定する
• 今は指定先が1つだけど、複数ある場合は 上に書いた順に優先順位が決まるよ!
# You can have the root of your site routed with "root"# just remember to delete public/index.html.# root :to => 'welcome#index'root :to => redirect('/ideas')
コメントを読むと、ちゃんとやり方が書いてあるよ!
PUT YOUR APPLICATIONONLINE
Welcome!
PUT YOURAPPLICATIONONLINE
• Herokuをつかって自分のアプリケーションを公開しよう!
• Web 開発から Web アプリケーションの公開までサポートし
てくれるプラットフォーム• Webサーバや Git リポジトリ等の必要最低限の機能を無料で提供
• カスタム制なので、運用に必要な分の機能を付けたり外したりすることができる
• 規模の小さいアプリだったら、サーバを無料から使えるよ!今回は、比較的手軽にデプロイできる Herokuを使っていくよ!
FINALLY
FINALLY
• Railsを学ぶのにオススメするWebサイト• Ruby/Rails Study Guide• RAILSCASTS
• オススメの書籍• Rails によるアジャイル Web アプリケーション開発 第 4版
• Head First Rails ―頭とからだで覚える Rails の基本