/users
/posts
/slides
/apps
/books
mysetting
/users
/posts
/slides
/apps
/books
1:33 5/31
velog.io
1:33
velog.io
(งᐖ)ว
https://velog.io/@hyounglee
(~˘▾˘)~♫❝ 쉽게만 살아가면 재미없어 빙고 .ᐟ ❞•*¨*•.¸¸♪
저작도구: velog
최종 피드 수집: 2025-04-29 07:45
전체 (37)
24d
TIL 121 | Three.js 기본 - Shadows 2
SpotLight
Three.js에서 SpotLight (스포트라이트)를 설정하고, 그림자(shadow)를 생성하며, Helper로 시각화까지 하는 예제
// Spotlight
const spotLight = new THREE.S
0
0
0
읽기모드
24d
TIL 120 | Three.js 기본 - Shadows 1
Shadow Map
Shadow Map은 3D 그래픽에서 그림자(Shadow)를 표현하기 위한 핵심 기법 중 하나다.
⸻
Shadow Map이란?
Shadow Map은 카메라가 아닌 빛(Light)의 시점에서 본 장면의 깊이 정보
0
0
0
읽기모드
1M
TIL 119 | Three.js 기본 - Light
Three.js에서 Light(조명)은 3D 씬(Scene) 내에서 객체의 조명과 그림자를 결정하는 중요한 요소입니다. 조명을 사용하면 입체감, 반사, 그림자, 분위기 효과를 조정할 수 있습니다.
AmbientLight (주변광)
0
0
0
읽기모드
1M
TIL 118 | Three.js 기초 - 3D Text
TextGeometry
TextGeometry는 Three.js에서 3D 텍스트를 생성하는 데 사용되는 기하학적 형상(Geometry)입니다. 일반적인 2D 텍스트가 아닌 3D 입체 문자를 생성할 수 있으며, 다른 Mesh 객체처
0
0
0
읽기모드
1M
TIL 117 | Three.js 기초 - Materials
Three.js에서 Material은 3D 객체의 표면을 렌더링하는 방법을 정의하는 중요한 요소입니다. 각 Material은 빛과 상호 작용하는 방식, 색상, 반사율, 투명도 등의 속성을 결정합니다. Three.js에서는 다양한
0
0
0
읽기모드
1M
TIL 116 | Three.js 기초 - Textures
개체에 텍스쳐를 입혀보자!
Three.js에서 텍스쳐는 PBR원리를 따른다. PBR이란, 물리 기반 렌더링(Physically Based Rendering)을 의미한다. 이는 실제 현실의 물리 법칙을 따른다는 것을 의미한다. 빛
0
0
0
읽기모드
1M
TIL 115 | Three.js 기초 - Debug UI
Debug UI
While you can create your own debug UI using HTML / CSS / JS, there are already multiple libraries:
dat.GUI
lil-gui <-
0
0
1
읽기모드
1M
TIL 114 | Three.js 기초 - Geometries
Geometries
정점(vertices)와 면으로 이루어진 요소들
particles은 vertices의 꼭지점을 의미한다.
Built-in Geometry
translate(), rotateX(), normalize() 와 같은
0
0
0
읽기모드
1M
TIL 113 | Three.js 기초 - 카메라 & 스크린 사이즈
Cameras
PerspectiveCamera
/*
* 1st Param : Field of View(시야 또는 화각)
* 2nd Param : Aspect Ratio(화면비)
* 3nd Param : 화면에 나타나는 최소
0
0
0
읽기모드
1M
TIL 112 | Three.js 기초 - 애니메이션
여러 이미지, 즉 프레임을 연속적으로 보여주면 마치 애니메이션을 보는 것과 같이 동작한다.
이러한 착각을 만들어 내기 위해 사용할 수 있는 메서드를 알아보자.
requestAnimationFrame
이 함수 자체가 애니메이션을 동
0
0
0
읽기모드
1M
TIL 111 | Three.js 기초 - 위치, 크기, 회전
1. Basics
import * as THREE from 'three'
// Canvas
const canvas = document.querySelector('canvas.webgl')
// Scene
const scene =
0
0
0
읽기모드
2y
콘솔에 찍고 싶은 아스키아트 모음
⚠ 관종 개발자는 콘솔에 자아표출을 한다
아스키아트
오로지 텍스트와 특수문자만을 조합하여 사진이나 그림을 흉내내는 것을 말한다.
텍스트로만 이루어진 밈들 대부분이 그렇듯 처음 시작이 누구였는지는 아무도 모른다. 줄여서 AA라고도
0
0
0
읽기모드
2y
2022 회고
2022 신년계획 review
일(work)이 곧 나라는 생각 바꾸기 ✓
당장 할 수 있는 것에 집중하기 ✓
재태크 공부 꾸준히 하기
수동적인 인간관계를 정리하고 새로운 사람들을 만나기 ✓
취미를 갖기 ✓
3대 150 ✓
배달음식
0
0
0
읽기모드
2y
있어보는 Web을 위한 타이포그라피 10
필자는 시각디자인과를 졸업한 프론트엔드 개발자입니다. 디자이너 출신으로서 웹에서 디자인적 완성도를 높이는 가장 핵심은 타이포그래피라고 생각합니다. 웹에서 제공되는 정보의 대부분은 문어(written language)의 형태로 되어
0
0
0
읽기모드
2y
DJBB 프로젝트 하면서 참고했던 링크들
쌓여있는 크롬탭 정리하면서 다음 사이드 때 참고하려고 정리하는 소중한 링크들
구글링하는 시간 절대 지켜!!~!
DJBB 프로젝트 회고 🔗
서버
[NodeJS] 한시간만에 Node.js 백엔드 기초 끝내기 (ft. API 구축)
0
0
0
읽기모드
2y
프론트엔드 개발자를 UXUI 디자인 기초
UI/UX design fundamentals for the front end developers
위 아티클을 번역하고 이해를 돕기 위한 내용을 추가하였습니다.
UX (User Experience)
쉽게 말해 사용자 경험을 의
0
0
0
읽기모드
2y
프론트엔드 개발자가 디자인, 서버까지 다 해 본 썰 푼다.
>>> DJ블랙버니 <<<
새해에 처음 들은 음악이 그 해를 결정한다는 그런 이야기 들어보셨나요?
그래서 만들어봤습니다! 친구와 지인의 행복한 새해를 위해 음악과 함께 메세지를 보낼 수 있는 service~~!
예쁜 카드도 직접
0
0
0
읽기모드
4y
사수에게 칭찬받는 PR 체크리스트
한번 리뷰 받은 내용은 두번 다시 실수하지 말자!
사수한테 칭찬받고 싶은 신입 ESFJ 개발자의 기록
!youtube[UUJKiTcnGK0]
한줄로 짤 코드를 누가 열줄로 해놨어요...
클래스 구구... 코테에서 한줄로 푼다면 우
0
0
0
읽기모드
4y
TIL 109 | 브라우저의 동작 원리
NAVER D2 | 브라우저는 어떻게 동작하는가?
HTML Critical rendering path의 이해
브라우저의 주요 기능
브라우저는 사용자가 선택한 자원을 서버에 요청하고 브라우저에 표시한다. 자원은 보통 HTML 문서지
0
0
0
읽기모드
4y
TIL 108 | AJAX
참고자료
https://github.com/baeharam/Must-Know-About-Frontend/blob/master/Notes/javascript/ajax.md
https://coding-factory.tistory.co
0
0
0
읽기모드
About
Badge
Contact
Activity
Terms of service
Privacy Policy