⛳
VS codeを用いたZennの投稿に関する超個人的メモ
はじめに
Zenn CLIでPreviewを開いた所に書いてある内容を、個人的な使用頻度と、使用シーンに合わせてまとめたドキュメントになります。(2023年8月 時点)
基本情報は下記を参照ください。
事前準備
まずは、githubとの連携、Zenn CLIの導入が完了した後、下記ZennのVS code用拡張機能をインストールします。
記事を書き始める
- コマンドによる記事の作成
npx zenn new:article
- Zenn editor plug in を用いたUIによる記事の作成

記事作成時のslug関連注意事項
gitを利用して投稿を管理しており、記事の場合はslug=".mdのファイル名"となります。逆に言えば、.mdのファイル名を変更すると、slugを変更できます。.mdのファイル名が意味を持たない文字列となることは目視による検索性が下がるため、可読性の高いものにしたいと考えますが、下記制約[1]があるため注意が必要です。
個人的には、Slugを自動生成で新規記事作成後、そのslugを用いて、 "title-of-article_slug.md"のような形式でファイルを保存することにしました。
なお、上記3つ目の制約事項により、一度投稿した記事のslugを変更した場合、元slugの記事が残ったまま、変更後のslug記事が投稿されることになります。 元slugの記事の削除はzennのダッシュボードから行う必要があります。
コードブロック
- インラインコードブロックの書き方
```inline code block```
上記の表示結果: inline code block
- コードブロックの書き方
```alias: filename
code block
```
上記の表示結果:
filename
code block
- シンタックスハイライト
Prism.js が使用されています。
📄 対応言語の一覧
個人的に使いそうなシンタックスハイライト一覧
| languages | alias |
|---|---|
| PowerShell | powershell |
| Dart | dart |
| Docker | docker, dockerfile |
| Git | git |
| .ignore | ignore, gitignore, hgignore, npmignore |
| JSON | json, webmanifest |
| Log file | log |
| Makefile | makefile |
| Markdown | markdown, md |
| Mermaid | mermaid |
| PlantUML | plant-uml, plantuml |
| PowerShell | powershell |
| Processing | processing |
| .properties | properties |
| Python | python, py |
| SQL | sql |
| TOML | toml |
| URI | uri, url |
| YAML | yaml, yml |
Topics
topicsタグを何と書けばいいのか迷ったときに見るところ
個人的に使いそうなTopics タグ
| Topics | alias |
|---|---|
| Python | python |
| Flutter | flutter |
| Docker | docker |
| GitHub | github |
| Git | git |
| VS Code | vscode |
| Dart | dart |
| Firebase | firebase |
| Windows | windows |
| SQL | sql |
| 個人開発 | 個人開発 |
Discussion