記事の書き方チートシート

Fri, 18 Sep 2026 00:00:00 GMT

自分用のメモとして、このブログで使える記法をまとめておきます。

frontmatter

記事の先頭に次のメタデータを書きます。title と date は必須です。

---
title: "記事のタイトル"
date: 2026-09-18
updated: 2026-09-20 # 任意。更新日
description: "一覧や OGP に出る説明文" # 任意
tags: ["Markdown", "ブログ運用"] # 任意
externalUrl: "https://zenn.dev/..." # 任意。外部に投稿した記事へのリンクだけを載せる
draft: false # true にすると本番では公開されない
---

ファイル名がそのまま URL になります（markdown-cheatsheet.md → /posts/markdown-cheatsheet/）。

外部に投稿した記事を並べる

Zenn などに投稿した記事は、externalUrl を書いておくと一覧に混ぜられます。本文は不要です。

---
title: "Zenn に書いた記事のタイトル"
date: 2026-09-21
description: "一覧に出る説明文"
tags: ["Zenn"]
externalUrl: "https://zenn.dev/ykitaa/articles/xxxx"
draft: false
---

一覧のタイトルをクリックすると、そのまま外部サイトへ飛びます。

見出しと目次

## と ### の見出しは自動で目次に載ります。記事タイトルが # にあたるので、本文では ## から使いはじめます。

コードブロック

言語名を付けるとシンタックスハイライトされます。title="..." でファイル名、 {2-3} で行のハイライトができます。

```ts title="src/lib/sum.ts" {2-3}
export function sum(values: number[]) {
  // この 2 行がハイライトされる
  return values.reduce((total, value) => total + value, 0);
}
```

実際の表示はこうなります。

src/lib/sum.ts

export function sum(values: number[]) {
  // この 2 行がハイライトされる
  return values.reduce((total, value) => total + value, 0);
}

表・引用・リスト

記法	用途
`太字`	強調
`code`	インラインコード
`> 引用`	引用

引用はこう表示されます。

箇条書き
- ネストもできる
チェックリスト
完了したもの

画像

public/ に置いた画像は絶対パスで参照します。

![代替テキスト](/images/example.png)

リンク

外部リンクは自動で別タブ（target="_blank"）になります。内部リンクは /posts/markdown-cheatsheet のようにサイト内パスで書きます。

JWTとは何か — JWS/JWE の違いと、JWTベース認証で Next.js と Go API がやっていること（zenn.dev）

Mon, 07 Sep 2026 00:00:00 GMT

JWT とは何か、JWS と JWE は何が違うのか、Next.js と Go API はそれぞれ JWT に何をしているのかを整理。

Auth0 quickstartで学ぶ認可コードフローの中身（zenn.dev）

Fri, 14 Aug 2026 00:00:00 GMT

認証と認可の用語整理から、Auth0 のクイックスタートをなぞって認可コードフローの中身を追った記録。

ykitaa.dev