scaffdog:Markdownでテンプレートを書いて、脚手架をエレガントに
今日紹介するのは、目を引く脚手架ツール —— scaffdog です。
761⭐ の小規模プロジェクトですが、実際の痛点を解決しています:コード生成をどうすればエレガントでメンテナンスしやすく、新しいテンプレート構文を学ばなくて済むのか。
scaffdog とは?
scaffdog は Markdown 駆動の脚手架ツール です。
核心となる考え方はシンプル:Markdown ファイルでテンプレートを定義し、CLI コマンドでコードを生成する。複雑なテンプレートエンジンも、難解な構文もなく、慣れ親しんだ Markdown だけです。
GitHub: https://github.com/scaffdog/scaffdog
なぜ選ぶのか?
1. Markdown ネイティブサポート
テンプレートファイルは Markdown なので:
- シンタックスハイライトがそのまま使える
- GitHub 上で直接読める
- ドキュメント書きとテンプレート書きが同じ作業
2. 変数システムがシンプルで直感的
---
name: Component
root: './src/components'
---
# {{ inputs.name }}
{{ inputs.name }} コンポーネントを生成...
YAML frontmatter でメタデータを定義、{{ inputs.xxx }} で変数を展開。これだけです。
3. ファイル生成構文がエレガント
1つの Markdown ファイルから複数のファイルを生成できます:
# `{{ inputs.name }}.tsx`
```tsx
import React from 'react';
export const {{ inputs.name }}: React.FC = () => {
return <div>{{ inputs.name }} Component</div>;
};
{{ inputs.name }}.test.tsx
import { {{ inputs.name }} } from './{{ inputs.name }}';
describe('{{ inputs.name }}', () => {
it('should render', () => {
// test code
});
});
バッククォートで囲んだ見出しがファイル名、コードブロックに内容を書くと、scaffdog が自動的に解析して対応するファイルを生成します。
## クイックスタート
```bash
# インストール
npm install -g scaffdog
# 設定を初期化
npx scaffdog init
# テンプレートを作成
npx scaffdog create component
# テンプレートを使ってコード生成
npx scaffdog generate component
ユースケース
- コンポーネントライブラリ開発:コンポーネント、スタイル、テストファイルの3点セットを素早く生成
- マイクロサービス脚手架:サービスディレクトリ構造と基本設定を統一
- プロジェクト初期化:チーム標準化の新規プロジェクトテンプレート
- コード規約の定着:ベストプラクティスを再利用可能なテンプレートとして固化
従来の方案との比較
| ツール | テンプレート構文 | 学習コスト | 可読性 |
|---|---|---|---|
| Yeoman | EJS/Handlebars | 中 | 普通 |
| Plop | Handlebars | 中 | 普通 |
| Hygen | EJS | 中 | 普通 |
| scaffdog | Markdown | 極めて低い | 抜群 |
まとめ
scaffdog は世界を変えるツールではありませんが、「コード生成」を十分にシンプルでエレガントに仕上げています。
EJS テンプレートで <%= %> を書くのに疲れた、またはチームメンバーが脚手架の設定ロジックをいつも混乱させているなら、Markdown でテンプレートを定義する方法を試してみてください。
時々、最良のツールは「ツールの使い方を考えさせない」ツールです。