- 追加された行はこの色です。
- 削除された行はこの色です。
- Markdown へ行く。
#author("2022-04-22T18:54:39+09:00","default:inoue.ko","inoue.ko")
*Markdown
https://www.markdown.jp/what-is-markdown/
~
__[[Markdown（マークダウン）>-https://ja.wikipedia.org/wiki/Markdown]]__は、文書を記述するための軽量マークアップ言語のひとつで、見出し、箇条書きなどの書式を簡単な記号を使ってプレーンテキスト形式で書くことができます。John Gruber（ジョン・グルーバー）によって2004年に[[開発・公開されました>https://daringfireball.net/projects/markdown/]]。
Wikiの記法、READMEファイルの記述、電子メールにおいてプレーンテキストを装飾する際に使う記法などがこれと同様のものです。IT・Webの分野では・・というより、これからの社会では、情報共有に必須の「[[テクニカル・スキル>PortableSkills]]」と言えます。
-テキストエディタでプレーンテキストとして作成
-拡張子は .md
-__[[標準 Markdown のサンプル（画像データ付き）>https://github.com/koichi-inoue/MarkdownSample]]__
[[Atom]]で .md ファイルを開くと、以下の方法でプレビュー表示可能です。
CTRL + SHIFT + m
~
***Markdownには各種方言があります
以下、様々なMarkdown方言のマニュアルです。
-https://packetlife.net/media/library/16/Markdown.pdf （標準語）
-https://packetlife.net/media/library/17/MediaWiki.pdf （MediaWiki方言）
-https://github.github.com/gfm/（GitHub Flavored Markdown：GFM）
-https://www.rstudio.com/wp-content/uploads/2015/02/rmarkdown-cheatsheet.pdf（R言語）
~
***Markdownファイルを表示するには
-[[Atom]]の場合、mdファイルの編集時にカラー区分されるとともに
CTRL + SHIFT + m
でプレビュー表示可能です。
-Firefoxの場合、Markdown Viewer アドオンを追加
-Chromeの場合、Markdown Preview Plus 拡張を追加
~
***Markdownファイルの編集に適した環境は
使い慣れた[[テキストエディタ>TextEditor]]を利用するのが良いでしょう。
-[[Atom]]（[[OpenSource]]）
-[[Visual Studio Code>https://azure.microsoft.com/ja-jp/products/visual-studio-code/]]（[[OpenSource]]）
-[[StackEdit>https://stackedit.io/]]：オンラインのエディタです。
-[[Marp>https://yhatt.github.io/marp/]]：Markdownでスライドを作ることができます。
~
~
**記法
***見出し
行頭に「#」をつけることで、見出しに変換されます。
# 見出し1
## 見出し2
### 見出し3
#### 見出し4
~
***箇条書き
行頭に [ * ] / [ + ] / [ - ] のいずれかで Disc型リスト（ul）になります。
(空行)
* リスト項目1
+ リスト項目2
- リスト項目3
(空行)
行頭に [ 1 ] , [ 2 ] , [ 3 ] ...を入れるとDecimal型リスト(ol)になります。
(空行)
1. リスト項目1
2. リスト項目2
3. リスト項目3
(空行)
以下のように ''TAB'' でインデントをとるとネストすることが可能です。
- リスト1
- ネスト リスト1_1
- ネスト リスト1_1_1
- ネスト リスト1_1_2
- ネスト リスト1_2
- リスト2
- リスト3
~
***改行
以下の３つの方法があります。
-文末に半角空白スペースを2つつける
-1行空白の行を入れる
-<br>タグを使う
~
***テキスト装飾
[ * ] または [ _ ] で囲んだ範囲がイタリック体になります。
*イタリック*
_イタリック_
[ * ] または [ _ ] を２つ重ねて囲んだ範囲が太字になります。
**太字**
__太字__
[ ~ ]（ チルダ）を２つ重ねて囲んだ範囲に取り消し線がつきます。
~~定価 1,000円~~
~
***画像
画像を掲載するには代替文字列を ![ ] で囲んだ後に、ファイルへのパスを( )で囲んで記述します（パスは当該 MDファイルから見た相対パスです）。
画像をサイズ指定で表示したい場合は、HTMLタグが利用可能です。
<img src="images/sample.jpg" width="160">
~
***表組
以下のように縦ストロークで表組が可能です。
| LEFT | CENTER | RIGHT |
| ------- |:----------:| ------:|
| item1 | circle | red |
| item2 | triangle | green |
| item3 | rect | blue |
~
***リンク
Markdownには インライン と リファレンス という二つのリンクスタイルと、単純にURLを書くだけの自動リンクがあります。
-インラインスタイル
リンクしたい文字列を [ ]（隅カッコ）で＋リンク先URLを
[Google](http://www.google.com)
-リファレンス
名前と番号を使って定義したリンクを参照するものです。
* [GOOGLE][1]
* [YAHOO][2]
[1]: https://www.google.co.jp "Google"
[2]: https://www.yahoo.co.jp "Yahoo!"
-自動リンク
単純に<>でURIを囲むと自動的にリンクになります。
<http://www.w3.org>
~
***引用
行頭に [ > ] で引用になります。複数行にまたがる場合 各行に [ > ]。
>やまとうたは、人の心を種として、万の言の葉とぞなれりける。
>世の中にある人、ことわざ繁きものなれば、心に思ふことを、
>見るもの聞くものにつけて、言ひ出せるなり。
~
***ソースコードブロック
[ ` ]（バッククォート）を使うと、HTML, CSS などのコードの表示が可能です。複数行にわたる場合は、三連バッククォート [ ``` ] で挟むように記述します。
&small(この記号は [ ' ]（シングルクォート）ではありません。[SHIFT]+[@] で出ます。 );
`<h1>Sample</h1>`
` ` `
<div>
<p>Sample Text</p>
</div>
` ` `
~
***数式表現
__[[LaTeX]]__ の表現に対応したものであれば、数式表現も可能です。
例えば、GoogleColab では以下の方法で数式が書けます。
-インライン形式｜ ＄・・＄で囲む
２次方程式 $ ax^2+bx+c=0 \quad ( a \neq 0 ) $ の解は
２次方程式 &mathjax(ax^2+bx+c=0 \quad ( a \neq 0 ));の解は
-ブロック形式｜＄＄・・＄＄で囲む
$$ x = \frac{-b \pm \sqrt{b^2-4ac}}{2a} $$
#mathjax(x = \frac{-b \pm \sqrt{b^2-4ac}}{2a})
''参考''
-MathJax：https://www.mathjax.org/
LaTeX の数式をウェブブラウザ上で表示する JavaScript ライブラリ
-TexMe： https://github.com/susam/texme
Markdown と LaTeX のレンダリングに対応した JavaScript ライブラリ
~
~
**APPENDIX
***Markdown Viewer
.md ファイルの Drag&Dropで Markdownのプレビューが可能です。
-DEMO：https://koichi-inoue.github.io/MarkdownViewer/
-CODE：https://github.com/koichi-inoue/MarkdownViewer
~
***サンプルデータ
-View：https://github.com/koichi-inoue/MarkdownSample/blob/main/sample.md
-Files：https://github.com/koichi-inoue/MarkdownSample
~
***関連記事
-[[XMLHttpRequest]]
Markdownを JavaScript で読み込んで表示するサンプル
~
~
~
