Files
Gnuboard7/docs/extension/template-basics.md
T
HeuJung 1e89335258 fix(core,extensions): 동적 스크립트 주입 경로 전부에 출처 게이트 적용
레이아웃 scripts[] 에만 있던 원격 스크립트 차단 게이트가 다른 주입 경로에는
없어, 저장측(SafeLayoutExpressions·NoExternalUrls)이 외부 URL 저장을 422 로
막아도 런타임 디스패치 한 번으로 임의 원격 코드가 로드됐다. 저장 검증이
통째로 무의미해지는 상태였고 오류도 경고도 남지 않았다.

판정식을 support/scriptSrcPolicy.ts 로 분리해 런타임 SSoT 를 하나로 두고,
loadScript 액션 · 확장 핸들러 재로드 · 편집기 프리뷰 · 편집기 자산 매니페스트 ·
G7Core.asset.loadScript · PG 플러그인 SDK 주입이 모두 그것을 경유하게 했다.
사본을 두지 않은 이유는 차집합이 그대로 우회로가 되기 때문이다.

- 게이트는 캐시 검사보다 앞에 둔다 (뒤에 두면 이미 로드된 미신뢰 스크립트가
 캐시 히트로 통과한다)
- NoExternalUrls 순회를 9키로 확대 — 번들 레이아웃 601개 사전 스캔으로
 정당한 외부 URL 0건을 확인한 뒤 넓혔다 (저장 회귀 없음)
- callExternal 은 생성자를 참조 동일성으로 거부하고(별칭 전역 포함),
 프로토타입 경로 세그먼트를 읽기·매핑 키 양쪽에서 차단한다
- PG SDK 는 서비스 SDK 라 자체 호스팅이 불가능하므로 manifest 선언 +
 주입 직전 호스트 확인이 게이트다. tosspayments SDK URL 은 확장자가 없어
 정적 검사에 걸리지 않아 그 런타임 확인이 유일한 게이트다
- 함께 드러난 결함: 동시 loadScript 가 로드 전에 완료 처리되던 문제,
 확장 재로드에서 script 기존재가 CSS 까지 건너뛰던 문제, loadCSS 의
 in-flight 미공유
2026-09-02 21:43:13 +09:00

689 lines
24 KiB
Markdown

