react-three-fiber(리액트로 구현하는 3D...Animation?), codeSandBox

https://theubermensch.tistory.com/191

[React/Three] 처음 만나는 three.js (2)

 

 

대단한 걸 찾았다... 

 

요즘 CodeSandbox라는 곳에서 온라인으로 작업환경을 설정할 수 있다는 걸 알고 신나하던 참이다. 

 

여기서 다른 사람들이 만든 리액트 코드들을 구경할 수 있는데 .. . .

디자인적으로 디게 독창적인 코드를 봐서 어떻게 하는 것인지 궁금했다. 

 

https://codesandbox.io/s/youthful-voice-y3j31r13zz?file=/src/index.js 

glitch, react-three-fiber + react-spring - CodeSandbox

 

 

디펜던시를 보니깐 react-three-fiber라는 게 있엇너 구글링 해보았따. 

 

 

https://docs.pmnd.rs/react-three-fiber/getting-started/your-first-scene

React Three Fiber Documentation

이것은 react-three-fiber의 공식 문서이다. 

아마도 이것은 three.js를 다루는 방법을 말하고 있는 듯... three.js를 사용하는 데에 원활하도록 도와주는 디펜던시인 듯 하다. 

더 찾아보니 three.js를 리액트 문법으로 다룰 수 있도록 도와준다고 한다. 

 

 

https://threejs.org/docs/index.html#manual/en/introduction/Creating-a-scene

three.js docs

 

three.js의 문서를 보았다... 

 

 

 

 

요런 인터랙티브한 디자인을 예전부터 꿈꾸고 있었다. ..

이것을 위해선 WebGL을 알아야 한다고 한다. 

https://velog.io/@mael1657/React-Three.js%EB%A5%BC-%EC%A0%81%EC%9A%A9%ED%95%B4%EB%B3%B4%EC%9E%90

[React] Three.js를 적용해보자.