LoginSignup
4
4

More than 5 years have passed since last update.

Rails チュートリアルの覚書 ※この記事では、第二版第二章のみです

Last updated at Posted at 2015-12-21

railsのtutorialで最も有名なサイトを利用してrailsの知識を深めようってことでチュートリアルをやってみました。
ひとまず自分なりに意訳し自分なりに理解できる文にしてevernoteに書き溜めたものを順に公開していこうかなと思います。

Railsチュートリアルをやるにあたり

最初にプログラミング言語を勉強するならruby on railsでいいじゃんっていう人が多いと思いますけどそれって前提知識ありき(web開発に従事してたとか)の話だと思いますしHTMLも知らない人がいきなり始めるにはかなりハードルが高いと思います。
自分と同じように独学でやっている方の手助けになるようにチュートリアルの中身を噛み砕いたようなものが公開できたらいいなと思いQiitaに投稿します。
自分もrails初心者なので至らない点、間違い、誤認識等がございましたら編集リクエストをしていただければなと思います。

対象学習者:やる気ある人です
※最初はすべてを理解しなくていいです。ひとまず手を動かし続けるってことが大切です。 

準備するもの

PC(PCじゃなくても可能ですが動作が思くなると思います)
githubアカウント
以上二点があればすぐにはじめれます
githubアカウントがない方は、以下から作成できます
GitHub
手順に従って作成を行ってください
 

今回学ぶこと

railsの全体像
ruby on railsの全体像
gitの操作(commit、pushなど基礎の「き」になる部分)
ターミナルでのコマンド操作
が主に学ぶことになるかと思います
※HTML、CSS(Sass含む)、JavaScripteも今回出てくると思うので少しは学べるかなと思います

章の進み方

今回、プログラミング界隈お決まりの「Hello, World!」は、飛ばして始まります。
時間ある際に第一章については書きたいと思います。

Rails チュートリアル 第二章

Rails Tutorial第二章

本編に入る前に今後の章で必要になる開発環境を整えます
ブラウザ上でクラウド環境として動作しまた他のサービスとも連携しているサービスのCloud9を使用してチュートリアルを行っていきます
まずgithubのアカウントを使用してアカウント作成を行います。

スタートライン

Cloud9でのアカウント作成が終わったら次に行うのが
workspaceの作成になります
cloud9_workspace_create.jpg
こちらの+をクリックしていただくと以下のような画面に移行します
cloud9_workspace_lagselect.jpg
workspace nameはお好みでつけてください
下段の右下にあるruby on railsを選択し
create workspaceをクリックしてください。
以下の画面に遷移するかと思います。
cloud9_workspace_view.jpg
※赤枠の箇所がターミナルになります
※左記にフォルダが形成されてますがこれはrails newした後の状態です
そのあとは、おきまりの各言語のバージョン確認です
これはローカル環境開発構築とか新たな言語installした際におおよそ毎度行うであろう作業となりますし、バージョンによってできるできない等もあったりしますので必ず確認はするようにした方がいいと思います。
rails、ruby、gem、bundlerのバージョンを確認し終わったら次へ進みます。

applicationを作成しよう

rails new プロジェクト名 --skip-bundle
これで一気にファイルの作成がされるかと思います
cd プロジェクト名
ディレクトリを移動したらgitのバージョン管理の準備を始めます

gitによるバージョン管理を行うための準備

1.git init
作業フォルダをバージョン管理するためのファイルを作成(ローカルリポジトリの作成)
 
2.git add .
ファイル追加します

3.git commit -m 'コメント'
最初のコミットを行う

4.githubでリポジトリの作成を行う
githubの右上の+をクリックし
New repositoryをクリック
入力箇所はrepository name、概要を入力しcreate repositoryボタンをクリック
ターミナル(cloud9側)
git remote add origin https://github.com・・・・・・・・・・・.git
git push -u origin master

実行後にgithubの
user name
password

を順に聞かれるので入力する
無事commitが完了する

5.githubで取り込む
githubにリモートブランチが作成されたかと思います

