- 프로젝트 설명 (r3f, cannon)
- use-cannon 라이브러리 소개
- leva 라이브러리 소개
- 물리 엔진 기본 1편 (useBox, useShpere, useCylinder, usePlane )
- 물리 엔진 기본 2편 (useTrimesh, useConvexPolyhedron )
- 물리 엔진을 가진 자동차의 바디 만들기 (useBox)
- 물리 엔진을 가진 바퀴 만들기 (useCompoundBody)
- 키보드를 통한 바퀴 제어 로직 만들기
- 물리엔진 Static, Kinematic, Dynamic 이해하기
- useBox, useSphere로 충돌체 만들기 구체, 박스 (Dynamic)
- 벽과 고정체 만들기 (Static)
- 자동차를 따라다니는 카메라 만들기 (useThree)
- gltfjsx로 소개 및 glb 파일을 jsx로 변환하기
- 자동차 바디 glb 모델로 적용하기
- 자동차 바퀴 glb 모델로 적용하기
- 충돌 모델 glb 모델로 적용하기
- Text 3D 모델 넣기
- recoil 전역값 관리 학습
- 페이지 진입시 인 모션 만들기
- 물체 충돌 UI 팝업 생성
- 물체 충돌시 물체 회전 (간판 회전)
- 물체 마우스 클릭시 페이지 이동
- 특정 지역 진입시 이벤트 발생
- 특정 지역 진입시 이벤트2 발생
- FPS 개념과 확인(stats)
- 최적화 알아보기 (DrawCall)
- Json 폰트 최적화
- Webp로 텍스처 압축
- 모델 최적화 (glb, Draco 압축)
[완성본 링크] - (https://mr-chu-car-web.netlify.app/)