TECH NOTES
기술노트
현장에서 검증된 개발 지식을 기록합니다.
893892891890889888887886885884883882
Frontend
Figma to Code — 디자인에서 코드 자동 생성
Figma 디자인을 React/Tailwind 코드로 변환하는 도구와 워크플로 비교.
Frontend
View Transitions API — 페이지 전환 애니메이션
View Transitions API로 SPA와 MPA 모두에서 부드러운 페이지 전환을 구현하는 방법.
AI
AI 이미지 업스케일링 — ESRGAN과 Real-ESRGAN 활용
ESRGAN과 Real-ESRGAN을 활용한 AI 이미지 업스케일링의 원리와 실제 사용법, 모델별 품질 차이를 비교 분석합니다.
Frontend
CSS Anchor Positioning — 요소 간 위치 지정의 혁신
CSS Anchor Positioning API로 요소 간 상대적 위치를 지정하는 새로운 방법.
Frontend
TypeScript 6 — 새로운 타입 시스템 기능
TypeScript 6의 새로운 타입 시스템 기능, 패턴 매칭, 성능 개선 사항.
Backend
Kafka 입문 — 메시지 브로커의 핵심 개념과 실습
Apache Kafka의 핵심 개념인 토픽, 파티션, 컨슈머 그룹을 이해하고 Node.js에서 프로듀서와 컨슈머를 구현하는 실습입니다.
Backend
Node.js 23 — 새로운 기능과 실험적 API
Node.js 23의 새로운 실험적 기능들과 안정화된 API 정리.
Backend
Deno 3 — 통합 도구 체인의 완성
Deno 3의 완전한 Node.js 호환, 패키지 관리자, 새로운 기능들 정리.
Backend
Bun 1.5 — 안정성과 Node.js 호환성 강화
Bun 1.5의 Node.js 호환성 개선, 새로운 API, 안정성 강화 사항.
Frontend
Next.js Image 최적화 심화 — blur placeholder와 CDN 전략
Next.js Image 컴포넌트의 blur placeholder 생성, 외부 이미지 CDN 연동, 반응형 이미지 전략을 심층적으로 살펴봅니다.
Backend
HTTP/2 Server Push 대안 — 103 Early Hints
HTTP/2 Server Push가 폐기된 후, 103 Early Hints로 리소스를 선행 로드하는 방법.
Frontend
Next.js 16 — React 19 완전 통합과 새로운 기능
Next.js 16의 React 19 완전 통합, 새로운 라우팅 기능, 성능 개선 사항.