템플릿 빌더에서 스크립팅

사용자 스크립트                 엔진                          결과
    |                              |                              |
    v                              v                              v
documents.get("article", "intro") --> 데이터베이스에서 가져옵니다 --> { headline: "Welcome", body: "..." }
         .headline                --> 필드를 추출합니다         --> "Welcome"

// 현재 문서의 price 필드에 접근
doc.price

// 현재 문서 필드로 합계 계산
doc.price * doc.quantity

// 현재 문서 상태에 따른 조건 처리
doc.status == "published" ? doc.title : "Draft: " + doc.title

// CMS에 저장된 형태: article / welcome-post
{
  "headline": "Welcome to Our Platform",
  "author": "Sarah Chen",
  "body": "We're excited to announce...",
  "tags": ["announcement", "news"]
}

documents.get("article", "welcome-post")

{
  "headline": "Welcome to Our Platform",
  "author": "Sarah Chen",
  "body": "We're excited to announce...",
  "tags": ["announcement", "news"]
}

documents.get("article", "welcome-post").headline

documents.get("article", "welcome-post").author

documents.get("article", meta.params.slug).headline

// 모든 국가 가져오기
documents.find("country")

[
  { "code": "us", "name": "United States", "flag": "US" },
  { "code": "sa", "name": "Saudi Arabia", "flag": "SA" },
  { "code": "gb", "name": "United Kingdom", "flag": "GB" }
]

// 필터를 사용해 국가 가져오기
documents.find("country", { "where": { "code": "us" } })

[
  { "code": "us", "name": "United States", "flag": "US" }
]

// meta.locale이 "fr"이면 기본 문서에 프랑스어 번역을 병합하여 반환
documents.get("greeting", "welcome").headline

// 항상 스페인어 번역 가져오기
documents.translated("greeting", "welcome", "es").headline

// URL 매개변수를 기반으로 번역 가져오기
documents.translated("product", meta.params.id, meta.params.lang).description

// 번역 비교하기
documents.translated("article", "intro", "en").title + " / " + documents.translated("article", "intro", "fr").title

// 기본 문서: greeting / welcome
{ "headline": "Welcome", "subheadline": "Welcome to our platform" }

// 번역(언어: "fr")
{ "headline": "Bienvenue", "subheadline": "Bienvenue sur notre plateforme" }

// 번역(언어: "es")
{ "headline": "Bienvenido", "subheadline": "Bienvenido a nuestra plataforma" }

// meta.locale = "fr"일 때
documents.get("greeting", "welcome").headline
// 반환: "Bienvenue"

// 명시적 스페인어 번역
documents.translated("greeting", "welcome", "es").headline
// 반환: "Bienvenido"

// 누락된 번역에 대한 폴백 패턴
documents.translated("greeting", "welcome", meta.params.lang) != null
  ? documents.translated("greeting", "welcome", meta.params.lang).headline
  : documents.get("greeting", "welcome").headline

{
  "headline": "Build Faster, Ship Smarter",
  "subheadline": "The modern CMS for developers"
}

documents.get("article", "homepage-hero").headline

// country / us
{ "code": "us", "name": "United States", "flag": "US", "languages": ["en", "es"] }

// country / sa
{ "code": "sa", "name": "Saudi Arabia", "flag": "SA", "languages": ["ar", "en"] }

documents.get("country", meta.params.code).name

meta.locale == "ar-SA" ? "Welcome, everyone" : "Welcome"

{ "headline": "News from the US", "countryCode": "us" }

documents.get("country", documents.get("article", "us-news").countryCode).name

documents.get("article", meta.params.slug) != null
  ? documents.get("article", meta.params.slug).headline
  : "Article Not Found"

documents.get("article", "intro").author != null
  ? documents.get("article", "intro").author
  : "Unknown Author"

"featured" in documents.get("article", "welcome-post").tags

documents.get("article", "welcome-post").tags[0]

size(documents.get("article", "welcome-post").tags)

{
  "pattern": "/{lang}/landingPage",
  "param_bindings": {
    "lang": "language"
  }
}

// greeting / ko
{ "code": "ko", "headline": "Welcome", "subheadline": "Welcome to our platform", "ctaText": "Get Started", "ctaUrl": "/ko/get-started" }

// greeting / en
{ "code": "en", "headline": "Welcome", "subheadline": "Welcome to our platform", "ctaText": "Get Started", "ctaUrl": "/en/get-started" }

// greeting / ja
{ "code": "ja", "headline": "Welcome", "subheadline": "Welcome to our platform", "ctaText": "Start", "ctaUrl": "/ja/get-started" }

documents.get("greeting", meta.params.lang).headline

{
  "pattern": "/{country}/{lang}/products",
  "param_bindings": {
    "country": "country",
    "lang": "language"
  }
}

// 국가 이름 가져오기
documents.get("country", meta.params.country).name

// 국가에 따라 현지화된 상품 목록 가져오기
documents.find("product", { "where": { "country": meta.params.country } })

