ギークなエンジニアを目指す男

基幹系SIerがWeb系とかネイティブ系の知識を蓄えようとするブログ

MENU

Railsチュートリアル3章を学んでみた

Railsチュートリアル3章に突入しました。

重要なポイントだと思った部分や感想を記載していきます。

  • コントローラーの作成と削除
  • RED / GREEN / REFACTOR
  • application.html.erbについて
  • 3.4.3 レイアウトと埋め込みRuby (Refactor)の演習問題の解答
  • 3章まとめ

コントローラーの作成と削除

コントローラーの作成は今まで散々おこなってきましたが、

& rails g controller StaticPages home help

でしたね。

上記コマンドによって、

  • static_pages_controller
  • help.html.erb
  • home.html.erb

の3ファイルが作成されます。

ここで、ファイルの名称などを誤って作成してしまった場合は
削除できるコマンドもあります。

$ rails destroy controller StaticPages home help

これで綺麗に削除されます。

RED / GREEN / REFACTOR

Railsではテストコードを書く・・・RED
REDを解消するコードを記述する・・・GREEN
コードを綺麗に保つ・・・REFACTOR
というように呼ばれるようです。

application.html.erbについて

このファイルはrails gコマンドによって作成される重要なファイルです。
デフォルトで下記のようなコードがあるかと思います。

続きを読む

※随時更新※ Railsチュートリアル学習記

この記事では、Railsチュートリアルの学習遍歴をまとめます。

  • 1章 ゼロからデプロイまで
  • 2章 Toyアプリケーション
  • 3章 ほぼ静的なページの作成

1章 ゼロからデプロイまで

taxa-program.hatenablog.com

2章 Toyアプリケーション

taxa-program.hatenablog.com

3章 ほぼ静的なページの作成

続きを読む

Railsチュートリアル2章を学んでみた

Railsチュートリアル2章に突入しました。

2章ではToyアプリケーションという、おもちゃアプリケーションを作成しながらRailsの勉強をしていきます。

scaffoldジェネレータとは

Railsにはscaffoldジェネレータというスクリプトが搭載されており、大量の機能を自動的に生成することができるようです。

この機能を用いて、Railsアプリの構造と、Railsで推奨される RESTアーキテクチャ について学ぶ章になっています。

ルーティングについて

過去の記事でもとりあげていますが、今回scaffoldで作成することにより、新規ユーザ登録やユーザ一覧などのページが自動的に追加されます。

railsチュートリアルの2.2.1にある図は、下記コマンドで把握することが可能です。

$ rails routes
   Prefix Verb   URI Pattern               Controller#Action
    users GET    /users(.:format)          users#index
          POST   /users(.:format)          users#create
 new_user GET    /users/new(.:format)      users#new
edit_user GET    /users/:id/edit(.:format) users#edit
     user GET    /users/:id(.:format)      users#show
          PATCH  /users/:id(.:format)      users#update
          PUT    /users/:id(.:format)      users#update
          DELETE /users/:id(.:format)      users#destroy
     root GET    /                         application#hello

railsチュートリアル2.3.3の演習1

この演習問題の解答がチュートリアルには載っていない?ため、現時点で私が思いついた解答を載せておきます。
(もし間違っていたら指摘していただけると大変嬉しいです)

ユーザーのshowページを編集し、ユーザーの最初のマイクロポストを表示してみましょう。同ファイル内の他のコードから文法を推測してみてください (コラム 1.1で紹介した技術の出番です)。うまく表示できたかどうか、/users/1 にアクセスして確認してみましょう。

toy_app/app/controllers/users_controller.rb

~~~
def show
    @micropost = Micropost.find(params[:id]) #追加
end
~~~

toy_app/app/views/users/show.html.erb

~~
<p>
  <strong>Email:</strong>
  <%= @user.email %>
</p>

<!-- 追加開始 -->
<p>
  <strong>最初の投稿:</strong>
  <%= @micropost.content %>
</p>
<!-- 追加終了 -->

<%= link_to 'Edit', edit_user_path(@user) %> |
~~

現時点での疑問点

  • コントローラー(user_controller.rb)のeditメソッドには@user変数が存在しないが、ビュー(edit.html.erb)で@user変数が使用できるのはなぜか。

上記、なんとなく理由がわかりました。 toy_app/app/controllers/users_controller.rb

