ドキュメント

v2 アーキテクチャ概要

AK2Engine v2 のコア層・レシピ層分離アーキテクチャについて

← 目次に戻る


v2 で変わったこと

v2 ではエンジンをコア層レシピ層に分離しました。

コア層(エンジン本体) はビルドパイプラインとセクション描画の仕組みだけを提供します。具体的なデザイン(テンプレート・CSS・エフェクト)はプロジェクト側で自由に作成・改変できます。

レシピ層(プロジェクト側) はセクションテンプレートとエフェクトで構成されます。AI が自由に .njk + .css を書いて新しいセクションデザインを追加できます。エンジンの更新は不要です。


プロジェクト構成

my-site/
  src/
    _sections/          セクションテンプレート(.njk + .css)
    _effects/           エフェクト(.js)
    _includes/
      layouts/
        base.njk
    _data/
    index.md
    about/
      index.md
    blog/
  package.json

フロントマターの書き方

---
layout: layouts/base.njk
# ページ全体のエフェクト(任意)
effects:
  - BgEffectSnow
# セクション構成
sections:
  - template: hero-basic
    subtitle: "WELCOME"
    title: "サイトタイトル"
    lead: "リード文"
    effects:
      - name: BgEffectFirefly
        count: 30
  - template: content
  - template: card-grid-basic
    heading: "FEATURES"
    subheading: "特徴"
    items:
      - title: "カード1"
        desc: "説明文"
        href: "/feature1/"
---

template: はプロジェクトの _sections/ からテンプレートを読み込みます。テンプレート内では section.* でフロントマターの値にアクセスします。

template: content は特別で、Markdown 本文を挿入します。


コア層の責務

機能 内容
セクション描画 template 名から _sections/{name}.njk を呼ぶ
エフェクト初期化 effects から _effects/{name}.js をロード
ビルド CSS/JS バンドル(エンジン + プロジェクト側)
ブログ基盤 コレクション、フィルター、ページネーション
検索 Pagefind

関連ドキュメント


↑ 目次