pmndrs/gltfjsx

개요 GLTF 3D 모델을 JSX 컴포넌트로 변환하는 CLI 도구다. 5,700+ stars를 보유한 R3F 생태계 도구로, GLTF 파일을 분석해 React Three Fiber에서 바로 사용할 수 있는 JSX 코드를 자동 생성한다.

핵심 내용 `npx gltfjsx model.glb` 명령 하나로 GLTF 파일의 메시, 재질, 애니메이션을 React 컴포넌트로 변환한다. 생성된 컴포넌트에서 개별 메시를 props나 ref로 직접 제어하고 재질을 교체하거나 애니메이션을 트리거할 수 있다.

기존 대비 차별점 기존에는 GLTF 모델을 통째로 로드하면 내부 구조를 직접 탐색해야 했다. gltfjsx는 모델 구조를 분석해 각 메시가 React 컴포넌트로 분리된 코드를 생성해 3D 모델의 특정 부분을 독립적으로 제어하기 쉽다.

활용 가능성 R3F 기반 3D 제품 설정기, 인터랙티브 캐릭터 애니메이션, 3D 씬 조립 등 GLTF 모델을 세밀하게 제어하는 프로젝트에서 개발 생산성을 높이는 데 활용할 수 있다.

참고 자료 - 원본