6.cloud9に戻りbranchの作成を行う
現在はmasterになっていることがcloud9上で確認できると思うので作業用にbranchの作成を行う
※ターミナルで表示されているかと思います($の手前に()内でmasterと)

git branch <branch名>  --ブランチの作成
git checkout <branch名>  --ブランチの切り替え

cloud9での作業の開始です

用語が出てきますが、プログラミング言語ではよく使用されるものばかりなので解説がない箇所に関しては、すぐ出てくるものなのでググって調べましょう!

ターミナルで以下コマンドを実行する
bundle install
Gemfileの反映がされます

1.チュートリアルの手順に従うとscaffoldを使用して作成を始めているのでscaffoldで作成を行う 以下コマンドを実行
※scaffoldはコードを自動生成するコードジェネレーターというものです

rails g scaffold User name:string email:stringg →
以下オプションの説明になります
generateの略です
Userはリソース名の単数形
name:string
email:string
→DBのカラム名:属性になる
※主キーになるIDはrailsが自動生成を行ってくれる

2.DBにtableを作成する
rake db:migrate
これでDBにtableが作成されます

3.現時点でサーバを起動してみましょう
通常ローカルならば
rails s
で起動しますがcloud9だと以下コマンドで実行してください
rails s -p $PORT -b $IP
するとターミナルの右側にポップアップでURLが記載されるかと思います
それをクリックするとページが表示されるかと思います
※表示されない場合、URL: https://<プロジェクト名>-<アカウント名>-1.c9users.io を入力してみてください
下記画像のように表示がされるかと思います
初期画面.jpg

入力したURLの末尾に /users と入力してください
scoffoldで自動生成された画面が表示されるかと思います

4.scoffoldで新たに作成を行う
※先ほど作成したものはそのままの起こしておいてください
同じ作業ディレクトリで以下コマンドを実行してください
rails g scaffold Micropost content:string user_id:integer
rake db:migrate
micropost_controllerなどが一気に作成され
db:migrateでtableの作成が終わりました
※この時点でファイルを見ていただくとmodel/micropost.rbにclassと書かれたもの以外記載がないことがわかるかと思います
 

5.ルーティングの確認
config/routes.rb
resource :microposts
と記述されていることを確認してください
またターミナル上で以下コマンドを実行することでroutesの一覧が見れます
rake routes
 
6.app/models/user.rbを編集する
cloud9のエディタで編集を行います
上記ディレクトリに存在するファイルをダブルクリックするとファイルが開けるので開いて以下のようになるように追記してください

user.rb
class Micropost <ActiveRecord::Base
  validates :content, length: {maximum: 140} #追記箇所
end

※インデントを入れる際は、tabキーを押すとインデントが入ります。必ずインデントを使用してください。(また推奨はスペース二個分です) 
※保存方法はCtrl + s(win)、command + s(mac)

記述内容は、max140時の長さまでのcontentのバリデーションチェックになります。=140文字以上はエラーにしますよとなります。

6-1.試しに投稿してみる
適当に140文字以上を入れてみてください
すると以下のようなエラーが画面に出るかと思います
err_validate.jpg
上記画像のようなエラーが出たらバリデーションがしっかり動いていることが確認できます。

最初の山場です

 
7.ユーザーとcontentsを関連付けます
これは、webアプリケーションだけではなく、色々な業種、業界でも当たり前のようにあることなのですが
全部のデータを一個のDB(table)だけに保存するということはしないことを頭に入れといてください。
文章にすると以下のようになるかと思います
A君(ユーザー=サービス利用者)の情報は、userというtableに保存します
※usesrというtableには今回はnameとemailというものが保存されるようになっています(1.の箇所です)
しかし、A君が作成した物(ここでは、140文字以内の文章)は、micropostというtableに保存します。
ここで思い返してください。micropostというtableを作成する際にusesr_idというもの書いたかと思います。(4.の箇所です)
これは、micropostというtableにuserのidを保存するための場所を用意したのです
※IDに関しては、railsが自動で作成してくれているのでわざわざ書く必要がありません。つまりuserのtableに誰かしらのデータが保存されるたびに連番の一意の番号が振られるようになっています。
※user_idとはuser tableのIDを指しています。これにより誰が作成したのかをわかるようにします=これをリレーションと呼んだりします

