🎁

Zenn CLIで初めて記事を書いてみた(2023年5月版)

2023/05/04に公開

はじめに

Zennをはじめようとなりました。Zenn CLIが便利らしいとのことで、こちらを利用した記録となります。GitHub連携が必須の設定となりますが、こちらのほうが管理しやすいと判断しました。

そこで、つまずきどころと感想をまとめてみました。

環境想定

  • Mac(M1)
  • CLI(ターミナル操作前提)
    • この記事もvimで執筆

参考記事

ここを読めばやりたいことはほぼできます。

やってみたこと

Zenn CLIインストールとコマンド操作

Zenn CLIをインストールする

まず公式に沿ってインストールしましたが、とくに問題なかったです。

❯ npx zenn init

  🎉  Done!
  早速コンテンツを作成しましょう

  👇  新しい記事を作成する
  $ zenn new:article

  👇  新しい本を作成する
  $ zenn new:book

  👇  投稿をプレビューする
  $ zenn preview

Zenn CLIで記事・本を管理する方法

記事の作成は、URL生成名に関係するのでslug(スラッグ)を意識するとよさそうです。

❯ npx zenn new:article --slug zenn_cli_test_20230504
created: articles/zenn_cli_test_20230504.md

たとえばこの記事は上記のコマンドでslugを指定して生成しました。注意点は名前がかぶってはダメです。

生成された記事の扱い方

サンプルの記事の中身より、いくつか設定箇所があります。

はじめて書くときは、こちらのZennの公式のページ(今回は一例)を見るとよいとマニュアルでも補足がありました。

あとは、公開設定のON/OFFとなる、[published]の設定をすればOK。公開タイミングも調整できるようです。

編集時のプレビュー機能

❯ npx zenn preview
👀 Preview: http://localhost:8000

ブラウザでアクセスすると、以下のような表示となります。

なお、この画像は、GUIでのアップロードを試したところお手軽ですが管理しづらいと判断。リポジトリ内管理を採用しました。

おわりに

あとはここまでの記事を書いてまとめてテストアップロードとしてみて終わりです。

簡単でお手軽ですね!むしろ、GitHubのToken設定の新しい機能(Fine-grained personal access tokens (beta))を試したときにはまったぐらいです。よって、ハマるポイントはほぼないぐらいにマニュアルが整備されていてすごいなという感想でした。次は、Bookにチャレンジしたいと思います。

GitHubで編集を提案

Discussion