TypeScript를 활용한 3D 애플리케이션 구성 파일 설계 가이드

3D 애플리케이션을 개발하는 과정에서 효과적인 구성 파일 시스템을 설계하는 것은 상당히 까다로운 작업입니다. 특히, CesiumJS 라이브러리를 기반으로 한 NGV 프레임워크를 개발하면서 고려해야 할 여러 과제가 있습니다. 이번 포스트에서는 JSON과 TypeScript를 활용하여 구성 파일을 설계하는 방법과 그 장점을 소개합니다.

1. JSON의 한계

JSON은 간단하고 유연한 데이터 포맷으로 널리 사용되지만, 타입 정보를 포함하지 못하는 한계가 있습니다. JSON 스키마 파일을 추가적으로 사용해 타입을 정의할 수는 있지만, 추가 도구(예: typescript-json-schema 또는 ts-json-schema-generator)가 필요하며, 이는 표준화되지 않았습니다.

2. TypeScript를 구성 파일로 활용

TypeScript를 사용하면 JSON 파일을 작성하듯이 타입이 명시된 구성 파일을 만들 수 있습니다. 아래는 TypeScript로 작성된 구성 파일 예제입니다:

typescript
import type { IPermitsConfig } from './ingv-config-permits.js';

export const config: IPermitsConfig = {
  languages: ['de', 'fr', 'en', 'it'],
  app: {
    cesiumContext: {
      catalogs: {
        '@demo': '../../catalogs/demoCatalog.json',
        '@cesium': '../../catalogs/cesiumCatalog.json',
        '@geoadmin': '../../catalogs/geoadminCatalog.json',
      },
      layers: {
        models: ['@demo/sofa', '@demo/thatopensmall'],
        imageries: ['@geoadmin/pixel-karte-farbe'],
      },
      camera: {
        position: [6.628484, 46.5, 100],
        orientation: {
          heading: 0,
          pitch: -30.0,
        },
      },
      widgetOptions: {
        scene3DOnly: true,
      },
      globeOptions: {
        depthTestAgainstTerrain: true,
      },
    },
  },
};

이 코드는 JSON과 달리 TypeScript 타입 시스템의 이점을 활용해 안전하고 유지보수가 쉬운 구성을 제공합니다.

3. TypeScript의 장점

• 타입 안정성: TypeScript는 컴파일 타임에 타입 검사를 수행하므로, 잘못된 데이터 구조를 사전에 방지할 수 있습니다.
• 동적 확장성: JSON은 단순한 데이터 구조에 국한되지만, TypeScript는 함수나 동적 데이터를 포함한 복잡한 구조를 지원합니다.
• 코드 재사용성: TypeScript를 사용하면 구성 요소를 모듈화하고 재사용하기 쉬워집니다.

4. CesiumJS와의 통합

CesiumJS를 기반으로 애플리케이션을 개발할 때, TypeScript를 사용하면 CesiumJS의 변경 사항을 쉽게 감지하고 대응할 수 있습니다. 예를 들어, 카메라 위치, 레이어 설정, 위젯 옵션 등을 TypeScript로 정의하면 CesiumJS의 업데이트에 따른 문제를 최소화할 수 있습니다.

결론

TypeScript를 사용해 구성 파일을 작성하면 단순히 JSON을 사용하는 것보다 더 안정적이고 유연한 설계가 가능합니다. 특히 3D 애플리케이션처럼 복잡한 시스템에서는 이러한 접근 방식이 큰 장점을 제공합니다. TypeScript를 활용해 프로젝트의 생산성과 유지보수성을 높여보세요!