// 결합: 사용자의 언어로 국가별 인사말 표시
documents.get("greeting", meta.params.lang).headline + " from " + documents.get("country", meta.params.country).name

// 첫 번째 구간 가져오기(주로 언어 코드)
meta.segments[0]

// 경로 깊이 확인
size(meta.segments) > 2 ? "deep" : "shallow"

// 관리자 영역인지 확인
"admin" in meta.segments ? "admin mode" : "public mode"

// 폴백: 매개변수가 바인딩되지 않았다면 구간 사용
has(meta.params.lang) ? meta.params.lang : meta.segments[0]

// 로케일을 확인해 RTL 언어인지 파악
meta.locale == "ar-SA" || meta.locale == "he-IL" ? "rtl" : "ltr"

// 언어 부분만 가져오기
meta.locale.split("-")[0]  // 지원되지 않음 - 대신 meta.params.lang 사용

// 이름 있는 매개변수에 접근
meta.params.lang           // "ko"
meta.params.country        // "us"
meta.params.slug           // "welcome-post"

// 매개변수가 존재하는지 확인
has(meta.params.category)  // true/false

// 문서 조회에 사용
documents.get("greeting", meta.params.lang)
documents.ref("airports").get(meta.params.code)

// 인덱스로 접근(0부터 시작)
meta.segments[0]           // 첫 번째 구간
meta.segments[1]           // 두 번째 구간

// 길이 확인
size(meta.segments)        // 구간 수

// 포함 여부 확인
"products" in meta.segments  // 경로에 "products"가 포함되어 있는가?

// 기존 문서를 편집 중일 때만 사용 가능
meta.docId != null ? "editing" : "creating new"

// 조건부 로직에 사용
meta.docId != null ? documents.get("article", meta.docId).status : "draft"

// 표시용
"Editing: " + meta.title

// 제목 기반 조건부 처리
meta.title.contains("Draft") ? "work in progress" : "published"

// 전통적인 접근 방식
documents.get("airports", meta.params.code).name

// ref() 사용 - 스키마는 분리하고 식별자만 동적으로
documents.ref("airports").get(meta.params.code).name

documents.get("schema", "identifier")       // 문서 하나 가져오기
documents.get("schema", "id").fieldName     // 특정 필드 가져오기
documents.find("schema")                    // 모든 문서 가져오기
documents.find("schema", { "where": {...}}) // 필터 쿼리
documents.ref("schema").get(identifier)     // 체이닝 조회
documents.translated("schema", "id", "fr")  // 명시적 로케일로 가져오기

meta.locale          // "en-US", "ar-SA" 등
meta.params.xyz      // "xyz"라는 이름의 URL 매개변수
meta.segments        // URL 경로 배열: ["articles", "intro"]
meta.segments[0]     // 첫 번째 경로 구간
meta.docId           // 현재 문서 ID(또는 null)
meta.title           // 현재 문서 제목
doc.fieldName        // 편집기 컨텍스트에서 현재 문서 필드 값

// 비교
==  !=  <  <=  >  >=

// 논리
&&  ||  !

// 삼항 연산자(조건부)
condition ? valueIfTrue : valueIfFalse

// 멤버십
"value" in listOrMap

size(list)                    // 항목 수
size(string)                  // 문자열 길이
"text".startsWith("te")       // true
"text".endsWith("xt")         // true
"text".contains("ex")         // true
has(object.property)          // 속성 존재 여부 확인
hasProperty(obj, "key")       // 객체에 키가 있는지 확인(대체 구문)

// 향후: MCP를 통해 외부 서비스 호출
mcp.translate(meta.params.text, "en", meta.params.lang)
mcp.analyze(documents.get("article", meta.params.id).body)

// 향후: AI 기반 콘텐츠 생성
ai.summarize(documents.get("article", meta.params.id).body, 100)
ai.translate(meta.params.text, meta.params.targetLang)
ai.classify(meta.params.input, ["positive", "negative", "neutral"])

// 기사에 저장된 author ID로 작성자 이름 가져오기
documents.get("author", documents.get("article", "intro").authorId).name

// 전통적 접근
documents.get("country", documents.get("airport", meta.params.code).countryCode).name

// ref() 사용 - 스키마는 고정, 식별자는 동적
documents.ref("country").get(documents.get("airport", meta.params.code).countryCode).name

// 공항 → 국가 → 지역 → 대륙
documents.get("continent",
  documents.get("region",
    documents.get("country",
      documents.get("airport", meta.params.code).countryCode
    ).regionCode
  ).continentCode
).name

// 공항의 국가 이름을 현지화해서 가져오기
documents.translated("country",
  documents.get("airport", meta.params.code).countryCode,
  meta.params.lang
).name

// article / tech-news
{ "title": "Tech Update", "authorId": "author-123", "categoryId": "cat-tech" }

// 작성자 이름 확인
documents.get("author", documents.get("article", meta.params.slug).authorId).name

