##
この記事の目的
Jupyter Notebookでは、プログラムを実行するための用途だけに限らず、Markdown機能を使用して、数式を記載したり、表や見出しの挿入、文字装飾、画像貼り付けなどを行い、プレゼン資料として作成することができます。
さらに、このように作成した資料をGitHubに移植することで、インターネット上で公開することもできます。
ここでは、Jupyter NotebookでのMarkdownを使用したドキュメント作りから、GitHubでの公開までの手順を説明します。
今回は事例として簡単なプレゼン資料を実際に作成しながら、その手順をご紹介します。
## Jupyter NotebookでMarkdownドキュメントを作成する
1. Markdownとは
一般的にJupyter Notebookでは、cell(セル)と呼ばれる段落枠の中にプログラミングを行い、それを実行して結果を表示するという使い方をします。
下図のように、セルの機能を標準の「Code」から「Markdown」に変えることで、Markdownドキュメントとして使用することができます。
Markdown機能を使用すると、文章に様々な装飾を施すことができます。
2. Markdownの使い方
セルの機能をMarkdownに設定したら、セルの中に文章を書きます。
例えば以下のような簡単な文章を記載した場合、
文章が完成したら、上図赤枠の矢印ボタンを押下することで、以下のようにMarkdownドキュメントに変わります。
文章やMarkdownの装飾を修正する場合は、このドキュメントをダブルクリックすると、先ほどの編集セルに戻ります。
3. 見出し
見出しの装飾について確認します。
見出しは**#記号**で記載します。
下図は、見出し1から見出し5まで記載した例です。
実行結果は以下の通りです。
4. 文字装飾
太文字、斜体、打消し線の装飾ができます。
| 装飾 | 書き方 |
|---|---|
| 太文字 | **(アスタリスク2つ) |
| 斜体(イタリック) | *(アスタリスク1つ) |
| 打消し線 | ~~(チルダ2つ) |
以下、実行例です。
5. 箇条書き
箇条書きの行頭文字はハイフンを使用します。
また、TABまたはスペース4文字で段落を落とすことで子段落、孫段落を入れ子にすることができます。
ハイフンの後にスペース1文字を入れることを忘れないでください。
また、行頭文字の種類は自動的に割り振られます。
以下の文章を記載しました。
以下、Markdownドキュメントの実行例です。
6. 番号付きリスト
箇条書きの行頭文字を連番数字にしたい場合、以下のような番号付きリストを使用することができます。
行頭文字の文字種類は自動的に割り振られます。
行頭文字の後にスペース1文字を入れることを忘れないでください。
元の文章につける行頭文字は同じ数字を付けると自動的に連番に変わります。
以下、実行例です。
また、任意の番号から(途中の番号から)開始する場合は、その番号を行頭文字に付けることで表示することができます。
元の文章
以下、実行例です。
7. 表
表を記載することができます。
表の作成方法は、以下の文章を参考にしてください。
項目1は左揃え、項目2は中央揃え、項目3は右揃えを設定しています。
元の文章
以下、実行例です。
8. 数式
数式は以下の記号で記載することができます。
数式の記載方法はTeXに準じます。
| 記号 | 使い方 |
|---|---|
| $ | 前後を$文字で囲む。インラインで数式を使用する場合。 |
| $$ | 開始行と終了行を$$文字で囲む。新たに段落を作成して数式を記載する場合。 |
元の文章
以下、実行例です。
9. 画像
画像挿入するには、以下のように記載します。
画像パスとは、Jupyter Notebookのドキュメント(Jupyter Notebook形式ファイル：.ipynb)が存在するディレクトリからの画像のパスを記載します。
例えば、元の文章が以下の場合、
現在編集中のドキュメントと同階層に画像ファイル「sin_pic_sample.JPG」を配置しておく必要があります。
下図は、画像ファイル「sin_pic_sample.JPG」(赤枠)を配置した例です。
Markdownを実行すると画像が表示されます。
画像が存在しない場合や表示に不具合がある場合、代替文字が表示されます。
10. 改行
Markdownで表示された文章内で改行を設定するには、半角スペース2文字を挿入します。
半角スペースは見えないため分かりにくいため、Markdown表示で確認してください。
以下は赤枠部分に半角スペース2文字を挿入した例です。
Markdownを実行すると以下のように改行されて表示されます。
半角スペースがない場合は、以下のように改行されません。
11. 引用
引用は**>**記号を使用します。
元の文章
以下、実行例です。
12. リンク
文字列にリンクを設定する場合は以下のように記載します。
[表示文字列](リンクURL)
以下、実行例です。
13. 水平線
水平線はアンダースコア、アスタリスク、ハイフンなどを3文字以上記述することで表示します。
以下、実行例です。
## GitHub上でドキュメントを公開する
作成したJupyter NotebookドキュメントをGitHubに移植して公開する手順を確認します。
1. GitHub上に公開(public)リポジトリを作成する
GitHub上でドキュメントを公開する場合は、公開(public)リポジトリを作成する必要があります。すでに存在する場合は作成不要ですが、もし無い場合は以下の手順で作成してください。
####(1)新規にリポジトリを作成する
GitHubのサイトにログインし、右上のメニューから「New repository」を選択します。
####(2)リポジトリの設定をする
作成画面でリポジトリ名と公開(public)の設定を行います。
下図のように、赤枠1にリポジトリ名を入力し、赤枠2で「Public」を選択します。
その後、最下部の「Create repository」ボタンを押下します。
今回はリポジトリ名を"pubdocs"としました。
2. Jupyter NotebookドキュメントファイルをGitHubへ格納する
リポジトリの作成が終わったら、Jupyter Notebookで作成したドキュメント(Jupyter Notebook形式ファイル：.ipynb)を公開リポジトリへ格納します。
もしJupyter Notebookドキュメントで画像ファイルも引用していた場合は、画像ファイルも一緒に格納します。
格納する方法は、リポジトリへファイルを追加後にcommit、pushしても良いですし、GitHub画面上でUpload機能を使用してファイルをUploadしても良いです。
下図はリポジトリへファイルを格納した際の例です。ipynbファイルと画像ファイル(JPG)を格納してあります。
3. ドキュメントを公開する
ドキュメントを公開リポジトリへ格納した時点で、インターネット上に公開されます。
公開されたページのURLを取得する際には、GitHubの当該ページを表示させ、ブラウザのアドレスバーからURLをコピーすれば取得できます。
今回作成したドキュメントは実際に公開しています。
こちらからご参照頂けたら幸いです。
■三角関数(sin)のグラフ
https://github.com/TetsuroTabataOuterproject/pubdocs/blob/main/MarkdownPresen.ipynb
## 関連情報
三角関数(sin)のグラフ
https://github.com/TetsuroTabataOuterproject/pubdocs/blob/main/MarkdownPresen.ipynb
## ご意見など
ご意見、間違い訂正などございましたらお寄せ下さい。