react-three-fiber(리액트로 구현하는 3D...Animation?), codeSandBox
https://theubermensch.tistory.com/191
[React/Three] 처음 만나는 three.js (2)
목표 점검하기 처음 만나는 three.js (1)에서 three.js 에 대한 아주 기초적인 이해를 마쳤다. 이번에는 react-three-fiber 에 대해 아주 간단하게 알아보고( three.js 를 react 에서 어떻게 JSX로 작성하는지 알.
theubermensch.tistory.com
대단한 걸 찾았다...
요즘 CodeSandbox라는 곳에서 온라인으로 작업환경을 설정할 수 있다는 걸 알고 신나하던 참이다.
여기서 다른 사람들이 만든 리액트 코드들을 구경할 수 있는데 .. . .
디자인적으로 디게 독창적인 코드를 봐서 어떻게 하는 것인지 궁금했다.
https://codesandbox.io/s/youthful-voice-y3j31r13zz?file=/src/index.js
glitch, react-three-fiber + react-spring - CodeSandbox
glitch, react-three-fiber + react-spring by drcmda using react, react-dom, react-scripts, react-spring, react-three-fiber, three
codesandbox.io
디펜던시를 보니깐 react-three-fiber라는 게 있엇너 구글링 해보았따.
https://docs.pmnd.rs/react-three-fiber/getting-started/your-first-scene
React Three Fiber Documentation
React-three-fiber is a React renderer for three.js
docs.pmnd.rs
이것은 react-three-fiber의 공식 문서이다.
아마도 이것은 three.js를 다루는 방법을 말하고 있는 듯... three.js를 사용하는 데에 원활하도록 도와주는 디펜던시인 듯 하다.
더 찾아보니 three.js를 리액트 문법으로 다룰 수 있도록 도와준다고 한다.
https://threejs.org/docs/index.html#manual/en/introduction/Creating-a-scene
three.js docs
threejs.org
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를 적용해보자.
Three.js 리액트를 이용해 포트폴리오 사이트를 만들던 중 문제에 봉착했다. HTML, CSS, JS 만으로 인터랙티브한 웹을 만드는게 너무 어려워! 그래서 Awwwards 사이트를 구경해보니 많은 웹페이지들이 We
velog.io