[Three.js] 개발환경구성 해보기

이런것들을 해보고싶다.

SDU - Future Education

 

Faraday Future - FF 91 VR

---

1. Visual Studio Code (최신버전 받아줌)

https://code.visualstudio.com/

Visual Studio Code - Code Editing. Redefined

---

2. Three.js 라이브러리 다운로드

1) 그냥 다운로드 하는 방식

https://threejs.org/             =>  download링크 클릭 

Three.js – JavaScript 3D Library

압축폴더

three.js-master > build

 

three.js : 일반적인 라이브러리

three.min.js : 압축버전

three.module.js : 모듈방식으로 개발할 수 있는 라이브러리 => 이걸 사용할 거임. 

 

three.js-master > examples (예제들도 많이 있음)

CDN 방식으로 불러오는 법?

<script type="module">

  // Find the latest version by visiting https://cdn.skypack.dev/three.

  import * as THREE from 'https://cdn.skypack.dev/three@<version>';

  const scene = new THREE.Scene();

</script>

 

2) npm으로 다운로드 (node.js 먼저 설치하는건 기본)

three.js docs

npm install --save three

 

3) boilerplate 사용 

GitHub - aakatev/three-js-webpack: Boilerplate for Three JS project

요고 사용. 폴더 하나 만들어서 터미널에서 아래와 같이 쳐주자.

git clone https://github.com/aakatev/three-js-webpack.git

npm i
npm run start