Markdown基礎
以下は、自身がフィヨルドブートキャンプのカリキュラムで学んだ内容をメモしたものになります。
元の著者が表現したい内容を歪めている可能性もあるので、詳しくは参考文献をご確認ください。また、フィヨルドブートキャンプ 独自のコンテンツで学習したメモもあるので、気になった方はご参加いただければと思います。
参考文献
DARING FIREBALL by John Gruber
Markdown記法 チートシート
Markdownとは
Markdownとは
お手軽に文章構造を明示でき、読みやすさと書きやすさにこだわって開発された文章の書き方。
HTMLと合わせて使用することもできるが、HTMLで可能な表現を一部実現しているだけで、取って代わるようなものではない。あくまで文章表現の一種として限定されており、コンセプトとしては原文のままでも読みやすく、書きやすく、編集できることである。
HTMLと組み合わせられる
HTMLにあるdl要素（定義リスト）に相当するものがマークダウンにはないので、そのままHTMLを記載する。
このようにマークダウンにHTMLを直接記述することができる。
※HTMLのブロック要素の中ではマークダウンが有効にならない。例えば*(アスタリスク)による強調はHTMLで対応する必要がある。(インライン要素内では可能)
<dl> <dt>用語</dt> <dd>用語に対する説明</dd> <dl/>
↓
- 用語
- 用語に対する説明
リストの中にコードブロックを置く
コードブロックの行頭に8スペースか2タブ分が必要。
（原初のMarkdownにおいての仕様だが、そこから派生した記法を採用するアプリなどでは4つスペースでもいいこともある。もちろん、コードブロックなので前後に空行ではさむこと。）
1. FOO ```ruby puts "Hello, world!" ``` 2. BAR
↓
1. FOO
```ruby
puts "Hello, world!"
```
- BAR
※はてブではなぜかうまく表示されないみたい…詳しい方教えて下さい...
リンク
リンクは通常、下記のように[]()を組み合わせて記述する。
[Google](https://www.google.com/)
↓
Google
マウスホバー時にリンク先のタイトルを表示させることができる。
[Google](https://www.google.com/ "グーグル先生")
↓
Google
また、リンクにIDをつけてID経由で参照させることも可能。参照リンク
こうすることにより段落では文章の中身に集中することができ、読みやすく記載量を減らすことができる。
同様のリンクが多いほど、効果を発揮する。
[Google][id] [id]: https://www.google.com/ "グーグル先生"
↓
Google
自動リンク
URLやメールアドレスを<>で囲むだけで自動でリンクとして表示される。
<https://www.google.com/>
上記はMarkdownでは以下のように解釈されている。
<a href="https://www.google.com/">https://www.google.com/</a>
画像
画像はリンクに近いルールで記述する。
感嘆符のあとの[]には代替テキストを記載する。そのあとはマウスホバー時の表示テキストを任意で追加しても良い。
↓
参照リンクにも対応している。
![Alt Text][img_id] [img_id]: https://bit.ly/35lbZ3i "ピヨルド"
↓
