はじめに

Mardown入門者・経験者の両方に向けて、書きました。
文章ではなく、直感でわかりやすい「サンプルでまとめる」形式を取りました。（Qiitaの記法を採用しています。）

A. 最頻出コマンド

1. 見出し（`#`）

# タイトル
## サブタイトル

タイトル

サブタイトル

2. 太字（`**`）

markdownはとても**便利**です。

markdownはとても便利です。

3. リスト（`-`）

- 普通のリスト 1
- 普通のリスト 2
- 普通のリスト 3

1. 番号付きリスト 1
2. 番号付きリスト 2
3. 番号付きリスト 3

- [ ] チェックボックス 1
- [ ] チェックボックス 2
- [x] チェックボックス 3

普通のリスト 1
普通のリスト 2
普通のリスト 3

番号付きリスト 1
番号付きリスト 2
番号付きリスト 3

チェックボックス 1
チェックボックス 2
チェックボックス 3

4. 画像（`![]()`）

![画像が読み込めなかった時に表示するテキスト](画像のリンク)

![サンプル写真](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240280/63557e45-4b4f-cd5a-1fe3-5a2c5d3e3596.png)

サイズ指定

画像のサイズを指定する場合、HTMLで書くこともできます。

<img width="500" alt="サンプル写真(画像が読み込めなかった時に表示するテキスト)" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240280/63557e45-4b4f-cd5a-1fe3-5a2c5d3e3596.png">

5. リンク（`[]()`）

[表示する文字](リンク)