~~~
before_action :set_user, only: [:show, :edit, :update, :destroy]
~~~
private
    # Use callbacks to share common setup or constraints between actions.
    def set_user
      @user = User.find(params[:id])
    end

    # Never trust parameters from the scary internet, only allow the white list through.
    def user_params
      params.require(:user).permit(:name, :email)
    end
~~~

このbefore_acrionによって、定義されている各アクションの実行前に @user = User.find(params[:id])
が実行されているからのようです。

まとめ

この章ではScaffoldという機能を中心に、Rrailsの構成を理解しようとしてきました。

しかし、Scaffold機能ではコードの中身を理解するのも難しく(現段階では)、これを元にRailsを細部まで理解するのは難しいと感じました。

しかし、1章に比べ、より本格的なアプリケーションを作成できたのは間違いないと思います。

特にデータベースにデータを入れたり、データベースから値を取得したりなど、いかにもWEBアプリっぽくて、楽しかったです。

例のごとく2章のソースコードを置いておきますので、よければ参考になさってください。

github.com

Railsアプリ新規作成から、本番環境へのデプロイ手順まとめ

この記事では、Railsアプリの新規作成から本番環境(Heroku)へのデプロイまでの手順を簡易的にまとめておこうと思います。

$ で始まる行に関しては、コマンドラインからの入力を想定したものです。

railsアプリ群を作成&フォルダへ移動

  • $ rails new application_name
  • $ cd application_name

Git管理管理下に指定

  • $ git init
  • $ git add -A
  • $ git commit -m "Initialize repository"

トピックブランチを作成する場合

  • $ git checkout -b static-pages
  • $ git branch (現在のブランチの確認)
  • $ git push origin static-pages (トピックブランチのPUSH)

GitHubにプッシュ

プログラムを修正し、本番環境(Heroku)へデプロイ

  • $ git commit -a -m "Mod hello"
  • $ heroku create
  • $ git push heroku master

Herokuのアプリケーション名を変更したい場合

  • $ heroku rename railstutorial-toyapp

Railsチュートリアル1章を学んでみた

本日よりRailsチュートリアルの学習に入りました!

ここでは1章でどんなことを学んだか、備忘録がてら記事にのこしておきます。

MVC

これは今までも散々勉強してきた内容です。 rails newコマンドで、viewとcontrollerとmodelを作成し、それぞれの役割の説明があります。

Gitでバージョン管理

ここでは早速バージョン管理の話がでてきます。
(もうバージョン管理?と思いましたが、後回しにしても良いことはないため、ここでしっかり学ぶことをおすすめします)

私は過去にドットインストールで学んだコードをGitHubにあげており、その時にGitの使い方も少し学びました。

詳しく知りたい方は下記リンクより参照してみてください。

taxa-program.hatenablog.com

また、Railsチュートリアルでは、Bitbucketを使用していますが、公開鍵登録方法の手順が少し古かったため、最新の手順を記事としてまとめました。
良ければ参考になさってください。

taxa-program.hatenablog.com

ちなみに私はGitHubでのソースコード管理にしました。
(Bitbucketはまた時間のあるときにやってみます)

本番環境へのデプロイ

最後にHerokuというクラウドサービス上に、今回作成したアプリをでデプロイしていきます。

手順はとても簡単で、特につまづく点はないと思います。

この本番環境へのデプロイを成功させると、ブラウザにURLを入力し、どこからでもアクセスできるようになります。

試しに自分のスマホからアクセスしてみると、しっかりページが表示されrました。

これはかなり嬉しいですし、モチベーションも上がります。

まとめ

1章ではRailsの基礎部分から、バージョン管理、本番環境へのデプロイと、アプリケーションを開発する上での手順も簡単に網羅できるような内容になっていました。

もちろん私もWEBアプリに関してはど素人ですが、特につまずくことなく進めることができたと思います。

例のごとく、1章のソースコードを置いておきますので、よければ参考になさってください。

github.com

Git入門(Branchやってみる編)

前回に続きGit記事第2弾です。

第1弾はこちら

taxa-program.hatenablog.com

今回はブランチを使ってみようと思います。

Branch (ブランチ)とは

ブランチは基本的にはリポジトリのコピーで、ブランチ上では元のファイルを触らずに新しいコードを書くなど、自由に変更や実験を試すことができます。通常、親リポジトリはmasterブランチと呼ばれ、トピックブランチ (短期間だけ使う一時的なブランチ) はcheckoutと-bフラグを使って作成できます。

