SlideShare a Scribd company logo
1 of 12
Download to read offline
マークアップで使える
Ruby!
2018/1/30
大手町.rb #3
大手町.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 の初級者がメインターゲット
大手町.rb #3 発表資料 「マークアップで使える!Ruby」
お話の前に
エネチェンジの事業
電気やガスの切替をサポート!
突然のニュース!
大東エナジー(26万契約)が、電気事業撤退!
わずか1ヵ月の期間で切り替えるよう突然レターを発送し要請
切替先は各地域の電力会社
東京なら東京電力
エネチェンジならお客様の電気の使い方に合った
最適な電力会社を提案できる!
LP を作成 (← 今日の話に関係するところ)
https://enechange.jp/specials/daito-support
大東エナジーからの切替に対応
2
大手町.rb #3 発表資料 「マークアップで使える!Ruby」
内容だけが違って、構造は同一の繰り返し
各、電力会社の管轄エリアごとに
同じレイアウト、同じ構造
記述内容だけが、異なる
3
大手町.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 %>
大手町.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 %>
大手町.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 %>
大手町.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>
大手町.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>
大手町.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 %>
大手町.rb #3 発表資料 「マークアップで使える!Ruby」
まとめ
エネチェンジで実際にあったランディングページで使わ
れていたコードを元にして、 Ruby の使えるテクニック
を紹介しました。
ヒアドキュメント、String#split、ブロックの受け取り
Enumerable#each_slice(2)
render partial: "~", collection: ~, as: ~
Hash#values_at
多重代入と組合わせるとベンリ
OpenStruct + instance_eval
禁断の秘技なので、非推奨
参考になれば、嬉しいです。
10
11
ご清聴ありがとう
ございました

More Related Content

More from Tomoya Kawanishi

Ruby の文字列について
Ruby の文字列についてRuby の文字列について
Ruby の文字列についてTomoya Kawanishi
 
RubyGems と Bundler について
RubyGems と Bundler についてRubyGems と Bundler について
RubyGems と Bundler についてTomoya Kawanishi
 
Ruby の正規表現について
Ruby の正規表現についてRuby の正規表現について
Ruby の正規表現についてTomoya Kawanishi
 
Ruby での外部コマンドの実行について
Ruby での外部コマンドの実行についてRuby での外部コマンドの実行について
Ruby での外部コマンドの実行についてTomoya Kawanishi
 
Ruby のワンライナーについて
Ruby のワンライナーについてRuby のワンライナーについて
Ruby のワンライナーについてTomoya Kawanishi
 
AWS のコスト管理をちゃんとしたくてやったこと
AWS のコスト管理をちゃんとしたくてやったことAWS のコスト管理をちゃんとしたくてやったこと
AWS のコスト管理をちゃんとしたくてやったことTomoya Kawanishi
 
PostgreSQL のイケてるテクニック7選
PostgreSQL のイケてるテクニック7選PostgreSQL のイケてるテクニック7選
PostgreSQL のイケてるテクニック7選Tomoya Kawanishi
 
HTTPと Webクローリングについて
HTTPと WebクローリングについてHTTPと Webクローリングについて
HTTPと WebクローリングについてTomoya Kawanishi
 
Active record query interface
Active record query interfaceActive record query interface
Active record query interfaceTomoya Kawanishi
 
Active Support のコア拡張機能について
Active Support のコア拡張機能についてActive Support のコア拡張機能について
Active Support のコア拡張機能についてTomoya Kawanishi
 
Ruby ビジネス創出展 Ruby初心者向けプログラミングセミナー
Ruby ビジネス創出展 Ruby初心者向けプログラミングセミナーRuby ビジネス創出展 Ruby初心者向けプログラミングセミナー
Ruby ビジネス創出展 Ruby初心者向けプログラミングセミナーTomoya Kawanishi
 
RubyのDir、File、IO について
RubyのDir、File、IO についてRubyのDir、File、IO について
RubyのDir、File、IO についてTomoya Kawanishi
 
Ruby の制御構造とリテラルについて
Ruby の制御構造とリテラルについてRuby の制御構造とリテラルについて
Ruby の制御構造とリテラルについてTomoya Kawanishi
 
Ruby の String のメソッドについて
Ruby の String のメソッドについてRuby の String のメソッドについて
Ruby の String のメソッドについてTomoya Kawanishi
 
RubyGems と Bundler について
RubyGems と Bundler についてRubyGems と Bundler について
RubyGems と Bundler についてTomoya Kawanishi
 
