LoginSignup
0
0

.erb.mdファイルについて

Posted at

内容

  • jekill.erb.md という拡張子のファイルを扱うことになった。
  • 見慣れない拡張子でちょっと試行錯誤したので、扱い方のメモを残した。

前提知識

まず、markdownの中にHTMLが埋め込めるということを知っておきましょう。
私は恥ずかしながら、これを知らなかったのでだいぶ混乱した。
そういえば「ハイパーテキスト Markup Language」に対するMarkdown なのだと昔習ったわ...

使い方

要するに、markdownの中にerbが書けるよということらしい。
そして、.erbrubyHTMLの中に埋め込むファイル形式なので、
HTMLrubymarkdownも全部ごっちゃに書けます、ということの模様。

▼例えばこんな内容を書いたら...

# h1テキストです

クライアント名:<%= @client_name %>

業界:<%= @industry %>

<!-- 空白行必要です(後述) -->

▼こんなふうに出力されて...(画像はcss効いてます)
スクリーンショット 2024-04-25 10.38.48.png

▼生成されたHTMLはこんな感じでした。

<h1 id="h1テキストです">h1テキストです</h1>
<p>クライアント名:テスト用顧客</p>
<p>業界:["建設", "農業"]</p>

idが自動で生成されているので、厳密にやるなら細かく調整したほうが良さそうです。

なお、空白行を設定しないとこうなりました。

<!-- 書いた内容 -->
# h1テキストです
クライアント名:<%= @client_name %>
業界:<%= @industry %>

<!-- 出力結果 -->
<h1 id="h1テキストです">h1テキストです</h1>
<p>クライアント名:テスト用顧客
業界:[“建設”, “農業”]</p>

あえて行を詰めたいならこうする必要がありそう。

<!-- 書いた内容 -->
# h1テキストです
<p>クライアント名:<%= @client_name %></p>
<p>業界:<%= @industry %></p>

<!-- 出力結果 -->
<h1 id="h1テキストです">h1テキストです</h1>
<p>クライアント名:テスト用顧客</p>
<p>業界:["建設", "農業"]</p>

その他

ちなみにVSコード上はめっちゃエラー出るので、気にせず書き進める勇気が必要でした。特殊な拡張子を認識できるようにすればこれもなんとかなるのだろうけど...
スクリーンショット 2024-04-25 10.44.47.png

0
0
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
0
0