コード生成 & テンプレート

目次

• 概要
• 使用場面
• クイックスタート
• リファレンスガイド
• ベストプラクティス

概要

テンプレートエンジン、AST操作、コード生成、自動ボイラープレート生成を含むコード生成技法の包括的なガイドです。生産性と一貫性を向上させることができます。

使用場面

• 新しいプロジェクトやコンポーネントの生成
• 繰り返しのあるボイラープレートコードの生成
• CRUD操作の自動生成
• OpenAPI仕様からのAPIクライアント生成
• テンプレートからのコード作成
• スキーマからのデータベースモデル生成
• JSON SchemaからのTypeScriptの型生成
• カスタムCLIジェネレータの構築

クイックスタート

最小限の動作例：

// templates/component.hbs
import React from 'react';

export interface {{pascalCase name}}Props {
  {{#each props}}
  {{this.name}}{{#if this.optional}}?{{/if}}: {{this.type}};
  {{/each}}
}

export const {{pascalCase name}}: React.FC<{{pascalCase name}}Props> = ({
  {{#each props}}{{this.name}},{{/each}}
}) => {
  return (
    <div className="{{kebabCase name}}">
      {/* Component implementation */}
    </div>
  );
};

リファレンスガイド

references/ ディレクトリの詳細な実装：

ガイド	内容
Template Engines	テンプレートエンジン
AST-Based Code Generation	AST ベースのコード生成
Project Scaffolding	プロジェクト生成
OpenAPI Client Generation	OpenAPI クライアント生成
Database Model Generation	データベースモデル生成
GraphQL Code Generation	GraphQL コード生成
Plop.js Generator	Plop.js ジェネレータ

ベストプラクティス

✅ すべき こと

• 繰り返しのあるコードパターンにはテンプレートを使用する
• スキーマから TypeScript の型を生成する
• 生成されたコードにテストを含める
• テンプレートではプロジェクトの規約に従う
• 生成されたコードに説明用のコメントを追加する
• テンプレートをバージョン管理する
• テンプレートは設定可能にする
• コードと一緒にドキュメントを生成する
• 生成前に入力値を検証する
• 一貫した命名規則を使用する
• テンプレートはシンプルで保守しやすく保つ
• 簡単に生成できるよう CLI を提供する

❌ してはいけない こと

• コード生成が多すぎる（不要な複雑さを避ける）
• 保守しにくいコードを生成する
• 生成されたコードの検証を忘れる
• テンプレートに値をハードコードする
• ドキュメントなしでコードを生成する
• 一度だけ使うジェネレータを作成する
• ビジネスロジックをテンプレートに混ぜる
• フォーマットなしでコードを生成する
• ジェネレータでエラーハンドリングをスキップする
• 複雑すぎるテンプレートを作成する