VS codeを用いたZennの投稿に関する超個人的メモ

2023/08/20に公開

はじめに

Zenn CLIでPreviewを開いた所に書いてある内容を、個人的な使用頻度と、使用シーンに合わせてまとめたドキュメントになります。(2023年8月 時点)

基本情報は下記を参照ください。
https://zenn.dev/zenn/articles/install-zenn-cli
https://zenn.dev/zenn/articles/zenn-cli-guide

事前準備

まずは、githubとの連携、Zenn CLIの導入が完了した後、下記ZennのVS code用拡張機能をインストールします。
https://marketplace.visualstudio.com/items?itemName=negokaz.zenn-editor

記事を書き始める

  • コマンドによる記事の作成
npx zenn new:article
  • Zenn editor plug in を用いたUIによる記事の作成

image

記事作成時の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
個人的に使いそうなシンタックスハイライト一覧
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タグを何と書けばいいのか迷ったときに見るところ
https://zenn.dev/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
個人開発 個人開発

脚注
  1. https://zenn.dev/zenn/articles/what-is-slug#slug指定時の注意点 ↩︎

Discussion