[【保存版】サンプルでまとめてみた『Markdownチートシート』](https://qiita.com/umi_mori/private/24f7b47563cffcc5fd86)

【保存版】サンプルでまとめてみた『Markdownチートシート』

6. 短いコード（`）

バッククオート（`）という少し変わった記号を用いる。

`var x = 7;`

var x = 7;

7. 長いコード（```）

同様に、バッククオート（`）を用いる。（\を書いているが、実際は書かない。）

\```python:sample.py
from flask import Flask, render_template, request
import logging

app = Flask(__name__)

@app.route('/')
def index():
    sample_title = "title"
    sample_array = ['x', 'y', 'z']
    sample_json = {"title": "sample_title", "desc": "sample_desc"}
    return render_template('index.html', title=sample_title, array=sample_array, json=sample_json)

@app.route('/test', methods=['GET', 'POST'])
def test():
    if request.method == 'GET':
        logging.log(30, 'warning')
        logging.log(100, 'test1')
        res = request.args.get('get_value')
    elif request.method == 'POST':
        res = request.form['post_value']
    return res

if __name__ == '__main__':
    app.debug = True
    app.run(host='0.0.0.0', port=8080)
\```

sample.py

from flask import Flask, render_template, request
import logging

app = Flask(__name__)

@app.route('/')
def index():
    sample_title = "title"
    sample_array = ['x', 'y', 'z']
    sample_json = {"title": "sample_title", "desc": "sample_desc"}
    return render_template('index.html', title=sample_title, array=sample_array, json=sample_json)

@app.route('/test', methods=['GET', 'POST'])
def test():
    if request.method == 'GET':
        logging.log(30, 'warning')
        logging.log(100, 'test1')
        res = request.args.get('get_value')
    elif request.method == 'POST':
        res = request.form['post_value']
    return res

if __name__ == '__main__':
    app.debug = True
    app.run(host='0.0.0.0', port=8080)

B. 知ってて便利コマンド

8. 表

|概要 (中央寄せ)|担当 (左寄せ)|備考 (右寄せ)|
|:---:|:---|---:|
|概要 1|Aさん|備考 1|
|概要 2|Bさん|備考 2|
|概要 3|Cさん|備考 3|

概要 (中央寄せ)	担当 (左寄せ)	備考 (右寄せ)
概要 1	Aさん	備考 1
概要 2	Bさん	備考 2
概要 3	Cさん	備考 3

9. 引用

> 私たちの最大の弱点は諦めることにある。
> 成功するのに最も確実な方法は、
> 常にもう一回だけ試してみることだ。
> 『トーマスエジソン』より

私たちの最大の弱点は諦めることにある。
成功するのに最も確実な方法は、
常にもう一回だけ試してみることだ。
『トーマス・エジソン』より

10. 水平線

---

11. 打ち消し線 / イタリック

~~打ち消される文字~~
*イタリックな文字*

~~打ち消される文字~~
イタリックな文字

C. 知る人ぞ知るコマンド

12. 注釈

2行目は、注釈の内容が末尾に自動的に追加されます。（\を書いているが、実際は書かない。）

[^注釈1]
\[^注釈1]: この注釈は、下に自動的に表示されます。

13. 色付き文字（HTML）

詳しい記事：Qiitaのマークダウンで色をつける方法[140色]

<font color="Red">Red</font>
<font color="Green">Green</font>
<font color="Blue">Blue</font>

<font color="#ff0000">16進数</font>

Red
Green
Blue

16進数

14. アコーディオン / 折りたたみ (HTML)

<details>
    <summary>【保存版】サンプルでまとめてみた『Markdownチートシート』</summary>
    1. 見出し（`#`）
    2. 太字（`**`）
    3. リスト（`-`）
    4. 画像（`![]()`）
    5. リンク（`[]()`）
    6. 短いコード（`）
    7. 長いコード（```）
    8. 表
    9. 引用
    10. 水平線
    11. 打ち消し線 / イタリック
</details>

【保存版】サンプルでまとめてみた『Markdownチートシート』

1. 見出し（#）
2. 太字（**）
3. リスト（-）
4. 画像（![]()）
5. リンク（[]()）
6. 短いコード（`）
7. 長いコード（```）
8. 表
9. 引用
10. 水平線
11. 打ち消し線 / イタリック

14. 埋め込みタグ

Twitter（2020年の3月ごろから無効になりました）

<blockquote class="twitter-tweet">
    <a href="https://twitter.com/umi_mori_jp/status/1137261474064228352?ref_src=twsrc%5Etfw">ここに代替えテキストのようなものが入ります。</a>
</blockquote>

ここに代替えテキストのようなものが入ります。

CodePen

詳しい記事：Qiitaで記事にCodePenが埋め込めるようになりました

<p data-height="265" data-theme-id="0" data-slug-hash="dJgNLK" data-default-tab="js,result" data-user="tomoasleep" data-embed-version="2" data-pen-title="dJgNLK" class="codepen">
    See the Pen 
    <a href="https://codepen.io/tomoasleep/pen/dJgNLK/">dJgNLK</a>
    by Tomoya Chiba (<a href="https://codepen.io/tomoasleep">@tomoasleep</a>) 
    on <a href="https://codepen.io">CodePen</a>.
</p>

<script async src="https://production-assets.codepen.io/assets/embed/ei.js"></script>

See the Pen dJgNLK by Tomoya Chiba (@tomoasleep) on CodePen.

15. 数式

3種類の書き方です。（\を書いているが、実際は書かない。）
詳しい記事：Qiitaの数式チートシート

\```math
e^{i\pi} = -1
\```

$$ e^{i\pi} = -1$$

オイラーの等式は、$ e^{i\pi} = -1 $ です。

e^{i\pi} = -1

$$ e^{i\pi} = -1$$

オイラーの等式は、$ e^{i\pi} = -1 $ です。

おまけ

Markdown => HTML

Markdown to HTML - Markdownで書かれたファイルをHTMLに自動変換してくれるWebアプリ

Markdownエディタ特集

Typora

Boostnote

Slack

Slackも簡易的なMarkdownエディタを採用しています。

Qiitaの右側の目次

Qiitaの右側の目次は、見出し（#）から自動検出されます。

コード対応言語早見表

- ABAP
- ActionScript
- Apache
- API Blueprint
- AppleScript
- Awk
- BIML
- 1C (BSL)
- C
- Ceylon
- CFScript
- Clojure
- CMake
- CoffeeScript
- Common Lisp
- Config File
- Console
- Coq
- C++
- Crystal
- C#
- CSS
- D
- Dart
- diff
- digdag
- Docker
- DOT
- Eiffel
- Elixir
- Elm
- ERB
- Erlang
- Factor
- Fortran
- FSharp
- Gherkin
- GLSL
- Go
- Gradle
- Graphql
- Groovy
- Hack
- Haml
- Handlebars
- Haskell
- HTML
- HTTP
- HyLang
- IDL
- IgorPro
- INI
- Io
- Irb
- Irb_output
- Java
- JavaScript
- Jinja
- JSON
- Json-doc
- Jsonnet
- JSX
- Julia
- Kotlin
- Lasso
- Liquid
- Literate CoffeeScript
- Literate Haskell
- LLVM
- Lua
- Make
- Markdown
- MATLAB
- MoonScript
- Mosel
- MXML
- Nasm
- nginx
- Nim
- Nix
- Objective-C
- OCaml
- Pascal
- Perl
- PHP
- Plain Text
- Plist
- Pony
- powershell
- Praat
- Prolog
- Prometheus
- .properties
- Protobuf
- Puppet
- Python
- Q
- QML
- R
- Racket
- Ruby
- Rust
- Sass
- Scala
- Scheme
- SCSS
- sed
- shell
- Sieve
- Slim
- Smalltalk
- Smarty
- SML
- SQL
- Swift
- TAP
- Tcl
- TeX
- TOML
- TypeScript
- Tulip
- Turtle/TriG
- Twig
- Vala
- Visual Basic
- Verilog and System Verilog
- VHDL 2008
- VimL
- Vue
- Wollok
- XML
- YAML

この注釈は、下に自動的に表示されます。 ↩

【保存版】サンプルでまとめてみた『Markdownチートシート』

はじめに

A. 最頻出コマンド

1. 見出し（#）

タイトル

サブタイトル

2. 太字（**）

3. リスト（-）

4. 画像（![]()）

サイズ指定

5. リンク（[]()）

6. 短いコード（`）

7. 長いコード（```）

B. 知ってて便利コマンド

8. 表

9. 引用

10. 水平線

11. 打ち消し線 / イタリック

C. 知る人ぞ知るコマンド

12. 注釈

13. 色付き文字 （HTML）

14. アコーディオン / 折りたたみ (HTML)

14. 埋め込みタグ

Twitter（2020年の3月ごろから無効になりました）

CodePen

15. 数式

おまけ

Markdown => HTML

Markdown to HTML - Markdownで書かれたファイルをHTMLに自動変換してくれるWebアプリ

Markdownエディタ特集

Typora

Boostnote

Slack

Qiitaの右側の目次

コード対応言語早見表

1. 見出し（`#`）

2. 太字（`**`）

3. リスト（`-`）

4. 画像（`![]()`）

5. リンク（`[]()`）

13. 色付き文字（HTML）