Progamming/ReactJS (3) 썸네일형 리스트형 [R3F] Canvas에 상자 그리기 (TIL) import { Canvas } from "@react-three/fiber"; export const App = ({ position = [-1, 0, 2.5], fov = 25 }) => ( ); function Shirt() { return ( ); } 추가 해주면 빙글빙글 돌릴 수 있다 import { Canvas } from "@react-three/fiber"; import { OrbitControls, Center } from "@react-three/drei"; export const App = ({ position = [-1, 0, 2.5], fov = 25 }) => ( ); function Shirt() { return ( ); } [R3F] 쉽게 이해하는 Three.js (TIL) 범람하는 프론트엔드 기술들 덕에 사용자 경험이 우수하고, 흥미로운 사이트들이 늘어나고 있다. 단순히 컴포넌트를 배치하는 UI에서 사용자가 흥미를 느끼고, 좀 더 오래 사이트에 머물 수 있도록 하는 인터렉티브한 요소들들이 가미되고 있어 향후 프론트엔드 기술을 익히는데 3D 작업과 친해질 필요가 있다고 느꼈다. - Three.js 일전에 직장에서 화면 작업을 하면서 구현이 어려운 부분을 Canvas로 그려 본 적이 있어 Three.js에 대해 어렴풋이 알게 되었다. 처음에는 그림판처럼 평면 위에 그림을 그리는 것에 가깝다고 생각했는데, 사실 카메라로 찍은 무언가를 보는 것에 가깝다. Three.js가 구현하는 3D환경에서는 장면이되는 Scene과 그걸 담아내는 Camera, 마지막으로 카메라가 담은 장면(S.. [coderbyte /easy] React Button Toggle 이직을 준비하며 몇몇 회사의 코딩테스트를 보게 되었는데 그동안 코딩테스트를 준비해 본 적이 없다보니 생소한 사이트를 많이 알게 되었다. 당장 내일까지 코딩해야 하는데 오늘 처음 알게 된 coderbyte 알고리즘 문제 말고도 구현 하는 문제들이 있어서 그동안 봤던 사이트들하고는 또 다른 느낌이었다. 어떤 느낌일까 궁금해서 풀어본 첫 문제 문제 : We provided some simple React template code. Your goal is to modify the component so that you can properly toggle the button to switch between an ON state and an OFF state. When the button is on and it i.. 이전 1 다음
