분류 전체보기336 [Archi-play] Feb 2026 프로젝트 세팅 (1/25)1. 기술 스택pnpmNext.js vs. vite https://www.linkedin.com/pulse/vite-vs-nextjs-which-should-you-pick-your-next-project-8jphf/React 19TypescriptThree.jsCSS : Tailwind디자인 라이브러리 : chakra UIstate management : recoil src│ ├── App.css│ ├── App.tsx│ ├── assets│ │ ├── react.svg│ │ └── texture│ │ └── grass.jpg│ ├── components│ │ ├── render-view│ │ │ ├── player... 2026. 3. 1. [Three.js] 2D 타일 배치하기 Three.js는 3D 라이브러리이지만, 카메라 깊이 방향의 한 축을 고정하면 2D 처럼 구현할 수 있다. png asset은 여기에서 구했다.https://kenney.nl/starter-kits Starter Kits · Kenney kenney.nl 그 와중에 내가 겪은 이슈.. canvas : 800 x 800 pxmapData : 10 x 10 2차원 행렬tile size : 80 x 80 px 그럼 캔버스에 꽉차게 타일이 배치되어야하는데 상단에 까맣게 빈 공간이 존재했다. 의도적으로 타일 텍스쳐를 렌더링하지않고 빵꾸냈을 때 정사각형 타일이 아니라 약간 직사각형인걸 볼 수 있다. 하지만 콘솔 로그를 찍어보면 타일 geometry 크기는 80 x 80인걸 확인할 수 있었다. // 카메라 위치.. 2026. 2. 23. [Three.js] userData 대신 클래스 상속하기 - 구현할 기능클릭 이벤트를 통해📍Pin mesh 를 화면에 추가하고, 이를 클릭했을때는 Ray caster로 intersect된 node 중 pin mesh를 찾아서 selected pin 설정하기 - 초기 구현 방식userData.pinId를 추가해 핀 여부를 판단intersect 결과에서 userData 기반으로 selected pin 결정 - 문제점userData를 추가한 사람 외에는 어떤 속성값이, 어떤 목적으로 들어가있는지 알 수 없음 : 협업 시 추적성과 가독성 저하객체의 역할이 코드에 드러나지 않음 타입 시스템으로 추적하기 어려움 - 설계 변경 PinMesh extends THREE.Mesh { id : string; constructor(id:string){ .. 2026. 1. 30. .gitattributes 와 바이너리 파일 새로운 기능을 구현하기 위해 .glb 파일을 로드해 렌더링 하는데 어느 순간 loader 에러가 발생했다. Draco 인코딩과 KTX2 인코딩하여 압축한 glb 파일을 클라이언트에서 디코딩하여 렌더링하는 코드에서 에러가 발생하고 있었다.잠깐 찾아보니 Draco는 geometry를 압축하여 전송 크기를 감소하고, KTX2는 텍스쳐를 압축하여 GPU 메모리와 성능을 최적화하기 위함 이라고 한다. import * as THREE from 'three';import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader';import { .. 2026. 1. 30. [2026] 월간 프로젝트 계획 크든 작든 미니 프로젝트 1개씩 진행하기만들고 싶은거 생길때마다 포스팅 업데이트 ✨ 1월기술 스택 정하기아키텍쳐 고민 2월3D 건축물 뷰어 사이트 만들기 (feat. Three.js)Three.js 직접 사용하고 익숙해지기 3월2D 게임 형식 추가하기 -> 월드맵 개념으로 (아래 링크 참조)W Concept 테크 블로그 4월웹소켓 채팅 구현 5월 2~4월 까지 계획을 쓰고나니까 헐 재밌겠다 !! 하는 생각이 든다 ㅎㅎㅎ 원래는 각자 개별 프로젝트라고 생각했는데 한 개의 프로젝트로 구현이 가능할 것 같다.규모가 커질걸 생각하면 아키텍쳐도 잘 분리해봐야겠다 2026. 1. 19. 2025년 12월 회고 (W49 ~ W52) 📔12월 회고12월 초에 출시를 하고, QA 이슈를 처리하고, 그 외 여러 가지 버그와 UI 를 고치며 한 달을 보냈다. 끊임없이 고쳐야 할 것들이 있었다. 딱 한달이 지나자 어느 정도 안정이 되는 단계가 되었고 부가적인 기능도 마저 구현하고, 배포하게 되었다. (모호한 부분이 있지만) 다음 단계를 기획하는 시점이랄까.. 최근에 프로젝트 코드에 익숙해져서 추상화된 코드를 어느정도 파악하고, 유지보수 할 수 있게 된 것 같아서 꽤 뿌듯했다. (리뷰 받아봐야 하지만) 처음 개발 공부를 시작하고 기능을 구현했을때 느꼈던 그 기쁨이었다. 📅 25년 회고24년 6월 퇴사24년 7월 부트캠프 시작24년 12월 부트캠프 수료25년 6월에 개발자 취직 7개월 차 근무 중 타임라인을 적어놓고 되돌아보니 나에겐 뜻깊은.. 2026. 1. 4. 이전 1 2 3 4 ··· 56 다음
