Weitere ähnliche Inhalte
Mehr von Tomoya Kawanishi (20)
マークアップで使えるRuby
- 2. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
1自己紹介
Tomoya Kawanishi a.k.a. @cuzic
エネチェンジ株式会社 チーフエンジニア
電力会社、ガス会社を切り替えるなら、エネチェンジ経由で!
一般家庭も!法人も!
Enechange Meetup for Engnieer #02 を予定(2月1日(木))
エネチェンジのエンジニアと交流できます
https://enechange-meetup.connpass.com/event/76528/
Ruby関西の中の人
発表者として登壇くださる方、あとで声かけください。
関西Ruby会議の開催時はスポンサーも募集!
大手町.rb の中の人
毎月 最終火曜日に 大手町.rb の開催を予定
東京駅、各線大手町駅から直結!
Ruby の初級者がメインターゲット
- 3. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
お話の前に
エネチェンジの事業
電気やガスの切替をサポート!
突然のニュース!
大東エナジー(26万契約)が、電気事業撤退!
わずか1ヵ月の期間で切り替えるよう突然レターを発送し要請
切替先は各地域の電力会社
東京なら東京電力
エネチェンジならお客様の電気の使い方に合った
最適な電力会社を提案できる!
LP を作成 (← 今日の話に関係するところ)
https://enechange.jp/specials/daito-support
大東エナジーからの切替に対応
2
- 4. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
内容だけが違って、構造は同一の繰り返し
各、電力会社の管轄エリアごとに
同じレイアウト、同じ構造
記述内容だけが、異なる
3
- 5. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
配列の配列の繰り返し
Array#each で配列の内容を繰り返し処理できる
配列の個々の要素を一度にブロック引数で受け取れる
4
<%
[
["tepco", "standard_s", "東京電力エナジーパートナー", "スタンダードS"]
["looop", "plan_home", "Looop", "おうちプラン"]
].each do |provider_key, plan_key, provider, plan_name|
%>
<h5 class="e__plan-title">
<a href="/plans/<%= provider_key %>/<%= plan_key %>" target="_blank">
<span><%= provider %></span>
<span><%= plan_name %></span>
</a>
</h5>
<% end %>
- 6. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
"" や , を減らして、設定ファイルっぽく書く方法
ヒアドキュメント
String#split
Enumerable#each_slice(4)
4個づつ順に処理できる
split した結果をブロック引数で受け取れる
5
<%
<<EOD.split.each_slice(4) do |provider_key, plan_key, provider, plan_name|
tepco standard_s 東京電力エナジーパートナー スタンダードS
looop plan_home Looop おうちプラン
EOD
%>
<h5 class="e__plan-title">
<a href="/plans/<%= provider_key %>/<%= plan_key %>" target="_blank">
<span><%= provider %></span>
<span><%= plan_name %></span>
</a>
</h5>
<% end %>
- 7. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
render partial: "~", collection:
ハッシュの配列を使うこともできる
render の引数 collection
配列の各要素で繰り返し
ローカル変数名は as: で指定する
6
<%
plans = [{
provider_key: "tepco",
plan_key: "standard_s",
provider: "東京電力エナジーパートナー",
plan_name: "スタンダードS",
},{
provider_key: "looop",
plan_key: "plan_home",
(snip)
}]
%>
(snip)
<%= render partial: "plan_item", collection: plans, as: :plan %>
- 8. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
ハッシュの各要素の使い方
利用側のコード
as で指定したローカル変数 plan 経由でアクセスできる
7
<h5 class="e__plan-title">
<a href="/plans/<%= plan[:provider_key] %>/<%= plan[:plan_key] %>"
target="_blank">
<span><%= plan[:provider] %></span>
<span><%= plan[:plan_name] %></span>
</a>
</h5>
- 9. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
Hash#values_at の利用、多重代入
Hash#values_at を使うと、複数のキーに対応する値を
一度に取り出すことができる
values_at の返り値は配列
多重代入で、複数の変数に一度で設定
ブロック引数で複数受け取れるのと同じ仕組み
8
<% provider_key, plan_key, provider, plan_name =
plan.values_at(:provider_key, :plan_key, :provider, :plan_name) %>
<h5 class="e__plan-title">
<a href="/plans/<%= provider_key %>/<%= plan_key %>" target="_blank">
<span><%= provider %></span>
<span><%= plan_name %></span>
</a>
</h5>
- 10. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
禁断の秘技(非推奨)
OpenStruct + instance_eval !
黒魔法なので、あまりオススメではない
1つずつローカル変数に代入するウザさが解消
上記の provider_key などはローカル変数ではない
メソッド呼び出し
open_plan = OpenStruct.new(plan) とすると、
open_plan.provider_key などと、アクセス可能になる
instance_eval を使うことで、「open_plan. 」を省略できる
9
<% OpenStruct.new(plan).instance_eval do %>
<h5 class="e__plan-title">
<a href="/plans/<%= provider_key %>/<%= plan_key %>" target="_blank">
<span><%= provider %></span>
<span><%= plan_name %></span>
</a>
</h5>
<% end %>
- 11. 大手町.rb #3 発表資料 「マークアップで使える!Ruby」
まとめ
エネチェンジで実際にあったランディングページで使わ
れていたコードを元にして、 Ruby の使えるテクニック
を紹介しました。
ヒアドキュメント、String#split、ブロックの受け取り
Enumerable#each_slice(2)
render partial: "~", collection: ~, as: ~
Hash#values_at
多重代入と組合わせるとベンリ
OpenStruct + instance_eval
禁断の秘技なので、非推奨
参考になれば、嬉しいです。
10