#author("2022-04-22T18:54:39+09:00","default:inoue.ko","inoue.ko") #author("2026-03-28T18:35:47+09:00;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 で読み込んで表示するサンプル -[[Mermaid]] 記法 コードから各種の図を作成するための記法（Markdownに埋め込み可） ~ ~ ~ ~