AWSコストの事業部別コスト配分について
AWSコストの事業部別コスト配分についてAWSコストの事業部別コスト配分について
AWSコストの事業部別コスト配分についてTomoya Kawanishi
 
Pry による repl 駆動開発について
Pry による repl 駆動開発についてPry による repl 駆動開発について
Pry による repl 駆動開発についてTomoya Kawanishi
 
Module での名前解決について
Module での名前解決についてModule での名前解決について
Module での名前解決についてTomoya Kawanishi
 

More from Tomoya Kawanishi (20)

英単語の覚え方
英単語の覚え方英単語の覚え方
英単語の覚え方
 
Ruby の文字列について
Ruby の文字列についてRuby の文字列について
Ruby の文字列について
 
RubyGems と Bundler について
RubyGems と Bundler についてRubyGems と Bundler について
RubyGems と Bundler について
 
Ruby の正規表現について
Ruby の正規表現についてRuby の正規表現について
Ruby の正規表現について
 
Ruby での外部コマンドの実行について
Ruby での外部コマンドの実行についてRuby での外部コマンドの実行について
Ruby での外部コマンドの実行について
 
Ruby のワンライナーについて
Ruby のワンライナーについてRuby のワンライナーについて
Ruby のワンライナーについて
 
AWS のコスト管理をちゃんとしたくてやったこと
AWS のコスト管理をちゃんとしたくてやったことAWS のコスト管理をちゃんとしたくてやったこと
AWS のコスト管理をちゃんとしたくてやったこと
 
PostgreSQL のイケてるテクニック7選
PostgreSQL のイケてるテクニック7選PostgreSQL のイケてるテクニック7選
PostgreSQL のイケてるテクニック7選
 
HTTPと Webクローリングについて
HTTPと WebクローリングについてHTTPと Webクローリングについて
HTTPと Webクローリングについて
 
Rake
RakeRake
Rake
 
Active record query interface
Active record query interfaceActive record query interface
Active record query interface
 
Active Support のコア拡張機能について
Active Support のコア拡張機能についてActive Support のコア拡張機能について
Active Support のコア拡張機能について
 
Ruby ビジネス創出展 Ruby初心者向けプログラミングセミナー
Ruby ビジネス創出展 Ruby初心者向けプログラミングセミナーRuby ビジネス創出展 Ruby初心者向けプログラミングセミナー
Ruby ビジネス創出展 Ruby初心者向けプログラミングセミナー
 
RubyのDir、File、IO について
RubyのDir、File、IO についてRubyのDir、File、IO について
RubyのDir、File、IO について
 
Ruby の制御構造とリテラルについて
Ruby の制御構造とリテラルについてRuby の制御構造とリテラルについて
Ruby の制御構造とリテラルについて
 
Ruby の String のメソッドについて
Ruby の String のメソッドについてRuby の String のメソッドについて
Ruby の String のメソッドについて
 
RubyGems と Bundler について
RubyGems と Bundler についてRubyGems と Bundler について
RubyGems と Bundler について
 
AWSコストの事業部別コスト配分について
AWSコストの事業部別コスト配分についてAWSコストの事業部別コスト配分について
AWSコストの事業部別コスト配分について
 
Pry による repl 駆動開発について
Pry による repl 駆動開発についてPry による repl 駆動開発について
Pry による repl 駆動開発について
 
Module での名前解決について
Module での名前解決についてModule での名前解決について
Module での名前解決について
 

Recently uploaded

2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~arts yokohama
 
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦Sadao Tokuyama
 
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdfTaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdfMatsushita Laboratory
 
20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdfAyachika Kitazaki
 
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法ssuser370dd7
 
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-LoopへTetsuya Nihonmatsu
 
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見Shumpei Kishi
 
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)ssuser539845
 
2024 01 Virtual_Counselor
2024 01 Virtual_Counselor 2024 01 Virtual_Counselor
2024 01 Virtual_Counselor arts yokohama
 

Recently uploaded (12)

2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
 
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
 
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdfTaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
 
2024 04 minnanoito
2024 04 minnanoito2024 04 minnanoito
2024 04 minnanoito
 
20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf
 
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
 
2024 03 CTEA
2024 03 CTEA2024 03 CTEA
2024 03 CTEA
 
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
 
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
 
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
 
2024 01 Virtual_Counselor
2024 01 Virtual_Counselor 2024 01 Virtual_Counselor
2024 01 Virtual_Counselor
 
What is the world where you can make your own semiconductors?
What is the world where you can make your own semiconductors?What is the world where you can make your own semiconductors?
What is the world where you can make your own semiconductors?
 

マークアップで使える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