ブランチの作成方法

下記コマンドで新規のブランチ(枝分かれ)を作成できます。

$ git checkout -b modify-first
Switched to a new branch 'modify-first'

現在どのブランチを使用しているかは下記で確認できます。
*印が付いているものが現在のブランチです。

$ git branch
  master
* modify-first

ファイルの編集

今回は特定のファイルの中身を変更して、commitまで行ってみます。
hello_app/README.md

# Ruby on Rails Tutorial

## "hello, world!"

This is the first application for the
[*Ruby on Rails Tutorial*](https://railstutorial.jp/)
by [Michael Hartl](http://www.michaelhartl.com/). Hello, world!

上記ファイルを変更後、ブランチの状態を確認してみると...

$ git status
On branch modify-first
Changes not staged for commit:
  (use "git add <file>..." to update what will be committed)
  (use "git checkout -- <file>..." to discard changes in working directory)

        modified:   README.md

no changes added to commit (use "git add" and/or "git commit -a")

READMEファイルが編集された形跡が確認できると思います。

ここで、ファイルへの変更を一括でコミットする-aオプションを追加し、コミットします。

$ git commit -a -m "Improve the README file"

ブランチのMerge (マージ)

ファイルの変更が終わったので、masterブランチにこの変更をマージ (merge) します。 まずはブランチの変更を行います。

$ git checkout master

この状態でhello_app/README.mdファイルを参照してみると元の記述に戻っているはずです。

この状態で下記コマンドを入力し、マージを行います。

$ git merge modify-first
Updating 629803c..9fbc7f3
Fast-forward
 README.md | 27 +++++----------------------

 1 file changed, 5 insertions(+), 22 deletions(-)

マージ後は、トピックブランチを削除して終了です。

$ git branch -d modify-first
Deleted branch modify-first (was 9fbc7f3).

以上、ブランチやってみる編でした。

BitbucketへのSSH認証鍵登録方法

今回はRailsチュートリアルで出てきた、BitbucketへのSSH鍵登録方法をまとめておきます。

GitHubとBitbucket

下記の様な違いがありますが、サービスの内容としては一緒です。

GitHubとBitbucketは、Gitリポジトリを扱う2つの著名なサービスです。
両者のサービスは非常に似通っています。 どちらもGitリポジトリホスティングと共同作業を行うことができ、 リポジトリの表示や検索を行いやすくしてくれます。 GitHubは「リポジトリを一般公開する場合は無料、公開しない場合は有料」なのに対し、 Bitbucketは「共同作業者が一定数以下ならリポジトリを公開しなくても無料、共同作業者が一定>数を超えると有料」である点です。なお、どちらも容量制限はありません。

下記からユーザ登録が行えます。

bitbucket.org

公開鍵の作成

※環境はMacBookPro macOS High Sierraで行っています※

下記コマンドで.sshを作成

$ install -m 0700 -d ~/.ssh

作成した階層へ移動

$ cd ~/.ssh

公開鍵を作成
ここで2点ほど注意が
メールアドレスは各自のアドレスへ変更すること
パスフレーズは何も入力せずにEnterで進めること

$ ssh-keygen -t rsa -C test@gmail.com
Enter file in which to save the key (/Users/xxxxxxxx/.ssh/id_rsa): 
Enter passphrase (empty for no passphrase): 
Enter same passphrase again: 

Enterを計3回押します。

ここでlsコマンドを実行すると、

$ ls
id_rsa      id_rsa.pub

が表示されるはずです。

下記コマンドで、公開鍵をクリップボードへコピーすることができるので、後述する箇所へ貼り付けてください。

$ cat ~/.ssh/id_rsa.pub | pbcopy

BitbucketへのSSH鍵登録方法

Railsチュートリアルの資料が少し古かったため、最新のをこちらへ載せておきます。

ログイン後、ダッシュボードの左したのユーザアイコンからBitbucket設定をクリック f:id:taxa_program:20180105142227p:plain

SSH鍵から鍵を追加をクリックし、上記で作成した公開鍵を貼り付ける。 f:id:taxa_program:20180105142502p:plain

以上で公開鍵の登録が行えたと思います。

この後の手順はRailsチュートリアルを参考に行えると思います!!