image
Akan.js
(v1)
Docs (V1)
English
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
흔한 실수
모범 사례
구현 체크리스트