GitHubCreative Dev & WebGLidea-techcode

pmndrs/drei

pmndrs·@pmndrs·Aug 16, 2021

개요 react-three-fiber를 위한 유용한 헬퍼 모음이다. 9,500+ stars를 보유한 R3F 생태계의 필수 라이브러리로, 자주 사용되는 3D UI 패턴을 재사용 가능한 컴포넌트와 훅으로 제공한다.

핵심 내용 OrbitControls, PerspectiveCamera, Stars, Sky, Environment, Text, Billboard, Html 등 수백 개의 유틸리티 컴포넌트를 제공한다. 로딩 헬퍼(useGLTF, useTexture), 쉐이더 유틸, 포스트프로세싱 이펙트, 성능 최적화 도구 등 R3F 개발에 필요한 거의 모든 빌딩 블록을 갖추고 있다.

기존 대비 차별점 Three.js의 강력한 기능을 매번 처음부터 구현하는 대신, drei의 추상화된 컴포넌트로 선언적으로 구성할 수 있다. R3F + drei 조합으로 복잡한 3D 씬을 React 컴포넌트 방식으로 빠르게 구축할 수 있다.

활용 가능성 R3F 기반 3D 웹 앱에서 카메라 컨트롤, 환경 맵, 텍스트 레이블, HTML 오버레이, 3D 모델 로딩 등 반복적인 구현을 단순화하는 데 활용할 수 있다.

참고 자료 - 원본

JavaScript9,529helpershooksreactreact-three-fiberthreejs
#react-three-fiber#threejs#helpers#hooks#3d

Related in Creative Dev & WebGL