목록분류 전체보기 (64)

SG의 개발 공부로그

React Three Fiber로 mesh 추가, group 하기 [Three.js 비교]

일단 먼저 Three.js 에서 추가하는 방법을 보자 Three.js 에서의 Mesh 추가 const geometry = new BoxGeometry(2, 2, 2); const material = new MeshStandardMaterial() const cube = new Mesh(geometry, material) scene.add(cube) BoxGeometry , MeshStandardMaterial 도 변수에 담아서 Mesh( geometry(기하학), material(재질) ) 을 넣으면서 인스턴스화한다. 그리고 scene 에 추가한다. React Three Fiber 에서의 Mesh 추가 import { Canvas } from "@react-three/fiber"; export defau..
R3F 2023. 1. 8. 20:32
React Three Fiber 로 canvas 셋팅하기 [Three.js 비교]

React에서 three.js 사용하는 방법 최근 3D 웹을 구현하고 싶어서 Three.js를 접하고 배우면서 궁금점이 생겼다. Three.js를 react에서 사용하고 싶은데 방법이 어떻게 될까? React Three Fiber 활용하는 것이다. 하지만 three.js 와 사용방법이 완전히 다르다 또 다르지만, React Three fiber는 Threejs를 기반으로 하기 때문에 하기 위에서는 Three.js 를 먼저 알아야 된다. React Three Fiber를 이해하기 가장 좋은 방법은 Three.js 라이브러리와 비교하면서 어떤 일이 일어나는지 보는 것이라고 생각이 들었다. three.js 프로젝트와 React Three Fiber를 둘을 함께 작업하면서 간단하게 사용법을 비교해보기로 했다. ..
R3F 2023. 1. 8. 18:59
for in 과 for of 반복문 차이점

일반적으로 자주 쓰는 for 반복문 for (let i = 0; i < 10; i++){ console.log(i); // 0~9까지 출력 } 하지만 이번글은 ES6 에 나온 새로운 반복문 for of 와 for in 문을 알아볼거다. 차이점 for in 과 for of는 반복이 가능한 객체의 모든 원소를 하나씩 추출하여 변수에 담아 반복문을 수행하는 문법. 이둘은 반복하는 대상에 차이점이 있다. for in 반복 대상 Iterable object이면 모두 반복할 수 있는 대상이 됩니다. for of 반복 대상 Iterable object이지만, prototype chain에 의한 Iterable은 반복 대상에서 제외됩니다. 그리고 변수의 값이 다르다 for in 변수 값 arr 배열의 각 원소를 임시 ..
JavaScript 2023. 1. 6. 14:17
배열의 평균값 [프로그래머스 코딩테스트]

배열의 평균값 문제 설명 정수 배열 numbers가 매개변수로 주어집니다. numbers의 원소의 평균값을 return하도록 solution 함수를 완성해주세요. 제한사항 0 ≤ numbers의 원소 ≤ 1,000 1 ≤ numbers의 길이 ≤ 100 정답의 소수 부분이 .0 또는 .5인 경우만 입력으로 주어집니다. 입출력 예 numbers result [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] 5.5 [89, 90, 91, 92, 93, 94, 95, 96, 97, 98, 99] 94.0 입출력 예 설명 입출력 예 #1 numbers의 원소들의 평균 값은 5.5입니다. 입출력 예 #2 numbers의 원소들의 평균 값은 94.0입니다. 풀이 for 문을 이용해서 변수에 배열들을 합산하고..
CodingTest 2023. 1. 6. 12:53
이전 Prev 1 ··· 10 11 12 13 14 15 16 Next 다음