【Pythonを使っているはてなブロガー必見！】統合開発環境Jupyter Labで記事を執筆する方法
Jupyter Lab。
コーディングとテキストの編集を同時にできる機能を備えた統合開発環境。
今回はPythonユーザであるはてなブロガーの方に向けて、Jupyter Labによる記事の編集方法についてご紹介します！
（※この記事の内容をご自身で試す場合は自己責任でお願いします）
Jupyter Labとは
Jupyterとは、オープンソフトウェアのウェブアプリケーションで、ノートブック形式で対話的なプログラムの実行やその実行結果を踏まえて、対話的にデータ解析を進めるためのツールです。
以前まではJupyter NotebookといってiPythonの拡張したアプリケーションでした。 それが、今年2018年になってJupyter Labのβ版がリリースされて、いよいよ高機能統合開発環境として洗練されたものがリリースされたというところです。
Jupyter Labとは何なのかといいますと、基本的にはJupyter Notebookの拡張です。
Jupyter Notebookでは
ファイルを開く際にはブラウザのタブで開く
複数のファイルの同時編集などがやりづらい
などの不便な点がありましたが、Jupyter Labでは
など、多くの点が改善されて、さらにそれが洗練されています。
そして、Jupyter Labでは（Jupyter Notebookでも）Markdownを編集できるというのが非常に良い点です！
詳しくは私の以前の記事
や公式ページ
他にも詳しく執筆されている方がいらっしゃいますのでそちらをご参考ください。
Markdownによるはてなブログの記法
さて、ここでは少し話が変わりまして、はてなブログの記法についてです。
はてなブログのブログの執筆の仕方としましては
の３つがあります。
見たまま記法は、名前の通りみたままのフォーマットで文書を編集できるモードで、改行や文字のスタイルなどをグラフィカルに編集できるのがメリットです。
ただ、ソースコードの挿入や数式の挿入という観点ではかなり使いにくく、それらを使っている専門家の方にはオススメできません。
その点、３つ目のmarkdown記法では、いわゆるmarkdownの記法とhtmlをかなり活用できるので、少しでも知識がある方はこちらがオススメです。
また、ソースコードの貼り付けや数式（これはやや特殊で普通のmarkdownとは異なる？でも基本はLatex）が容易にできるというのが一番の魅力です！
（はてな記法については触ったことがないのでコメント控えます）
つまり、Markdown記法を使えば、Markdownの汎用的な記法とLatexの数式を使って技術的なブログ記事を簡単に書くことができるよってことです。
Jupyter Labによるはてなブログの執筆法
さて、ここで私は気づいてしまいました...
MarkdownとPythonプログラムを同時に扱えるJupyter Lab(Notebook)とはてなブログのMarkdown記法を組み合わせれば、簡単にはてなブログ上で技術ブログを執筆できるのでは？
というわけで、ここではJupyter Labではてなブログの記事を編集し、アップロードするまでの流れをご紹介します！
Jupyter Labでのノートブック（.ipynb）の編集
Jupyter Labでのノートブックの編集はとても簡単です。
まずはターミナル上でjupyter labと叩いてJupyter Labを起動します。
そして、LauncherからNotebookを選択すればOKです。
そして、このセル（四角の部分）にPythonのソースコードもしくはMarkdown形式の文書を編集していきます。
Python/Markdownの選択は画面上部のトグルでもできますし、
Escapeキーを押してから
としても切り替えることができます。
そして、こんな風にPythonソースとMarkdownを対話的に書いていきます。
Jupyter LabからノートブックをMarkdown（.md）としてダウンロード
そして、ノートブックで記事に必要なMarkdownとコードを書き終われば、次に記事として、このノートブック（.ipynb）をダウンロードします。
それはJupyter Labタブの上部のファイルタブの"Export Notebook As..."から、Markdownを選択して行います（この他にも色んな形式があるのが、Jupyterのいいところですよね〜）。
すると、ダウンロードフォルダにzip圧縮されたファイルがダウンロードされます。 そこにはMarkdown(.md)ファイルの他、ノートブック内でplotした画像などが含まれています（この画像は後にはてなブログにアップロードすべき画像です）。
こんな感じの構成
（もし、ノートブックの中に画像がなければ、zipファイルでのダウンロードではなく、Markdown（.md）ファイルのみのダウンロードになります）
はてなブログへの貼付けと微修正
さて、ここまででほとんど執筆作業は完成です。残すは
はてなブログへのアップロード
スタイル・フォントなどの微修正
画像のアップロードと差し替え
ブログの詳細情報の指定（タイトルなど）
と微細な事項のみです！
まず、はてなブログへのアップロードですが、これは非常に簡単です。 はてなブログの”記事を書く”を開いて、Markdownモードを選択。 出てきた編集画面に先ほどダウンロードしたMarkdown(.md)ファイルの内容をコピペするだけ。
これで記事の雛形は完成です。次にプレビューを確認して校正です。 ここでは基本的に文字フォントが正しいか、フォントサイズが正しいかなど見た目を確認します。
そして、画像のアップロードと差し替えです。 はてなブログで画像を挿入する場合は画像をアップロードしないといけません。 アップロードすべき最低限の画像は先ほどダウンロードしたzipファイルに含まれているので、それをアップロードします。
また、それを差し込む場所はMarkdown形式で書かれているので、そこを書き換えるだけです。 書き換え場所は
となっている場所です。ここにアップロードした画像を差し込めばOKです。
さて、最後の作業です！最後の作業は詳細な記事の情報の編集です！具体的には
タイトル
カテゴリ
記事の概要
高度なタイトルの設定
などですかね！ここまで書けば、どの辺りをいじればいいのか分かってもらえると思います！
以上、お疲れ様でした！
ここまでで記事は完成です。あとは記事を公開するだけです！
まとめ
今回の記事では
を組み合わせてはてなブログ上で技術文書を編集する方法をご紹介しました！
この記事でPythonを使っておられるはてなブロガーの方の記事の執筆が捗れば嬉しいです！（特にソースコードと実行結果の添付など！）
また、はてなブログにはAPI （はてなブログAtomPub - Hatena Developer Center） が提供されていますので、今後、Jupyter LabとAPIを組み合わせたはてなブログの編集（はてなブログの記事の編集画面から完全独立）を目指そうと思います！
間違いのご指摘やご意見、またご質問などございましたら、お気軽にコメントお願いします！