// 카테고리를 폴백과 함께 확인
documents.get("article", meta.params.slug).categoryId != null
  ? documents.get("category", documents.get("article", meta.params.slug).categoryId).name
  : "Uncategorized"

// airport / JFK
{ "code": "JFK", "name": "John F. Kennedy International", "countryCode": "us" }

// country / us
{ "code": "us", "name": "United States", "currencyCode": "usd" }

// currency / usd
{ "code": "usd", "symbol": "$", "name": "US Dollar" }

// 공항 → 국가 → 통화 체인
documents.get("currency",
  documents.get("country",
    documents.get("airport", meta.params.code).countryCode
  ).currencyCode
).symbol
// JFK의 경우: "$" 반환

// 상품 문서에서 관련 카테고리 세부 정보 가져오기
documents.get("category", doc.categoryId).description

// 상품의 원산지 국가에 따라 배송비 계산
documents.get("shipping-rates", doc.originCountry).baseRate * doc.weight

// 기사 작성자를 가져온 다음, 그 작성자의 다른 기사 가져오기(조회 횟수 주의)
documents.find("article", { "where": { "authorId": documents.get("article", meta.params.slug).authorId } })

// content-block / hero-1
{ "type": "hero", "sourceType": "article", "sourceId": "welcome-post" }

// content-block / hero-2
{ "type": "hero", "sourceType": "product", "sourceId": "featured-item" }

// sourceType에 따라 동적으로 스키마 조회
documents.get("content-block", "hero-1").sourceType == "article"
  ? documents.get("article", documents.get("content-block", "hero-1").sourceId).headline
  : documents.get("product", documents.get("content-block", "hero-1").sourceId).name

// 나쁜 예: 동일한 문서를 두 번 조회
documents.get("author", documents.get("article", "intro").authorId).name + " - " +
documents.get("author", documents.get("article", "intro").authorId).bio

// 더 나은 예: 한 번만 조건 확인
documents.get("article", "intro").authorId != null
  ? documents.get("author", documents.get("article", "intro").authorId).name
  : "Unknown Author"

{
  "name": "greeting",
  "fields": [
    { "name": "code", "type": "string", "required": true },
    { "name": "headline", "type": "string", "required": true },
    { "name": "subheadline", "type": "string" },
    { "name": "ctaText", "type": "string" },
    { "name": "ctaUrl", "type": "string" }
  ]
}

{
  "code": "ko",
  "headline": "Welcome",
  "subheadline": "Welcome to our platform",
  "ctaText": "Get Started",
  "ctaUrl": "/ko/get-started"
}

{
  "code": "en",
  "headline": "Welcome",
  "subheadline": "Welcome to our platform",
  "ctaText": "Get Started",
  "ctaUrl": "/en/get-started"
}

{
  "code": "ja",
  "headline": "Welcome",
  "subheadline": "Welcome to our platform",
  "ctaText": "Start",
  "ctaUrl": "/ja/get-started"
}

  {
    "lang": "language"
  }

documents.get("greeting", meta.params.lang).headline

documents.get("greeting", meta.params.lang).subheadline

documents.get("greeting", meta.params.lang).ctaText

documents.get("greeting", meta.params.lang).ctaUrl

// app/[...slug]/page.tsx
import ParametricRoutePage from 'cms-renderer/lib/renderer';
import { registry } from '@/lib/registry';
import { cmsConfig } from '@/lib/cms-config';

export const dynamic = 'force-static';

interface PageProps {
  params: Promise<{ slug: string[] }>;
}

export default async function Page({ params }: PageProps) {
  const { slug } = await params;

  return (
    <ParametricRoutePage
      registry={registry}
      apiKey={cmsConfig.apiKey}
      websiteId={cmsConfig.websiteId}
      cmsUrl={cmsConfig.cmsUrl}
      params={Promise.resolve({ slug })}
    />
  );
}

interface CelMeta {
  /** Current locale code (e.g., 'en-US') */
  locale: string;
  /** Route parameters extracted from URL */
  params: Record<string, string>;
  /** URL path segments */
  segments: string[];
  /** Current document ID (if editing existing document) */
  docId: string | null;
  /** Current document title */
  title: string;
}

패턴: /{country}/{lang}/products
경로:    /us/en/products

알고리즘:
1. 둘 다 정규화(후행 슬래시 제거)
2. 구간으로 분할: ["us", "en", "products"]와 ["{country}", "{lang}", "products"]
3. 구간 개수가 일치해야 함
4. 각 구간 쌍에 대해:
   - 패턴이 : 또는 {}로 시작하면 매개변수로 추출
   - 그렇지 않으면 정확히 일치해야 함
5. 반환: { country: "us", lang: "en" }

// 간단한 바인딩("code" 필드로 조회)
{ "lang": "language" }

// 세부 바인딩(맞춤 슬러그 필드)
{
  "lang": {
    "schemaName": "language",
    "slugField": "code"
  },
  "slug": {
    "schemaName": "article",
    "slugField": "slug"
  }
}