望むこと
- 重くない
(サクサク動かないとストレスが溜まる) - プレーンテキストファイルで管理
(汎用性を重視。アプリ内のデータベースに格納とは避ける) - OSのファイル管理システムで直感的に管理できる
(フォルダで階層管理、ファイル名は日本語) - クラウドで複数デバイス(PC、iOSアプリ)からアクセス
(PCで書いた記事をスマホで閲覧・編集できると便利) - バックアップ
(やってしまった時の救世主) - サブスクリプションのサービスは避けたい
(毎月請求が来たり、支払いを忘れるとアクセスできなくなるのは嫌) - フォルダ、タグ、テキスト検索機能
(探したいファイルをパッと探せないと意味がない) - 使い慣れたエディタで編集
(手に馴染んだツールがやっぱりいい。特にエディタはそう) - 入力補助、シンタックスハイライト
(無駄な肩こりや眼精疲労は減らそう) - HTMLプレビュー
(執筆途中は要らないけど、最終確認にやっぱり必要) - HTML や Word 文書に変換
(人とのやり取りに必須) - 目次の自動生成
(冒頭で全体像をつかめる目次は必要)
Markdown を快適に扱える環境を構築
エディタ
使い慣れたエディタ(自分は Sublime Text 3) と iA Writer を使い分ける。
Sublime Text 3 は、テキスト編集機能に優れ、拡張機能でMarkdown の入力をより快適にできる(後述)。
後者は整理用途に使う。フォルダやタグ(メタタグを利用)で分類できる機能があり、テキスト検索もできる。
Mac版・iOS版アプリがあり、iCloud Drive で同期できる。
クラウド、ファイル管理
クラウドストレージに文書用フォルダを作り、そこにまとめて保存。
自分は、iA Writer が iCloud Drive に生成したフォルダに保存するようにした。Dropbox や Adobe Creative Cloud などでも良い。
iA Writer は、Finder のフォルダ階層をそのままリスト表示し、ファイル名 = 記事タイトル(日本語もそのまま) で保存する。アプリ上で記事の名前を変更したら、ちゃんとファイル名が変わる。アプリ上で整理しておけば、OSのフォルダも同時に整理されている状態となる。
【Tips】iA Writer のハッシュタグ機能を使うための記述
文中に #キーワード を置けば、サイドバーにそのハッシュタグが表示され、そのタグが付いた記事を絞り込める。HTML変換時に表示されないよう、コメントアウトしておくと良い
<!--
#投稿済 #投稿更新
#sublimetext #環境構築 #markdown
-->
iA Writer で WordPress や Medium に投稿
iA Writer は、メニューから WordPress や Medium に投稿できる(※1)。
その際、ファイル名が記事の見出しとなる仕様のため、Markdown 上に大見出しがあると、記事タイトルが重複してしまう。
それを避けるため、投稿を前提とした記事は本文中の見出しをコメントアウトしておくと良い。
※1：一方的に投稿するだけの機能。iA Writer 上で修正して再投稿すれば、すでに投稿済みの記事が更新されるのではなく、新しい記事として追加される。投稿後の修正が多いなら、Hugo などの静的HTMLジェネレーターを使う方がスマートだろう。
バックアップ
iCloud Drive が自動で差分バックアップを取ってくれる(※30日のみらしい)ので、iA Writer のメニュー "ファイル > バージョンを戻す" から復元できる。
別に TimeMachine で外部ディスクにバックアップを習慣的に取ることで、２重のバックアップが苦なく取れる
入力補助、シンタックスハイライト
Sublime Text のパッケージ MarkdownEditing を使う。
リスト中の改行で自動リストマーカー付与などの基本的な入力補助に加え、以下のような MarkdownEditing ならではの便利機能がある
- リスト中で tab でインデントレベルを上げると、マーカーを自動変更してくれる ( - → + → = )
-
[キーでイメージ画像選択候補ドロップダウン - shift + tab で、カーソルを置いたセクションを折りたたむ
- command + r (Sublime Text 標準コマンドのシンボルに移動) で見出し一覧を表示、選択するとその見出しの場所に移動
- コードブロックで言語を指定すると、その言語のシンタックスカラー付けや入力補助が効く
特に最後のはコードを書く人には超強力。
"SublimeCodeIntel" や "All Autocomplete" などの定番パッケージも効くので、Markdown 文書の中であらゆる言語をサクサク入力できる。
MarkdownEditing - Sublime Text package Control
ブラウザプレビュー、HTML変換
Sublime Text のパッケージ MarkdownPreview で、ブラウザプレビューや、HTML変換ができる。
MarkdownPreview - Sublime Text package Control
目次作成
Sublime Text のパッケージ MarkdownTOC で自動目次生成ができる。見出しを変更すると、自動で目次も変更してくれる。iA Writer にも独自タグによる目次挿入機能があるが、オプションで柔軟にスタイリングできるこっちの方が便利
文書冒頭に <!-- MarkdownTOC autolink="true" autoanchor="true" uri_encoding="false" bullets="-,+,*" levels="2,3" -->空行入れる<!-- /MarkdownTOC --> と入れておけば、見出しを元に目次を生成してくれる(シンタックスは Markdown を選ぶ)。
補足：Markdown GFM の場合、<!-- MarkdownTOC autolink="true" autoanchor="true" link_prefix="user-content-" bullets="-,+,*" levels="2,3" markdown_preview="github" -->空行入れる<!-- /MarkdownTOC --> とプリフィックスを付けるようにしないと日本語見出しでうまく機能しない。この場合は日本語がエンコードされ、ぐちゃっとしたリンクURLとなる
MarkdownTOC - Sublime Text package Control
Sublime Text 3 と iA Writer を行き来やすいように設定
Automator でクイックアクションを登録し、ショートカットキーを割り当てる (Mac 環境設定 > キーボード > ショートカットキー)。Touch Bar のボタンへの割り当ても可。
Firefox Markdown で便利なアドオン
Copy Selection as Markdown
- ショートカットキー "command + shift + e" で現在開いているページのページタイトルとURLを Markdown のリンクテキストとしてコピー
- ブラウザで範囲選択し右クリック、"Copy Selection as Markdown" で、Markdown 形式(見出し、太字、リンク、画像など対応)に変換してクリップボードにコピー
Copy Selection as Markdown - Firefox AddOn
Markdown Viewer Webext
Firefox で Mardown 文書を開くと、HTML化して表示。見出しも生成してくれる。
Markdown Viewer Webext - Firefox AddOn
Word 文書に変換
iA Writer で変換
ファイル > 書き出し で、Word 文書を選ぶ
Pandoc で変換
ドキュメント変換ツール Pandoc で、Markdown 文書を Word 文書に変換できる。
Mac なら、Homebrew でインストールするのが無難で簡単。
コマンド例：pandoc .\sample-input.md -t docx -o sample-output.docx
今後の課題
- 画像の扱い
- Sublime Text でのライブプレビュー
- Web への投稿 (静的サイトジェネレーター)