Writing Guide

TRAGEND BLOG 執筆ガイド

記事は Markdownで書いて、Pull Request(PR)を出すだけ。レビュー担当がOKを出してマージすると、公開・HPへの反映まで自動で進みます。書いている途中の記事は 本番には絶対に出ません。

全体の流れ WHO DOES WHAT

担当
1. 書く
2. 出す
3. 確認する
4. レビュー
5. 公開
WRITER執筆者
(社員・業務委託)
1記事を書く
posts/YYYYMM/記事名.md に draft: true のまま書く。テンプレは posts/_template.md
2PRを出す
ブランチに push して Pull Request を作成。途中でも出してOK
3プレビューで読む
PRにNetlifyがコメントするURLをブラウザで開いて自分で確認。直したら push すると更新される
指摘があれば直して push。レビュー担当にPRのURLを伝える
執筆者は draft を触らない
REVIEWERレビュー担当
(会社側)
プレビューURLで記事を読む。一覧には DRAFT バッジ付きで出る
4PRでコメント
直してほしい点はPRのコメントで。OKなら次へ
5draft: false にしてマージ
これが「公開ボタン」。main にマージした瞬間に公開が始まる
AUTO自動
(Netlify)
PRを検知してプレビュー用にビルド。frontmatterの誤りがあればここで赤くなる
プレビューURLをPRにコメント。下書きも見える
1〜2分で blog.tragend.com/YYYYMM/記事名/ が公開。feed.json と tragend.com のブログカードも自動更新
安全装置:draft: true の記事は、push してもマージしても本番には出ません。draft を書き忘れた場合も非公開扱いです。公開されるのは、レビュー担当が明示的に false にした記事だけです。

書き方は2通り PICK ONE

Aブラウザだけで書く

git やターミナルに慣れていない人向け。必要なのは GitHub アカウントだけ。
  1. GitHub で Tragend/blog を開き、posts/_template.md の中身をコピー
  2. posts/ で Add file → Create new file。ファイル名を 202610/my-article.md のように入力(年月フォルダ/半角英数字とハイフン)
  3. コピーした内容を貼り、frontmatter と本文を書く
  4. Commit changes で「Create a new branch … and start a pull request」を選んで保存
  5. Pull Request を作成。数分後にプレビューURLがコメントされる
  6. 直したいときは PR のファイルをそのまま編集して保存

画像は posts/YYYYMM/img/ に Add file → Upload files で上げて、本文に ![説明](img/ファイル名.png) と書く。

Bローカルで書く

エディタで書きたい人・スクショを多く貼る人向け。git / Node.js / VS Code か Cursor が必要。
  1. 初回のみ git clone → npm install
  2. git switch -c post/my-article で記事ごとにブランチを切る
  3. posts/_template.md を posts/202610/my-article.md にコピーして書く
  4. npm run dev → http://localhost:4399 で確認(下書きも見える)
  5. VS Code / Cursor ならスクショを Cmd+V するだけで画像が保存・挿入される
  6. git push -u origin post/my-article → PRを作成

Claude Code や Orca を使う場合も同じ。リポジトリ内で「テンプレから記事を作って」と頼めば、置き場所と frontmatter は自動で揃う。

frontmatter 記事の先頭に書く設定

---
title: "記事タイトル"
description: "一覧・HPカード・OGPに出る1文"
date: 2026-10-01
author: tragend
tags: ["claude-code", "ai"]
# thumbnail: /img/202610/my-article.png
draft: true
---

ここから下は普通の Markdown。
見出し・表・コードブロック・画像すべて使える。
項目説明
title必須記事タイトル
description推奨一覧・HPカード・OGPに出る1文
date必須公開日 YYYY-MM-DD。一覧はこの順
author推奨src/lib/authors.ts にある自分の key。無ければ tragend
tags任意src/lib/tags.ts にある key だけ。辞書に無い値はビルドが止まる。一覧は /tags/
thumbnail任意1200×630 の画像を public/img/YYYYMM/ に置き /img/YYYYMM/… で指定
draft必須true の間は非公開。false にするのはレビュー担当

新しいタグを使いたい・自分の名前で署名したいときは、src/lib/tags.ts / src/lib/authors.ts に1行足す(同じPRに含めてOK)。

ルール RULES

  • 記事は必ず PR経由。main に直接 push しない
  • 公開判断はレビュー担当が行う。書いた本人は draft: false にしない
  • ファイル名・画像名は 半角英数字とハイフンのみ(日本語名はURLが崩れる)
  • 公開後にファイル名・フォルダ名を変えない(URLが変わる)
  • APIキーやパスワードなどの秘密情報を記事・スクショに含めない

困ったら TROUBLESHOOTING

PRのチェックが赤い
frontmatter の誤り。--- の閉じ忘れ、tags が辞書に無い、date の形式を確認
プレビューに記事が出ない
ファイルが posts/YYYYMM/ 直下にあるか。_ で始まる名前は記事扱いされない
マージしたのに本番に出ない
draft: false になっているか。Netlify の Deploys 画面でビルド結果を確認
サムネが出ない
画像が public/img/… にあり、パスが /img/… 始まりか確認

用語 GLOSSARY

Pull Request(PR)
「この変更を取り込んでください」という申請。記事1本につき1つ作る。コメントでやり取りできる
ブランチ
本番(main)から分かれた作業用のコピー。ここで書けば本番に影響しない
マージ
PRの内容を main に取り込むこと。ブログでは「公開」と同じ意味
プレビューURL
PRごとにNetlifyが作る確認用サイト。下書きも表示される。PRのコメント欄に貼られる
frontmatter
記事ファイル先頭の --- で挟まれた設定部分
draft
下書きフラグ。true=非公開、false=公開