# 템플릿 시스템 기초
> **위치**: `docs/extension/template-basics.md`
> **관련 문서**: [index.md](./index.md) | [template-routing.md](./template-routing.md) | [template-security.md](./template-security.md)
---
## TL;DR (5초 요약)
```text
1. 타입: Admin (관리자용), User (일반사용자용)
2. 디렉토리: templates/vendor-template (예: sirsoft-admin_basic)
3. 필수: template.json, routes.json, components.json
4. 코어/템플릿 분리: 코어는 엔진, 템플릿은 컴포넌트
5. 버전 히스토리: Admin만 지원, User는 미지원
```
---
## 목차
1. [개요](#개요)
2. [템플릿 타입](#템플릿-타입)
- [Admin 템플릿](#admin-템플릿)
- [User 템플릿](#user-템플릿)
3. [템플릿 타입별 버전 히스토리 규칙](#템플릿-타입별-버전-히스토리-규칙)
4. [템플릿 네이밍 규칙](#템플릿-네이밍-규칙)
5. [템플릿 메타데이터 (template.json)](#템플릿-메타데이터-templatejson)
6. [에러 페이지 설정 (error_config)](#에러-페이지-설정-error_config)
7. [레이아웃 등록 스캔 범위](#레이아웃-등록-스캔-범위)
8. [역호환성 (다국어 필드)](#역호환성-다국어-필드)
---
## 개요
G7의 템플릿 시스템은 JSON 기반 레이아웃 정의를 통해 동적으로 UI를 생성하는 프론트엔드 아키텍처입니다. 코어는 렌더링 엔진만 제공하고, 실제 컴포넌트는 템플릿별로 독립적으로 구현됩니다.
**핵심 원칙**:
- 코어와 템플릿의 완전한 분리
- JSON 기반 레이아웃 정의
- 컴포넌트 재사용성 극대화
- 다국어 및 권한 기반 렌더링
---
## 템플릿 타입
### Admin 템플릿
**용도**: 관리자 페이지 UI 제공
**특징**:
- 레이아웃은 **읽기 전용** (DB 저장)
- 관리자만 접근 가능
- `/admin/*` 경로 전용
- 예: `sirsoft-admin_basic`
### User 템플릿
**용도**: 일반 사용자 페이지 UI 제공
**특징**:
- 레이아웃 **편집 가능** (사용자 커스터마이징)
- 공개 접근 가능
- `/` 루트 경로 전용
- 예: `sirsoft-user_theme1` (추후 구현 예정)
---
## 템플릿 타입별 버전 히스토리 규칙
```
중요: 템플릿 타입에 따라 버전 히스토리 동작이 다름
✅ 필수: Admin과 User 템플릿의 버전 관리 차이 이해
```
### Admin 템플릿 (`type: "admin"`)
**버전 히스토리**: ❌ **사용하지 않음**
- 레이아웃은 읽기 전용 (수정 불가)
- `template_layout_versions` 테이블 미사용
- 레이아웃 변경 시 직접 `template_layouts.content` 덮어쓰기
- 이유: 디자인 변경만 가능, 레이아웃 구조는 템플릿 교체로만 변경
**구현 예시**:
```php
// Admin 템플릿 레이아웃 업데이트
public function updateAdminLayout(int $id, array $data): TemplateLayout
{
$layout = TemplateLayout::findOrFail($id);
// 버전 생성 없이 직접 수정
$layout->update([
'content' => $data['content'],
]);
return $layout;
}
```
### User 템플릿 (`type: "user"`)
**버전 히스토리**: ✅ **자동 관리**
- 레이아웃 편집 가능 (사용자 커스터마이징)
- `template_layout_versions` 테이블 사용
- 레이아웃 수정 시 자동으로 새 버전 생성
- 버전별 저장/복원 기능 제공
**구현 예시**:
```php
// User 템플릿 레이아웃 업데이트 (버전 자동 생성)
public function updateUserLayout(int $id, array $data): TemplateLayout
{
$layout = TemplateLayout::findOrFail($id);
// 현재 버전 번호 조회
$latestVersion = $layout->versions()->max('version') ?? 0;
$newVersion = $latestVersion + 1;
// 새 버전 생성
TemplateLayoutVersion::create([
'layout_id' => $layout->id,
'version' => $newVersion,
'content' => $data['content'],
'created_by' => auth()->id(),
]);
// 레이아웃 content도 업데이트
$layout->update([
'content' => $data['content'],
]);
return $layout;
}
```
**버전 복원**:
```php
// 특정 버전으로 복원
public function restoreVersion(int $layoutId, int $version): TemplateLayout
{
$layout = TemplateLayout::findOrFail($layoutId);
$versionRecord = $layout->getVersion($version);
if (!$versionRecord) {
throw new Exception('버전을 찾을 수 없습니다.');
}
// 복원 시 새 버전으로 저장
$latestVersion = $layout->versions()->max('version') ?? 0;
TemplateLayoutVersion::create([
'layout_id' => $layout->id,
'version' => $latestVersion + 1,
'content' => $versionRecord->content,
'created_by' => auth()->id(),
]);
$layout->update([
'content' => $versionRecord->content,
]);
return $layout;
}
```
### 비교표
| 항목 | Admin 템플릿 | User 템플릿 |
|------|------------|-----------|
| 레이아웃 편집 | ❌ 불가 | ✅ 가능 |
| 버전 히스토리 | ❌ 미사용 | ✅ 자동 생성 |
| `template_layout_versions` | ❌ 미사용 | ✅ 사용 |
| 레이아웃 복원 | ❌ 불가 | ✅ 가능 |
| 변경 방법 | 템플릿 교체 | 직접 편집 |
---
## 템플릿 네이밍 규칙
**형식**: `[vendor-template]` (GitHub 스타일)
- 소문자 사용
- 하이픈(-) 구분
- vendor: 개발자/조직 식별자
- template: 템플릿명
**디렉토리 예시**:
- `/templates/_bundled/sirsoft-admin_basic/` - sirsoft가 개발한 기본 관리자 템플릿
- `/templates/_bundled/johndoe-admin_dark/` - johndoe가 개발한 다크 모드 관리자 템플릿
### 식별자 검증 규칙
모듈/플러그인/템플릿 공통 식별자 검증 규칙은 [extension-manager.md](./extension-manager.md#식별자-검증-규칙-validextensionidentifier)를 참조하세요.
---
## 템플릿 메타데이터 (template.json)
**위치**: `/templates/_bundled/[vendor-template]/template.json`
### 구조
```json
{
"identifier": "sirsoft-admin_basic",
"vendor": "sirsoft",
"name": "Admin Basic",
"version": "1.0.0",
"license": "MIT",
"description": "Basic admin template for Gnuboard7 platform",
"type": "admin",
"locales": ["ko", "en"],
"dependencies": [],
"features": {
"responsive": true,
"darkMode": true,
"rtl": false
},
"assets": {
"css": ["dist/bundle.css"],
"js": ["dist/bundle.js"]
},
"externals": [
{
"id": "fontawesome",
"type": "style",
"asset": "vendor/font-awesome/6.4.0/css/all.inlined.css"
}
]
}
```
### 필수 필드
| 필드 | 설명 |
|------|------|
| `identifier` | 템플릿 고유 식별자 (vendor-template 형식) |
| `vendor` | 벤더명 |
| `name` | 템플릿 표시명 |
| `version` | 버전 (Semantic Versioning) |
| `license` | 라이선스 유형 (예: `"MIT"`) — API 리소스의 `license` 필드로 노출 |
| `type` | "admin" 또는 "user" |
| `locales` | 지원 언어 배열 (`config('app.supported_locales')`와 매칭) |
### 외부 리소스 (externals)
`externals`는 admin/user 템플릿에 공통 적용되는 선택 필드입니다. 최초 HTML 문서에 정적으로 필요한 스타일, 웹폰트, 스크립트, 리소스 힌트를 선언합니다. `external_styles`는 사용하지 않습니다.
자산을 가리키는 방법은 `asset`과 `url` 두 가지이며, 항목마다 **하나를 고릅니다**.
- `asset` — 템플릿이 **자체 제공**하는 파일의 `dist/` 이하 경로. 구동 에셋은 자체 제공이 원칙이므로 이쪽이 기본입니다.
- `url` — 절대 URL. 자체 제공이 불가능한 외부 서비스에만 씁니다.
```json
{
"type": "style",
"id": "font-awesome",
"asset": "vendor/font-awesome/6.4.0/css/all.inlined.css"
}
```
구동에 필요한 에셋을 제3자 CDN에서 실시간으로 받으면, 그 도달 실패는 예외도 로그도 남기지 않고 화면 기능만 사라집니다. 폐쇄망·방화벽·광고차단기 환경에서 재현되며 자체 서버 로그에 흔적이 없어 운영자가 원인을 특정할 수 없습니다. 라이브러리·웹폰트·아이콘은 `dist/vendor/{lib}/{version}/`에 동봉하고 `asset`으로 가리킵니다.
| 속성 | 타입 | 필수 | 적용 type | 허용값/형식 | 렌더링/동작 |
|---|---:|---:|---|---|---|
| `id` | string | 권장 | all | 영문/숫자/`-`/`_` | HTML `id` 속성 |
| `type` | string | 필수 | all | `style`, `webfont`, `script`, `preconnect`, `dns-prefetch`, `preload`, `modulepreload` | 출력 태그와 위치 결정 |
| `asset` | string | `url`과 택일 | `preconnect`·`dns-prefetch` 제외 | `dist/` 이하 상대 경로 (`vendor/font-awesome/6.4.0/css/all.inlined.css`). `/`로 시작 금지, `..` 금지, `A-Za-z0-9._-/`만 허용 | 자산 URL 이중 모드와 정적 게시를 반영한 same-origin URL로 해석. `url`보다 우선하며, 둘 다 선언하면 `url`은 무시되고 경고가 남는다 |
| `url` | string | `asset`과 택일 | all | `https://...` 또는 `/`로 시작하는 same-origin 경로 | link 계열은 `href`, script는 `src` |
| `preconnect` | string | 선택 | `style`, `webfont`, `script`, `preload`, `modulepreload` | `https://cdn.example.com` | 리소스보다 먼저 `<link rel="preconnect">` 출력, 중복 제거. **same-origin 항목에서는 무시** |
| `crossorigin` | boolean/string | 선택 | `style`, `webfont`, `script`, `preconnect`, `preload`, `modulepreload` | `true`, `anonymous`, `use-credentials` | `true`는 `anonymous`로 정규화. **same-origin 항목에서는 무시** |
| `integrity` | string | 선택 | `style`, `webfont`, `script`, `preload`, `modulepreload` | SRI hash | HTML `integrity` |
| `referrerpolicy` | string | 선택 | `style`, `webfont`, `script`, `preload`, `modulepreload` | 표준 referrer policy | HTML `referrerpolicy` |
| `media` | string | 선택 | `style`, `webfont` | CSS media query | stylesheet link의 `media` |
| `position` | string | 선택 | `script` | `head`, `before-core`, `before-template`, `body-end` | script 삽입 위치, 기본 `before-template` |
| `async` | boolean | 선택 | `script` | `true`, `false` | `async`; `defer`와 동시 사용 불가 |
| `defer` | boolean | 선택 | `script` | `true`, `false` | `defer` |
| `as` | string | `preload` 필수 | `preload` | `style`, `script`, `font`, `image`, `fetch` 등 | preload의 `as` |
| `mimeType` | string | 선택 | `preload`, `modulepreload` | MIME type | HTML `type` |
| `fetchpriority` | string | 선택 | `preload`, `modulepreload` | `high`, `low`, `auto` | HTML `fetchpriority` |
| `type` | 출력 위치 | HTML 결과 |
|---|---|---|
| `style` | head | `<link rel="stylesheet" href="...">` |
| `webfont` | head | `<link rel="stylesheet" href="...">` |
| `script` | `position` 기준 | `<script src="..."></script>` |
| `preconnect` | head 상단 | `<link rel="preconnect" href="...">` |
| `dns-prefetch` | head 상단 | `<link rel="dns-prefetch" href="...">` |
| `preload` | head | `<link rel="preload" href="..." as="...">` |
| `modulepreload` | head | `<link rel="modulepreload" href="...">` |
`externals`는 페이지 최초 진입에 항상 필요한 리소스만 선언합니다. 라우트별 조건부 스크립트나 액션 실행 중 동적 로딩은 layout `scripts`와 `loadScript` 책임입니다.
세 경로 모두 **같은 출처 정책**을 받습니다 — same-origin 경로이거나 확장이 manifest(`trusted_script_hosts`)로 선언한 신뢰 호스트여야 합니다. 상세: [module-assets.md](module-assets.md#trusted_script_hosts--외부-스크립트-신뢰-호스트) · [frontend/security.md](../frontend/security.md#외부-스크립트-신뢰-출처-허용목록)
---
## 에러 페이지 설정 (error_config)
```
필수: 모든 템플릿은 에러 페이지 설정을 포함해야 함
✅ 규칙: DB에는 layout_name만 저장되므로 경로 없이 이름만 사용
```
### template.json 설정
```json
{
"error_config": {
"layouts": {
"404": "404",
"403": "403",
"500": "500"
}
}
}
```
### 에러 레이아웃 파일 위치
에러 레이아웃은 반드시 `layouts/errors/` 디렉토리에 위치해야 합니다:
```
templates/_bundled/[vendor-template]/
├── template.json # 메타데이터 (이름, 버전, 라이선스 등 SSoT)
├── seo-config.json # SEO 컴포넌트→HTML 매핑 설정 (선택)
├── LICENSE # 라이선스 전문 (MIT) — API 엔드포인트 `GET /api/admin/templates/{identifier}/license`로 제공
├── layouts/
│ ├── dashboard.json # 일반 레이아웃
│ ├── _admin_base.json # 베이스 레이아웃
│ └── errors/ # 에러 레이아웃 전용
│ ├── 404.json
│ ├── 403.json
│ └── 500.json
```
### 에러 레이아웃 구조
에러 레이아웃도 일반 레이아웃과 동일하게 `extends` + `slots` 패턴을 사용합니다:
```json
{
"extends": "_admin_base",
"slots": {
"content": [
{
"type": "composite",
"name": "EmptyState",
"props": {
"icon": "alert-triangle",
"title": "$t:errors.404.title",
"description": "$t:errors.404.description"
}
}
]
}
}
```
### 설치 시 검증
`TemplateManager::installTemplate()` 호출 시 다음 사항이 자동 검증됩니다:
1. `error_config` 섹션 존재 여부
2. 필수 에러 코드(404, 403, 500) 레이아웃 정의 여부
3. 레이아웃 파일 실제 존재 여부 (`layouts/errors/` 디렉토리 내)
---
## 레이아웃 등록 스캔 범위
```
중요: registerLayouts()는 특정 디렉토리만 스캔
✅ 포함: layouts/*.json (루트) + layouts/errors/*.json
❌ 제외: layouts/partials/ 등 기타 하위 디렉토리
```
### 스캔 대상
| 디렉토리 | 스캔 여부 | 용도 |
|----------|----------|------|
| `layouts/*.json` | ✅ 스캔 | 일반 레이아웃 |
| `layouts/errors/*.json` | ✅ 스캔 | 에러 페이지 레이아웃 |
| `layouts/partials/*.json` | ❌ 제외 | extends로 참조되는 부분 레이아웃 |
### 이유
- `partials/` 디렉토리의 파일은 메인 레이아웃에서 `extends`로 참조되어 병합됨
- 직접 라우팅되지 않으므로 DB에 별도 등록 불필요
- 에러 레이아웃은 `ErrorPageHandler`에서 직접 조회하므로 DB 등록 필요
### TemplateManager.php 구현
```php
// 루트 layouts 디렉토리의 JSON 파일만 스캔
$layoutFiles = File::glob("{$layoutsPath}/*.json");
// errors/ 디렉토리만 추가 스캔 (에러 페이지 레이아웃용)
$errorsPath = "{$layoutsPath}/errors";
if (File::exists($errorsPath)) {
$errorLayoutFiles = File::glob("{$errorsPath}/*.json");
$layoutFiles = array_merge($layoutFiles, $errorLayoutFiles);
}
```
### 모듈 레이아웃 자동 등록
모듈 활성화 시 레이아웃은 디렉토리 위치에 따라 해당 타입의 템플릿에 등록됩니다:
- `modules/{module}/resources/layouts/admin/*.json` → Admin 타입 템플릿에 등록
- `modules/{module}/resources/layouts/user/*.json` → User 타입 템플릿에 등록
이 동작은 `ModuleManager::registerModuleLayouts()`에서 처리됩니다.
---
## 역호환성 (다국어 필드)
```
중요: 다국어 필드의 역호환성 지원
✅ 필수: 문자열 → 다국어 배열 자동 변환
```
### 지원 필드
- `name`: 템플릿명
- `description`: 템플릿 설명
### ModuleInterface/PluginInterface와 동일한 패턴
```php
// ✅ 권장: 다국어 배열 반환
public function getName(): array
{
return [
'ko' => '기본 관리자 템플릿',
'en' => 'Basic Admin Template',
];
}
// 역호환: 문자열 반환 (자동 변환됨)
public function getName(): string
{
return 'Basic Admin Template'; // 자동으로 ['ko' => '...', 'en' => '...']로 변환
}
```
### TemplateManager 자동 변환
```php
// app/Extension/TemplateManager.php
/**
* 문자열을 다국어 배열로 자동 변환
*/
protected function convertToMultilingual($value): array
{
// 이미 배열이면 그대로 반환
if (is_array($value)) {
return $value;
}
// 문자열이면 모든 로케일에 동일한 값 설정
if (is_string($value)) {
$locales = config('app.translatable_locales', ['ko', 'en']);
$result = [];
foreach ($locales as $locale) {
$result[$locale] = $value;
}
return $result;
}
// 그 외 타입은 빈 배열 반환
return [];
}
```
### template.json 예시
```json
{
"identifier": "sirsoft-admin_basic",
"vendor": "sirsoft",
// ✅ 권장: 다국어 객체
"name": {
"ko": "기본 관리자 템플릿",
"en": "Basic Admin Template"
},
"description": {
"ko": "그누보드7용 기본 관리자 템플릿",
"en": "Basic admin template for Gnuboard7 platform"
}
// 역호환: 문자열 (자동 변환됨)
// "name": "Basic Admin Template",
// "description": "Basic admin template for Gnuboard7 platform"
}
```
### DB 저장 형식
```php
// templates 테이블
[
'name' => ['ko' => '기본 관리자 템플릿', 'en' => 'Basic Admin Template'],
'description' => ['ko' => 'G7용...', 'en' => 'Basic admin template...'],
]
```
### 역호환성 보장 사항
- ✅ 기존 문자열 기반 template.json 정상 작동
- ✅ 문자열 → 다국어 배열 자동 변환
- ✅ 변환된 값은 모든 로케일에 동일하게 적용
- ✅ Model Accessor (`getLocalizedName()`)에서 올바른 폴백 처리
---
## 템플릿 업데이트 레이아웃 충돌 전략
템플릿 버전 업데이트 시, 관리자가 수정한 레이아웃과 새 버전의 레이아웃이 충돌할 수 있습니다.
### 사전 확인
업데이트 전 수정된 레이아웃을 확인할 수 있습니다:
```text
GET /api/admin/templates/{templateName}/check-modified-layouts
```
응답:
```json
{
"has_modified": true,
"modified_layouts": [
{ "id": 1, "name": "dashboard", "updated_at": "2026-02-24T10:00:00Z" }
]
}
```
### 충돌 해결 전략
업데이트 실행 시 `layout_strategy` 파라미터로 전략을 선택합니다:
| 전략 | 동작 |
|------|------|
| `apply_new` | 새 버전의 레이아웃으로 덮어쓰기 (관리자 수정 사항 유실) |
| `keep_current` | 기존 레이아웃 유지 (새 버전 레이아웃 미적용) |
```text
POST /api/admin/templates/{templateName}/update
Body: { "layout_strategy": "apply_new" }
```
> 상세: [extension-update-system.md](./extension-update-system.md)
---
## 번들 디렉토리 작업 규칙
```text
필수: 템플릿 수정/개발은 _bundled 디렉토리에서만 작업 (활성 디렉토리 직접 수정 금지)
필수: _bundled 작업 완료 후 반영/검증은 업데이트 프로세스 사용
```
### `custom/` 은 운영자 자리입니다 — 저작자가 선점하지 않습니다
`templates/{identifier}/custom/` 은 **사이트 운영자**가 자기 CSS·JS 를 덧붙이는 자리입니다.
확장 교체(업데이트·재설치)가 이 디렉토리만은 보존하므로, 운영자가 넣은 파일은 템플릿을
업데이트해도 살아남습니다.
그래서 템플릿 저작자는 `_bundled` 에 `custom/` 을 담아 배포하지 않습니다. 보존 계층은
"덮어쓰지 않음" 이라, 저작자가 담은 파일은 이미 `custom/` 을 가진 사이트에서 **영영
반영되지 않는 상태**가 됩니다. 저작자의 기본 스타일은 `src/styles/` 에 두고 빌드에
포함시킵니다.
| 대상 | 자리 | 빌드 | 업데이트 시 |
|---|---|---|---|
| 저작자 기본 스타일 | `src/styles/` | 필요 | 새 배포본으로 교체 |
| 저작자 동봉 구동 자산 | `dist/vendor/{lib}/{version}/` | 불필요 | 새 배포본으로 교체 |
| **운영자 추가 CSS·JS** | **`custom/`** | **불필요** | **보존** |
운영자가 `dist/` 를 직접 고치는 것은 방법이 아닙니다 — 다음 빌드와 다음 업데이트에
사라집니다. 로드 순서·`custom/assets.json` 선언 형식·외부 URL 등록 규칙은
[module-assets.md 「사용자 추가 에셋」](module-assets.md) 을 참조하세요.
### 개발 워크플로우
```text
1. templates/_bundled/{identifier}/ 에서 코드 수정
2. template.json 버전 올리기
3. php artisan template:update {identifier} 로 활성 디렉토리에 반영
4. 테스트 실행으로 검증
```
### 왜 활성 디렉토리 직접 수정이 금지되는가?
- 활성 디렉토리는 `.gitignore` 대상 → Git에 변경 기록 불가
- 다음 업데이트 시 `_bundled` 소스로 덮어쓰기 → 직접 수정 사항 유실
- 업데이트 프로세스 미수행 시 레이아웃 갱신/캐시 무효화 누락
### 예외: 초기 개발 (아직 _bundled에 미등록)
```text
✅ 허용: 신규 템플릿 초기 개발 시 활성 디렉토리에서 직접 작업
전환점: _bundled에 최초 반영한 이후부터는 반드시 _bundled에서만 작업
```
> 상세: [extension-update-system.md](./extension-update-system.md) "번들 디렉토리 개발 워크플로우" 참조
---
## 코드 변경 시 버전 변경 필수
```text
필수: 템플릿 코드를 변경한 경우 버전을 올려야 합니다.
버전 변경 없이 _bundled에 반영하면, 이미 설치된 환경에서 업데이트가 감지되지 않습니다.
참고: 템플릿은 모듈/플러그인과 달리 업그레이드 스텝(upgrades/)을 사용하지 않습니다.
```
### 필수 작업
1. **`template.json` 버전 올리기**: `version` 필드를 Semantic Versioning에 따라 증가
2. **`_bundled` 동기화**: `templates/_bundled/{identifier}/` 디렉토리에 변경 사항 반영
### 템플릿 vs 모듈/플러그인 차이
| 항목 | 템플릿 | 모듈/플러그인 |
|------|--------|-------------|
| manifest 버전 올리기 | ✅ 필수 | ✅ 필수 |
| _bundled 동기화 | ✅ 필수 | ✅ 필수 |
| 업그레이드 스텝 (upgrades/) | ❌ 해당 없음 | 조건부 필요 |
| DB 마이그레이션 | ❌ 해당 없음 | 조건부 필요 |
| 레이아웃 충돌 전략 | ✅ `layout_strategy` 파라미터 | ❌ 해당 없음 |
> 상세: [extension-update-system.md](./extension-update-system.md) "개발자 버전 업데이트 가이드" 참조
---
## SEO 설정 (seo-config.json)
**위치**: `templates/_bundled/[vendor-template]/seo-config.json` (선택 파일)
SEO 페이지 생성기가 컴포넌트를 HTML로 변환할 때 사용하는 매핑 설정입니다. 이 파일이 없으면 모든 컴포넌트가 `<div>` fallback으로 렌더링됩니다.
### 주요 섹션
| 섹션 | 설명 |
|------|------|
| `text_props` | 텍스트 추출 우선순위 (예: `["text", "label", "value", "title"]`) |
| `attr_map` | props→HTML 속성 매핑 (예: `{"className": "class", "htmlFor": "for"}`) |
| `allowed_attrs` | 허용 HTML 속성 목록 (목록에 없는 속성은 출력 안됨) |
| `component_map` | 컴포넌트명 → HTML 태그 매핑 (기본 30개 + 커스텀) |
| `render_modes` | 렌더 모드 정의 (iterate/format/raw 타입) |
| `self_closing` | 셀프 클로징 태그 목록 (`["img", "input", "hr", "br"]`) |
| `stylesheets` | SEO 페이지에 포함할 외부 CSS URL |
### Graceful Degradation
- `text_props`/`attr_map`/`allowed_attrs` 미선언 → 엔진 내장 기본값 사용 (범용 HTML/React 매핑)
- `text_props` 빈 배열로 명시 → props에서 텍스트 추출 불가 (`component.text`는 여전히 동작)
- `attr_map` 빈 객체로 명시 → 속성명 변환 없음 (className→class 미적용)
- `allowed_attrs` 빈 배열로 명시 → 모든 속성 출력 차단
- seo-config.json 미존재 → 모든 컴포넌트 `<div>` fallback, 기본 속성 매핑으로 최소한의 HTML 생성
### 검증
`TemplateManager.validateSeoConfig()`가 설치/업데이트 시 자동 검증합니다:
- JSON 파싱, `component_map.*.tag` 필수, `render` → `render_modes` 교차 참조
- 검증 실패 시 설치/업데이트 차단
- 파일 미존재 시 경고만 (설치 허용)
> 상세 스키마: [seo-system.md](../backend/seo-system.md) "템플릿 seo-config.json" 섹션 참조
## 관련 문서
- [index.md](./index.md) - 확장 시스템 인덱스
- [template-routing.md](./template-routing.md) - 템플릿 라우트/언어 파일 규칙
- [template-security.md](./template-security.md) - 템플릿 보안 정책
- [template-caching.md](./template-caching.md) - 템플릿 캐싱 전략
- [template-commands.md](./template-commands.md) - 템플릿 Artisan 커맨드
- [extension-update-system.md](./extension-update-system.md) - 확장 업데이트 시스템