gemを超噛み砕いて説明

ruby on railsチュートリアルをやって何度もでてくるgem。gemはよく出現してくるがこれはなんなの? 超簡単に噛み砕いてみた。 gemとはRuby用のライブラリを使うときに必要となるソフトウェアである。 ruby on rails でWEBアプリを作る際に、欲しい機能が出てきた際にgemが手助けしてくれる。 また、bundlerというのもよく目にするが、これもgemである。 どんなgemか? bundlerはgemを管理するgemである。

サーバーとブラウザの通信の仕組みについて学んだ

サーバーとブラウザの通信の仕組みについて学びました。

サーバーへリクエストを送って、サーバーからレスポンスが帰ってきて HTML , CSS(それとJavaScript)で書かれたデザインがブラウザ上でみえることである。

サーバーの究極の目的は送られたリクエストをレスポンスすることである。

phpruby on railsはリクエストとレスポンスの間に混在するそのやりとりがいかに上手く運べるか設計する役割を果たしている。

railsアプリの作動する流れ(MVC)について簡単に掃除に例えて解説

前回のブログの続きはまたの機会にさせていただきたいと思いましたが、最終的にどこに行き着いたか話さないと今後このブログを書く上で背景がみえないので簡単に説明させて頂きます。知り合いに連れて行かれたDESSART&Co.という会社でプログラミングを勉強させていただくことになりました。主にエンジニアのtechnumaさんに指導をしていただいております。前回のブログでプログラミングの鬼に該当する方ですが実際はとても優しく、モチベーションを維持させることが上手い方なので講師として最高な素質を持っています。

教えていただいていること: HTML, CSS, Ruby, Ruby on Rails

technumaさんのプロフィール

身長:174cm

プログラミングレベル:鬼 

 

technumaさんに教わったことを書かせていただくこともありますが、先に謝ります。

間違った情報を発信したら申し訳ありません!!

自分の言葉と理解で書きますので教わったこととズレが生じる可能性がありますので、そこは私の理解不足と捉えてくれたら幸いです。

 

早速ですがrailsアプリの流れについて説明したいと思います。

矢印で流れを表記すると書きの感じ(見づらいかな・・)

 

ブラウザ→ルーティングコントローラモデルデータベース)→ビュー→ブラウザ

 

まずブラウザからURL(リクエスト)を入力します。このURLがルーティングです。

その入力されたURLに応じてどのコントローラーでどういうアクションを作動させるか決まります。コントローラーモデルデータベース(情報の宝庫)からどの情報を取ってくるか指示を出します。モデルはデータベースから取ってきた情報をコントローラーに渡して、コントローラーはビューにブラウザから表示させるように指示を出します。

こういった流れなんですが、以下の掃除の例えで順を追っていきます。

 

ー 配役

社長 = クライアント+ルーティング

technumaさん = コントローラー

Mさん = モデル

ブライアン = ビュー

 

社長「ブライアンに雑巾で床掃除させておいて」

technuma さん「はい!」

社長からブライアンに雑巾で床掃除をさせるようにtechnumaさんに伝えています。ブライアンは直接社長から掃除するように命令されていません。technumaさん倉庫(データベース)にある雑巾を持ってくるようにMさんに指示を出します。

 

technumaさんMさん、雑巾を持ってきてください」

Mさん「了解しました!!」

 

Mさんは倉庫から雑巾を持ってきてをtechnumaさんに渡しました。雑巾を手にしたtechnumaさん

 

technumさんブライアン、この雑巾で床掃除しているところを社長にみせてあげてください」

ブライアン「わかりました!!」

 

ブライアンは社長の指示をtechnumaさんを通して雑巾で床を拭いています。社長ブライアンの床を掃除している姿をみています。

 社長は次、どんな指示をtechnumaさんを通して(technumaさんはMさんを使って)ブライアンにするのかな??

 

 

 

 

<HTML CSS> 同じクラス内でも違う島

-html-

<div class="container" >

<h1>プログラミングは</h1>

<p>楽しいぞ</p>

</div>

 

これで文字列を透明にしたいとき私は下記のようにCSSに記入しがちでした。

-CSS-

.container{

opacity: 0.7;

}

しかしこうしてしまうと結果としてcontainerの中の背景まで透明がかってしまいます。

下記の様に分けなければいけません。

-CSS-

.container h1{

opacity: 0.7;

}

.container p{

opacity: 0.7;

}

同じclassの中でもそれぞれの島があるんですね。

 

Ruby のゲッターを自分なりに説明する

rubyのゲッターとは何かを取得するみたいななんとなくの想像はできるが果たしてそうなのか。。文章でつづりながら理解してみよう。

  1. class Car
  2.  attr_reader :name, :color  #nameとcolorのゲッターを定義
  3.  def initialize(name, color)
  4.   @name = name
  5.   @color = color
  6.  end
  7.  def info 
  8.  puts "名前: #{@name} 色: #{@color}"
  9.  end
  10. end
  11. my_car = Car.new("プリウス", "赤")
  12. puts my_car.name #ゲッターの呼び出し 結果:プリウス
  13. puts my_car.color #ゲッターの呼び出し 結果:赤

