개발 개발

보호되어 있는 글입니다.

public interface MemberRepository { Member save(Member member); Optional findById(Long id); Optional findByName(String name); List findAll(); } Member라는 객체를 저장할 수 있는 MemberRepository라는 객체를 만들고 그 작동을 테스트 하려고 한다. MemberRepository의 인터페이스는 위와 같이 새 멤버를 저장할 수 있는 save 멤버를 아이디별로 찾을 수 있는 findById 멤버를 이름별로 찾을 수 있는 findByName 모든 멤버들의 리스트를 반환하는 findAll 로 이루어진다. 여기서 Member를 domain, MemberRepository를 reposito..

오늘 배운 것들 Geometry의 정점 좌표를 조작하여 이글거리는 태양 표면 만들기 태양 만들기 표면이 불규칙적으로 일렁이며 움직이는 구체를 만들기 위해서는 구체의 각 정점의 좌표를 랜덤하게 바꿔주는 것이 필요하다. 또한 위와 같은 불균일한 표면을 만들기 위해서 각 정점의 좌표를 처음부터 랜덤하게 설정하는 것도 필요하다. 즉, 초기 상태에서 표면 정점의 좌표들 좌표 변화량 을 모두 랜덤하게 설정해주는 것이 필요하다. const geometry = new THREE.SphereGeometry(5, 64, 64); const material = new THREE.MeshStandardMaterial({ color: 'orangered', side: THREE.DoubleSide, flatShading: tr..

[오늘 배운 것들] mesh 이동하기 mesh 크기 조정하기 mesh 회전하기 Scene Graph: 그룹 만들기 이동하기 mesh.position.x = 2; mesh의 position 속성을 변화시킴으로써 물체를 이동시킬 수 있다. mesh.position.set(1,1,1); set을 통해 x, y, z 좌표 한 번에 변화시킬 수 있다. console.log(mesh.position.length()); console.log(mesh.position.distanceTo(new THREE.Vector3(1.5,1.5,1.5))); mesh.position에는 length와 distanceTo 함수가 있는데 각각 현재 위치에서 원점과의 거리(length), 인자로 받은 벡터와의 거리(distanceTo)..

오늘 배운 것들 greensock 라이브러리를 이용한 애니메이션 구현 축, 그리드 헬퍼 FPS 체크하기 GUI 컨트롤 도구 Greensock 라이브러리를 이용한 애니메이션 구현 https://greensock.com/ GreenSock GSAP is an industry standard JavaScript animation library from GreenSock that lets you craft high-performance animations that work in every major browser. greensock.com npm i gsap 을 이용하여 설치할 수 있는 이 라이브러리는, 애니메이션을 구현할 때 제일 많이 쓰이는 자바스크립트 라이브러리다. //gsap animation gsap...

오늘 배운 것들 애니메이션 기본(requestAnimationFrame, setAnimationLoop) 성능 보정(clock을 이용한 디바이스 별 성능 격차 보정, JavaScript Date.now를 사용한 성능 격차 보정) 안개 애니메이션 기본 window.requestAnimationFrame(draw); renderer.setAnimationLoop(draw); //작동이 똑같음 but AI, VR 컨텐츠 할때는 이거를 사용해야 한다. requestAnimationFrame과 setAnimationLoop 모두 리페인트를 한다. (프레임을 새로 그린다...?) 재귀함수식으로 draw 함수를 만들고 그 안에 저 코드를 넣으면 프레임이 계속 갱신되면서 자연스러운 애니메이션을 만들 수 있게 된다. m..

[인프런 1분코딩님의 강의 공부 기록입니다.] 기본 요소 비단 Three.js가 아니더라도 3D의 기본 요소에는 다음과 같은 것들이 있다. Scene : 장면/무대. 모든 것은 씬 위에 올라간다. 생성 const scene = new THREE.Scene(); 요소 추가 //mesh 추가 scene.add(mesh); //camera 추가 scene.add(camera); //light 추가 scene.add(light); //...etc 이렇게 생성한 요소들을 씬에 추가하면 된다. Mesh : 표현되는 모든 물체. 모양을 나타내는 Geometry와 재질을 나타내는 Material로 구성된다. const mesh = new THREE.Mesh(geometry, material); 두 요소를 파라미터로 넣..