7-1.DB(データーベース)の概念をほんわか説明します
最初は、ほんわかのイメージで問題ないかと思います。
webアプリケーションの世界ではRDBMSという単語が出てきます。
一番有名なものですとMysqlが一番有名だと思いますがほかにも、mariaDB、postgreSQL、oracle database、sqliteなどがよくつかわれるかと思います。
端的に説明します
送ったデータ(基本的に集合体になってます)を属性(今回ならname,email,contentsなど)の値とし送られてきたデータの集合体を一つの組(レコードといいます)として認識し、格納(いわゆる保存)し、また検索、取得、更新を行うシステムです。
user tableにデータを送ると
属性 → 値
id → 1
name → A君
email → test@example.com
のようになります。
※ただし今回railsではidなどがRailsによって作成されているのでidの数字が自動的に振られ保存されます(自動連番)
 
 
7-2.関連付けの記述をしていきます
has_manyとbelongs_toというものを使って関連付けます
has_many ○○ = ○○にたくさんもってるねー
belongs_to ○○ = to以下に属しているよ
というイメージで大丈夫かと思います。
A君は一人しかいませんがA君が作成(contentsを)するものは、複数になるだろうと考えられます
なので以下のファイルを編集してください
app/models/user.rb

user.rb
class User < ActiveRecord::Base
  has_many :microposts #追記箇所
end

app/models/micropost.rb

micropost.rb
class Micropost < ActiveRecord::Base
  belongs_to :user #追記箇所
  validates :content, length: {maximum: 140} #6で追記した箇所
end

8.rails consoleで確認
コマンドでrails consoleを実行してください
対話形式の操作が可能になります
では先ほど追記した記述の動作確認を行います

8-1.最初のユーザーを登録します
まず最初にrails consoleを実行してください
※consoleの箇所は、c と略せます
対話方式の画面に変わるかと思います
そしたらまずユーザーを作成するので
User.create(name:"test",email:"test.example.com")
などと打ってみましょう
※createは、newとsaveを同時に行ってくれるメソッドになってます
※名前、アドレスはお好みで構いません
※この画面はまだ使うので閉じずに開きっぱなしにしといてください
 
8-2.登録の確認
User.first
上記コマンドを実行後にデータが返答されてくるかと思いますが
先ほど入力した物が表示されるかと思います。
※その他の情報も返ってきますが今は気にしないでください
※もしエラーになりましたら一度インスタンス変数を作成してみてください
first User.first
 
8-3.画面から投稿してみましょう
URLに/micropostsを入れリロードしてみてください
するとNew Micropostというリンクがあるかと思います
そこをクリックし遷移しましょう
遷移先でContentとUserの入力画面になるかと思います
contentに適当に文字を入力しUserのとこは1を選択してください
最後にCreate MicropostをクリックしMicropost was successfully created.と出たら成功です。
 
8-4.関連付けの確認
rails console画面を移動してください
first_user = User.first
first_user.microposts
上記コマンド実行後に返ってきたものをみると
しっかりと関連付けがされているのがわかるかと思います。

最後に

ここまでが第三版の第三章への布石になる基礎になります。
上記までのコードに関しましては、以下のgithubにあげてありますのでご使用ください。またローカルにて展開される場合、先にruby on railsの導入を参考にしていただきrubyを入れてください。
おそらくそれでもエラーが出るかと思われますので以下のことを実行してからrails sを実行してください
ファイルの展開先(ディレクトリ)でbundle installを実行後

Gemfile
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby] #追記してください

 

続編となる第三版の第三章以降は、以下のリンクから飛んでください

Rails チュートリアルの覚書 part2 ※第三版第三章~

4
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
4