上記のコードを行ごとに番号つけたかったので番号付きリスト機能を使ったら見事に文字とマッチしないでかい数字が現れたΣ(゚Д゚) ここらへんの工夫は今後考えるので cut me some slack(この英語使ってみたかった)ね。

この14,15行目の結果がそれぞれ13行目の引数から出力されたのはわかる。しかしその引数がどのような旅をして結果までに辿りついたか考察してみる必要がありそうだ。まず1〜6行目からみてみよう。

1行目は"Car"クラスを定義している。詳しいクラスの説明は省くが(自分でもちゃんと理解しているか不安ある)ここではクラス名が"Car"なのでただの車なんだなと思っていただいて、"Car"クラスの中に書くコードは車の性質(インスタンス)なんだなと思っていただければいいかと思います。

 

2行目はゲッターの定義をしている。後のゲッターを呼び出すためにここにゲッター装置を仕掛けておく・・

 

3行目はinitializeという特別なメソッドであり8行目のinfoメソッドの"info"の様に自分で勝手につけていいメソッド名ではない。13行目の".new"(newメソッド)と結びついていて,newメソッドを生成するときにinitializeメソッドが呼ばれる。initialize とnewって両方”新しい”感じがしますよね(雰囲気とイメージで結びつけています)。

 

 

4,5行目の@name,@colorのように"@"から始まるものはインスタンス変数と呼ばれていて、そのインスタンスの持つデータを表している。上記のコードを参考にして簡潔にあらわしてみよう。

class Car

 def initialize(name, color)
 @name = name

 @color = color

 end

end

car1 = Car.new("プリウス", "赤")

car2 = Car.new("ポルシェ", "白")

 newメソッドで与えられたデータがinitializeメソッドでインスタンス変数(@nameと@color)に代入され、それぞれのインスタンスの固有のデータになる。car1はプリウスで赤い、car2はポルシェで白い。ぼやぼやっとした車のイメージがnewメソッドのおかげでくっきりしてきましたね(*このコードだけではnewメソッドの引数が文字として結果がでてこないのでただのイメージ上での話)。

6行目のendでinitializeメソッドの定義が終わります。

 

次は8〜10行目をさくっとみてみよう。

8行目でinfoメソッドの定義をしまーすと宣言をしている。

9行目でinfoメソッドの中身を記しており、"名前: #{@name} 色: #{@color}"の@が頭にあるインスタンス変数をくっきり文字として表します。(puts"〜"は文字列をブラウザ上に反映させます。)

 10行目のendはinfoメソッドの定義を終了しまーすと宣言している。

 

11行目のendでCarクラスの定義つまりCarの性能はここまでと宣言している。

 

次に13行目をみてみよう。以下のコードで説明しよう。

class Car

 def hello

  puts "こんにちは"

 end

end

my_car = Car.new

my_car.hello  #結果: こんにちは

newメソッドについてはinitializeメソッドが記述されていないためここでは何も機能をもっていないが、クラス名につくものとここではスルーしましょう。my_car = Car.new でmy_carは"Car"クラスに関係するものだよと定義をしていてmy_car.helloでCarクラスの中で定義したhelloメソッドを呼び出しています。(*"my_car"の部分はインスタンスと呼び".hello"の部分はインスタンスメソッドと呼ばれる。 インスタンスメソッドの呼び出し方・・・$ インスタンス.インスタンスメソッド)helloメソッドを呼び出したので

こんにちはと結果が返ってきました。

 

最後に14と15行目を説明する前に1〜13行目の流れを追っていけばおのずと答えがみえてくるだろう。最初に13行目の"プリウス"と"赤"はそれぞれ3行目のnameとcolorに引き継がれました。そのnameとcolorはそれぞれ@nameと@colorに代入され、9行目で元々のデータをである"プリウス""赤"がブラウザに現れます。しかしここではinfoメソッドを呼び出していないので"名前:プリウス 色:赤"とは現れません。14行目と15行目でそれぞれnameとcolorをそれぞれどの引数のデータを表すか指定しています。しかもその定義は予め2行目で書かれています。2行目の装置を14行目と15行目でそれぞれ作動させている。指定してゲットするつまりゲッターである。

ここで重要なのは@インスタンス変数の値はクラス内でしかとれないという前提をあるが、クラス外で@インスタンス変数をゲットしたければattr_reader :name :colorのようにクラス内で記述してからクラス外で.name .colorというメソッドを記述すれば呼び出すことができるのだ。

 

最後の方乱暴になってしまい大変申し訳ありません。(最初から?)