나는 Next.js와 Three.js로 새로운 포트폴리오를 만들었습니다

Source: Dev.to

저는 최근에 성능, 인터랙티브성, 시각적 아이덴티티에 중점을 두고 개인 포트폴리오를 처음부터 직접 만들었습니다.
👉 Live site:

Tech Stack

• Next.js – 라우팅, 서버‑사이드 렌더링, 전체 구조
• Three.js – 3D 렌더링 및 씬 관리
• GLSL shaders – 배경과 은하를 구동
• Cloudflare Turnstile – 연락처 양식에 대한 봇 보호
• Rate limiting – 연락처 API 엔드포인트 보안
• Vercel – 배포

Highlights of the Build

• Fast, fully static Next.js pages – 사이트 대부분이 정적으로 최적화되어 있으면서도 인터랙티브 WebGL 요소를 지원합니다.
• Secured contact form – 작은 서버리스 API 라우트와 Cloudflare Turnstile을 통합하고 스팸 방지를 위해 레이트 리밋을 추가했습니다.
• Responsive + GPU‑friendly – 셰이더가 모바일, 디바이스 픽셀 비율 변화 및 GPU 제약에 깔끔하게 적응합니다.

Why I Built It

프론트엔드/풀스택 개발자로서의 경험과 별 관찰에 대한 관심을 반영하는 포트폴리오를 원했습니다. 이 프로젝트를 통해 제 기술 역량과 개인적인 열정을 모두 보여줄 수 있습니다.

디자인, 성능, 셰이더, UX 등 어떤 부분이든 피드백을 100 % 환영합니다.

읽어주셔서 감사합니다! 👋