image
Akan.js
English
Docs (V1)
image
Akan.js
You are viewing the Akan.js v1 docs.Go to the latest v2 docs
Docs (V1)
MIT 라이선스 하에 배포되었습니다.
Akan.js 공식 컨설팅 서비스Akansoft
Copyright © 2026 Akan.js 모든 권리 보유.
시스템 관리자bassman
소개
• 시작하기
• 작동원리
• 실습하기
튜토리얼
• 상세하게 보여주기
• 상태 변경하기
• 서비스 내에서 상호작용
• 슬라이스로 표시하기
• 페이지를 통한 UX
• 스칼라 사용하기
• 인사이트 사용하기
• 데이터 연결하기
시스템 아키텍처
• 개요
• 백엔드 시스템
• 프론트엔드 시스템
• 환경변수
• 기본 스칼라 타입
• 도메인 기반 모듈
• CSS
모듈 규칙
• 개요
• model.constant.ts
• model.dictionary.ts
• model.document.ts
• model.service.ts
• model.signal.ts
• model.store.ts
• Model.Template.tsx
• Model.Unit.tsx
• Model.Util.tsx
• Model.View.tsx
• Model.Zone.tsx
스칼라 규칙
• 개요
• scalar.constant.ts
• scalar.dictionary.ts
• scalar.document.ts
소개
• 시작하기
• 작동원리
• 실습하기
튜토리얼
• 상세하게 보여주기
• 상태 변경하기
• 서비스 내에서 상호작용
• 슬라이스로 표시하기
• 페이지를 통한 UX
• 스칼라 사용하기
• 인사이트 사용하기
• 데이터 연결하기
시스템 아키텍처
• 개요
• 백엔드 시스템
• 프론트엔드 시스템
• 환경변수
• 기본 스칼라 타입
• 도메인 기반 모듈
• CSS
모듈 규칙
• 개요
• model.constant.ts
• model.dictionary.ts
• model.document.ts
• model.service.ts
• model.signal.ts
• model.store.ts
• Model.Template.tsx
• Model.Unit.tsx
• Model.Util.tsx
• Model.View.tsx
• Model.Zone.tsx
스칼라 규칙
• 개요
• scalar.constant.ts
• scalar.dictionary.ts
• scalar.document.ts
Next
시작하기

스칼라 Dictionary

dictionary 파일 (*.dictionary.ts)은 스칼라에 대한 국제화를 제공합니다. scalarDictionary() 빌더 패턴을 사용하여 스칼라 이름, 필드 레이블, 설명 및 enum 값에 대한 번역을 정의합니다.
이 가이드는 scalarDictionary() 문법, 체이닝 메서드 및 번역 정의를 위한 모범 사례를 다룹니다.
🌐주요 이점
  • 엔드투엔드 타입 안전성
  • 플루언트 빌더 패턴
  • 제네릭을 통한 자동 검증
  • 다국어 지원
📁파일 구조

Scalar Dictionary 빌더

scalarDictionary() 함수는 플루언트 빌더 패턴을 사용하여 타입 안전한 dictionary를 생성합니다.
method설명예제
.of((t) => ...)스칼라 이름과 설명을 정의합니다.
.model<T>((t) => ...)필드 번역을 정의합니다.
.enum<T>(name, (t) => ...)Enum 값 번역을 정의합니다.
.of((t) => ...)

스칼라 이름과 설명을 정의합니다.

.model<T>((t) => ...)

필드 번역을 정의합니다.

.enum<T>(name, (t) => ...)

Enum 값 번역을 정의합니다.

번역 형식
각 번역은 언어 순서와 일치하는 값 배열과 함께 t() 함수를 사용합니다.
패턴

번역 형식

각 번역은 값 배열과 함께 t() 함수를 사용합니다. 배열 순서는 scalarDictionary()에서 정의한 언어 순서와 일치합니다.
번역 패턴
메서드목적예시
t([...])레이블/이름 정의t(["Status", "상태"])
.desc([...])설명 정의.desc(["Current status", "현재 상태"])
완전한 국제화 지원을 위해 레이블과 설명 모두 필요합니다.

완전한 예시

price.dictionary.ts

Enum 이름 매칭

.enum()의 첫 번째 인수는 constant 파일의 enumOf()에서 사용된 이름과 일치해야 합니다. 이렇게 하면 적절한 타입 검사와 런타임 해석이 보장됩니다.
constant.ts
dictionary.ts
중요: enum 이름 문자열은 enumOf()의 첫 번째 인수와 정확히 일치해야 합니다. 예: enumOf("journey", [...])는 .enum<Journey>("journey", ...)가 필요합니다.

타입 Import

타입 안전성을 보장하기 위해 항상 constant 파일에서 타입을 import하세요. 제네릭 파라미터는 모든 필드와 enum 값에 번역이 있도록 강제합니다.
Import 패턴
✓
import type: 타입 전용 import에는 'import type'을 사용하세요. 이렇게 하면 런타임 코드가 포함되지 않습니다.
✓
.model<Type>: 필드 이름에 대한 자동완성을 제공하고 모든 필드가 번역되었는지 검증합니다.
✓
.enum<Type>: enum 값에 대한 자동완성을 제공하고 모든 값이 번역되었는지 검증합니다.

흔한 실수

스칼라 dictionary를 정의할 때 다음과 같은 흔한 실수를 피하세요:
문제잘못된 예올바른 예
.desc() 누락t(["Label", "레이블"])t(["Label", "레이블"]).desc(["Desc", "설명"])
잘못된 enum 이름.enum<Journey>("Journey", ...).enum<Journey>("journey", ...)
export 누락const dictionary = ...export const dictionary = ...
잘못된 배열 순서t(["한국어", "English"])t(["English", "한국어"])
필드 누락// TypeScript error모든 필드 정의

모범 사례

✓항상 타입 제네릭 사용
.model<Type>과 .enum<Type>을 사용하여 TypeScript가 모든 필드와 값이 번역되었는지 검증하도록 하세요.
✓일관된 언어 순서
프로젝트의 모든 dictionary에서 항상 같은 언어 순서 (예: ["en", "ko"])를 사용하세요.
✓의미 있는 설명
레이블을 단순 반복하지 말고 필드의 목적을 설명하는 유용한 설명을 제공하세요.
✓'dictionary'로 Export
프레임워크의 자동 import 시스템과의 일관성을 위해 표준 export 이름 'dictionary'를 사용하세요.

구현 체크리스트

  • 파일 위치: __scalar/<name>/<name>.dictionary.ts
  • '@akanjs/dictionary'에서 scalarDictionary import
  • 'import type'을 사용하여 constant 파일에서 타입 import
  • 올바른 언어 순서로 초기화: ["en", "ko"]
  • .of()로 스칼라 이름/설명 정의
  • .model<Type>()로 모든 필드 번역 정의
  • .enum<Type>(name)으로 모든 enum 번역 정의
  • enum 이름이 enumOf() 이름과 일치하는지 확인
  • 모든 항목에 레이블과 설명 모두 포함
  • 'dictionary'로 export
💡 프로 팁:
  • • TypeScript는 필드나 enum 값을 누락하면 오류를 표시합니다 - 이를 활용하세요!
  • • dictionary는 UI 레이블, 폼 유효성 검사 메시지, API 문서에 사용됩니다
  • • 설명은 간결하지만 유익하게 - 툴팁과 도움말 텍스트에 표시됩니다
스칼라 Dictionary
Scalar Dictionary 빌더
번역 형식
완전한 예시
Enum 이름 매칭
타입 Import
흔한 실수
모범 사례
구현 체크리스트