기본 사용법#

VRISM Viewer SDK의 기본 사용법을 단계별로 익혀보세요. React와 Vanilla JavaScript 두 가지 환경에서 모두 사용할 수 있습니다.

🚀 시작하기#

VRISM Viewer SDK는 두 가지 방식으로 사용할 수 있습니다:

React 환경#

React 애플리케이션에서 컴포넌트로 사용하는 방식입니다.

특징:

• JSX 문법으로 간단하게 사용
• TypeScript 지원
• React 생태계와 완벽 호환
• 자동 리렌더링 및 상태 관리

적합한 경우:

• React/Next.js 프로젝트
• TypeScript 사용
• 컴포넌트 기반 개발

Vanilla JavaScript 환경#

순수 JavaScript 환경에서 사용하는 방식입니다.

특징:

• HTML에 직접 삽입 가능
• CDN으로 간단한 설치
• 가벼운 번들 크기

적합한 경우:

• 기존 웹사이트에 통합
• React를 사용하지 않는 프로젝트
• 빠른 프로토타이핑

📚 학습 가이드#

각 환경별로 4단계의 체계적인 가이드를 제공합니다:

1단계: 뷰어 띄우기#

• 최소 설정으로 뷰어 표시
• 컨테이너 스타일링
• 기본 속성 설정

2단계: 옵션 설정하기#

• UI 요소 제어
• 카메라 초기 설정
• 스텝 기능 설정

3단계: 이벤트 처리하기#

• 로딩 상태 처리
• 스텝 변경 감지
• 에러 처리

4단계: 뷰어 제어하기#

• ref를 통한 뷰어 제어
• 3D 위치 선택 기능
• 동적 설정 변경

각 환경별 기본 사용법#

• React 사용자 - React 환경에 적용할 경우
• Vanilla Javascript 사용자 - Vanilla JavaScript 환경에 적용할 경우

🎯 다음 단계#

기본 사용법을 익혔다면:

• 커스터마이징 - CSS Variables로 더 세밀한 스타일링
• API 참조 - 전체 API 문서
• 사용 예제 - 실제 프로젝트 예제
• 자주 묻는 질문 - 일반적인 문제 해결책

이제 원하는 환경의 가이드를 선택하여 시작하세요!