Zenn CLI使えばプレビュー見ながら記事を書ける

公開:2020/09/22
更新:2020/09/22
1 min読了の目安(約900字IDEAアイデア記事

Zenn では現在 Web 上では執筆画面とプレビュー画面を切り替えながら書いていく必要があります。そのあたりが不便という声を聞きましたが、Zenn は Zenn CLI があります。Zenn CLI は Node アプリケーションのため、どんな環境にもインストールできます。そのためローカル上で、好きなエディタを使って記事を書くことができます。

下記は VSCode で記事を書きながら、ブラウザ上の Zenn CLI のプレビューを見ているところです。

途中からホットリロードの機能も追加されたため、記事ファイルを保存すればすぐプレビューにも更新されます。

画像のアップロード

画像は専用のアップロードページを使う必要があります。

画像のアップロード

クリップボードからスクショを貼り付けたりができないためちょっと不便です。

ツイートなどの埋め込み

埋め込みタグを直接貼り付けても機能しません。専用のタグを使う必要があります。ちゃんとプレビューも表示されます。

Zenn の Markdown 記法

テキストの自動整形も

VSCode などで自動整形をオンにしていると、md ファイルを編集していると勝手に英単語の回りにスペースを入れてくれたりしてくれます。

まとめ

あとは Slug を指定できたりもしますし、このあたりのことは全て 公式の解説 があり、そちらに書かれています。

今のところは Zenn CLI で自分用の快適環境を作って書くと便利そうです。不便だなと思う箇所があればフィードバックしたり、並行して Zenn CLI も試してみると良さそうです。