Zenn の記事を書くときのスラグ生成を楽にする [VSCode + Foam 拡張]
表題のとおりです。
皆さま、Zenn で記事を書くときに Github 連携を使っておられるでしょうか？
Zenn CLI も使っておられますか？
そのプロジェクトのツリー構造はこんな感じのはずです。
root
- articles
- books
で、 npx zenn new:article とすると新しく記事が作られるはずですが、デフォルトだとハッシュ値が入るはずです。
root
- articles
+ - 30433a77da3cca.md
- books
実はこれ、 Zenn に公開されるときの URL スラグ に使われます。
例: https://zenn.dev/submax/articles/30433a77da3cca
何が問題か
まあ記事のURLがちょっと不格好になるのもダサいですが、何よりファイルシステムから管理するはずなので、その場合にめちゃめちゃ視認性が悪いです。
めちゃめちゃ見づらい！
(整理しようと頑張ってる跡が見えるけど)
Zenn CLI だけでなんとかできるのか？ => できるがメンドい
zenn new:article のヘルプを見てみましょう
npx zenn new:article --help
# Usage:
# npx zenn new:article [options]
#
# Options:
# ...省略
#
# Example:
# npx zenn new:article --slug enjoy-zenn-with-client --title タイトル --type idea --emoji ✨
Example のコマンドを見るにオプションできるのはわかるが... 毎回このコマンド打ちますか？
Git リポジトリだから、記事同じ場所に JavaScript とか Shell Script とか書いてなんとかするぜ！って人もいるだろうけど、それはそれでめんどい。
VSCode: Foam 拡張機能を記事テンプレートとして使う
Form for VSCode を使いましょう。
Marketplace ページを見ると分かりますが、 Obsidian とかそれ系のナレッジ管理ツールです。
書いたノートをタグを関連付けて、グラフで知識の関連を表示できる機能とかついてるあれです。
実はノートのテンプレート機能があって、それを使うと VSCode ツールパレットやショートカットから呼び出して、ファイルツリー上の 任意の場所 に 任意のファイル名で、 任意の中身 を生成できます。
やってみましょう。
テンプレートを作る
コマンドパレットを開き、以下を実行します。
Cmd + Shift + P => Foam: Create New Template
そしたら、 .foam/templates ディレクトリ以下に Markdown テンプレートファイル が作られるので、以下のような Front Matter を書きます。
---
title: "$FOAM_TITLE"
emoji: "🦔"
type: "tech" # tech: 技術記事 / idea: アイデア
topics: []
published: false
foam_template:
filepath: "articles/$FOAM_DATE_YEAR-$FOAM_DATE_MONTH-$FOAM_DATE_DATE-$FOAM_TITLE.md"
---
Discussion