【復習】Ruby on Rails入門 ~ミニブログを作りながら学ぶWebアプリケーション制作 第1回~
無料動画のオンライン学習サイトのスクーで鳥井 雪(@yotii23)先生の授業を見て
Ruby、Railsに興味をもち、色々と触ってみています。
何かしらアウトプットした方が覚えが良いので、復習した内容をまとめたいと思います。
このサイト、生放送の授業にリアルタイムチャット機能がついていて、コメントを先生や学生代表の方に
拾ってもらえたり、生徒同士で課題解決したりと双方向のコミュニケーションが出来て結構楽しめるので、
気になった方は是非、参加してみてください。
今回はRuby on Rails入門 ~ミニブログを作りながら学ぶWebアプリケーション制作 第1回~の授業になります。
ちなみに環境は先日作成したRuby on Rails の開発環境つくってみた - おれろぐ #z_a_ki3で
作成した環境を使って進めていきます。
※Gemをなるべくシステムにインストールしないようにしているので授業と微妙に違う点はご容赦ください。
ゴール
- Webアプリケーションの基本のイメージを持つ
- Railsのアプリケーションを動かしながら、「データの登録」を理解する
動作環境チェック
RubyとRailsがインストールされている環境が前提です。
バージョンの確認コマンドは以下のコマンドです。
$ ruby -v ruby 2.2.0p0 (2014-12-25 revision 49005) [x86_64-linux]
$ rails -v
Rails 4.2.0
Rubyは1.9以上、Railsは特に明言されていませんでしたが、先生の環境は4.2.0でした。
ちなみに授業ではnitrous.ioを使用しています。
環境構築から編集まで全てブラウザ上で完結するので非常に便利なんですが、動作が重く進まないことも
あったり不安定な部分が目立つので環境が作れるならローカルで用意した方が良いと思います。
授業中も環境構築(プロビジョニング)にだいぶ時間がかかってました _(┐「ε:)_ズコー
プロビジョニングとは,ネットワークやコンピュータの設備を, 必要になったときすぐに利用できるよう準備しておくことを指す キーワードである。供給や支給,配置といった意味を表す 「provision」という英単語が元となって派生した言葉である。
Networkキーワード - プロビジョニング:ITpro http://itpro.nikkeibp.co.jp/article/Keyword/20080610/307257/
課金すれば多少は改善されるかもしれませんが、仮想環境は無償で作れる&勉強になるのでオススメです。
あとは、似たようなサービスでCloud9がありますが、こちらも同じ事が言えます。
1.Webの基本のしくみ
Rails固有の内容では無く、Webのリクエストとかレスポンスとか基本的な内容の再確認です。
・リクエスト
ブラウザでWebのページを見るときにリンクを踏んだり、ボタンを押したりして画面を出す際、
PCからインターネットを通じてサーバにリクエストが飛ぶ。
登録フォームなども同様にリクエストを送っている。
・レスポンス
サーバは色々な処理をしてレスポンスを返す。
レスポンスは例えばHTMLのテキストや画像、動画を返す。
ブラウザはそれを組み立てて画面として構成する。
この辺の知識はRails関係なく、PHPでもJavaでもどんな言語でも共通で必要な知識です。
基礎をしっかり学習したい方は下記の書籍がオススメです。
Webを支える技術 -HTTP、URI、HTML、そしてREST (WEB+DB PRESS plus)
- 作者: 山本陽平
- 出版社/メーカー: 技術評論社
- 発売日: 2010/04/08
- メディア: 単行本(ソフトカバー)
- 購入: 143人 クリック: 4,320回
- この商品を含むブログ (179件) を見る
スクーのプレミアム学生ならこんな録画授業で学習できます。
2.アプリケーションの雛形をつくってみよう!
アンケート
Rubyは"プログラミング言語"
RailsはRubyでWebアプリケーションを作るための"Webアプリケーションフレームワーク"
で、"Webアプリケーションフレームワーク"とはWebアプリケーションを作るために
必要な共通の機能(部品、土台)を用意してくれているもの。
Railsのマークは"白いイカの足"ではなく、"レール(線路)"で、Railsの敷いたレールに乗ると
理解しやすい形で開発できることが思想にある。
確かに白いボツボツが吸盤にみえなくも無い。。。
雛形を作ってみよう!
rails new
コマンドで雛形を作成します。
$ rails new my_app
このコマンドを入力するとカレントディレクトリにmy_app
というフォルダを作成し、その中に、
必要な雛形ファイルを自動生成、ライブラリをダウンロードしてくれます。
至れり尽くせりでありがたいですね。
ちなみに私はシステムに余計なGemを入れたくなかったので、まず、bundle init
で初期化して、
生成されたGemfile
にrails
のみ指定して、アプリ用に専用のrails
をインストールして、
そのアプリ用のrails
を使って雛形を作るという事をしました。
$ mkdir my_app $ cd my_app/ $ bundle init Writing new Gemfile to /vagrant/schoo_rails/my_app/Gemfile $ vi Gemfile #Gemfileを編集
# A sample Gemfile source "https://rubygems.org" gem "rails", '4.2.0'
$ bundle install --path ./vendor/bundle Fetching gem metadata from https://rubygems.org/........... Fetching version metadata from https://rubygems.org/.. Resolving dependencies... Using rake 10.4.2 Installing i18n 0.7.0 Installing json 1.8.2 Installing minitest 5.5.1 ~略~ Installing rails 4.2.0 Bundle complete! 1 Gemfile dependency, 36 gems now installed. Bundled gems are installed into ./vendor/bundle. $ bundle exec rails new ./ exist create README.rdoc create Rakefile create config.ru create .gitignore conflict Gemfile Overwrite /vagrant/schoo_rails/my_app/Gemfile? (enter "h" for help) [Ynaqdh] Y force Gemfile create app create app/assets/javascripts/application.js create app/assets/stylesheets/application.css create app/controllers/application_controller.rb ~略~ Bundle complete! 12 Gemfile dependencies, 57 gems now installed. Bundled gems are installed into ./vendor/bundle. run bundle exec spring binstub --all * bin/rake: spring inserted * bin/rails: spring inserted $
bundle exec
はシステムにインストールされたGemではなく、bundle install
でインストールした
Gemを使って指定のコマンドを実行するコマンドです。
動作を確認しよう
rails server
でWebアプリケーションサーバを立ち上げます。
$ cd my_app #カレントディレクトを rails new で作成したディレクトリに移動 $ rails server
ちなみにセキュリティーが強化され、rails4.2.0からはバインドを指定しないとサーバを起動した端末以外では
ページを表示することが出来ないので仮想環境などで実行する際は-b(--binding=)オプションを付けましょう。
$ rails server -b0.0.0.0
$ rails server --binding=0.0.0.0
停止するときはctrl+C
です。
投稿機能を作ってみよう
まずは作りたいものを考えます。(今回は"投稿機能")
アプリケーションを作り始めるときにしっかりと仕様を決めるのは大事ですね。
- 「名前」と「短い本文」が投稿できる
- 投稿したものが下のように一覧で表示できる。
名前 | 本文 |
---|---|
やきとりい | おはようございます |
笹田 | ねむい |
やきとりい | 電車乗り過ごした・・・むしろ降りれなかった。 |
yotii23 | 人生万事塞翁が馬 |
作りたいものが決まったらモデルを(ほんとに簡単ですが)設計します。
ここでいうモデルとはデータベースのテーブルのようなイメージですかね。
投稿というモデルはentryという名前とします。
名前(投稿者名)はnameという名前で短い文字列、本文はbodyという名前で長いテキストとします。
短い文字列の形式はstring、長いテキストはtextという形式です。
仕様がきまったらモデルを生成します。
$ rails generate scaffold entry name:string body:text
ちなみに間違えた場合はgenerate
をdestroy
にすると削除できます。
$ rails destroy scaffold entry
このscaffold
とは足場という意味があり、モデルに必要な様々な機能の部品を自動生成します。
この足場というのは、一度scaffold
で全ての部品を作成し、不要な部品(足場)を外していく様から
付けられたんじゃ無いかなと勝手に想像しています。勝手な想像なので出典はありません。
モデルに必要な部品が揃ったらデータベースを作成します。
$ rake db:migrate
このコマンドを実行することで作成したモデルに合うようにデータベースを更新します。
今回はモデルを新規追加したので、データベースには新規テーブルが追加されます。
タイムラインの質問で entry
が entries
になる?というのが取り上げられていましたが、
railsではモデル名とテーブル名が規約で定められています。
種類 | 説明 | 例 |
---|---|---|
モデルクラス名 | 先頭は大文字で単数形 | User |
モデルのファイル名 | 先頭は小文字で単数形 | user.rb |
テーブル名 | 先頭は小文字で複数形 | users |
テストスクリプト名 | xxx_test.rb | user_test.rb |
ここで http://localhost:3000/entries にアクセスするのですが、環境によっては以下のエラーがでます。
ExecJS::RuntimeUnavailable in Entries#index Showing /vagrant/schoo_rails/my_app/app/views/layouts/application.html.erb where line #6 raised: Could not find a JavaScript runtime. See https://github.com/sstephenson/execjs for a list of available runtimes. (in /vagrant/schoo_rails/my_app/vendor/bundle/ruby/2.2.0/gems/turbolinks-2.5.3/lib/assets/javascripts/turbolinks.js.coffee)
根本原因は理解しきれていないのですが、JavaScriptの実行エンジンが関係している用です。
Ruby - Could not find a JavaScript runtime - Qiita
# See https://github.com/sstephenson/execjs#readme for more supported runtimes gem 'therubyracer', platforms: :ruby #コメントを外す
できた機能たち
機能 | Webページ上の表示 |
---|---|
一覧 | Listing Entries |
新規作成 | New Entry |
詳細 | Show |
編集 | Edit |
削除 | Destroy |
覚えて欲しいキーワード「CRUD」
CRUD(クラッド)とは、ほとんど全てのコンピュータソフトウェアが持つ永続性の4つの基本機能の イニシャルを並べた用語。 その4つとは、Create(生成)、Read(読み取り)、Update(更新)、Delete(削除)である。 ユーザインタフェースが備えるべき機能(情報の参照/検索/更新)を指す用語としても使われる。 CRUD - ウィキペディア ja.wikipedia.org/wiki/CRUD
機能 | Webページ上の表示 |
---|---|
C:Create(作成) | New Entry |
R:Read(読み取り) | Listing Entries、Show |
U:Update(更新) | Edit |
D:Delete(削除) | Destroy |
鳥井先生の資料がDeleteでは無く、Destroyだったんですが、Railsのコントローラファイルを見てみると、
Deleteメソッドに対応する呼び出しメソッドがdestroyなんですよね。
この辺が資料に入っちゃったのかなと想像しました。
# DELETE /entries/1 # DELETE /entries/1.json def destroy
「データを登録する」ということ
アンケート
データベース(DB)って聞いたことありますか?
Webのやりとり(リクエスト>レスポンス)は毎回1回ずつのやりとりになります。
その中で長く取っておきたい情報はDBに保存します。
WebアプリケーションにはDBそのものの機能はなく、DBとやりとりする機能を持っています。
では、データベースはいつしたのかというと・・・
$ rails generate scaffold entry name:string body:text
これで /db/migrate
配下に設定ファイルが生成されて、
class CreateEntries < ActiveRecord::Migration def change create_table :entries do |t| t.string :name t.text :body t.timestamps null: false end end end
設定ファイルが生成された後・・・
$ rake db:migrate
これで生成された設定ファイルをもとにDB内にテーブルが作成されます。
rake db:migrate - リファレンス - Railsドキュメント
Webアプリケーションは機能(CRUD)に応じてDBに対し、レコードの挿入、更新、削除をよしなに実行します。
これがWebアプリケーションの基本機能となります。
次回以降の内容
宿題
- ブラウザとサーバー(アプリケーション)の図を自分でも書いてみましょう
- 普段インターネットを使うとき、どんなタイミングでリクエストが飛んで、どんなデータが
保存されているのかを想像してみましょう。
感想
Railsのアイコンはイカの足ではない。
nitrous.io は時間帯によっては結構重い、辛い。
お水ー!