프론트엔드 개발자
사용자 경험과 인터페이스 개선에 중점을 두고 끊임없이 배우고 성장하는 개발자입니다. 디자인과 개발 사이에서 최적의 균형을 찾는 데 열정을 가지고 있습니다.
이 블로그는 프론트엔드 개발 과정에서 배운 것들과 경험을 기록하고 공유하는 공간입니다. React, TypeScript, 웹 성능 최적화 등 실무에서 마주하는 다양한 주제를 다룹니다.
마이크를 끈 상담 녹화만 재생되지 않던 장애에서 시작해 Shaka Player와 hls.js를 어댑터로 갈아 끼울 수 있는 HLS 재생 모듈을 만든 과정입니다. 브라우저에 HLS 라이브러리가 필요한 이유부터 엔진을 고를 수 있게 만드는 설계까지 다룹니다.
RADIO로 시스템 디자인하기 시리즈의 세 번째 글입니다. 서버가 먼저 말을 거는 실시간 채팅을 소재로, WebSocket 선택부터 낙관적 병합, 순서 보장, 가변 높이 가상화까지 RADIO 다섯 단계로 처음부터 끝까지 설계해봅니다.
RADIO로 시스템 디자인하기 시리즈의 두 번째 글입니다. Input과 Dropdown뿐인 작은 UI 안에 디바운스, 캐시, race condition, 접근성까지 자동완성 검색창을 RADIO 다섯 단계로 처음부터 끝까지 설계해봅니다.
RADIO로 시스템 디자인하기 시리즈의 첫 글입니다. 프론트엔드 시스템 디자인을 구조적으로 풀어내는 RADIO 프레임워크를 Requirements부터 Optimization까지 다섯 단계로 나눠, 각 단계가 무엇을 묻고 왜 그 질문이 필요한지 차근차근 살펴봅니다.
프롬프트 엔지니어링에서 컨텍스트 엔지니어링, 그리고 하네스 엔지니어링으로 빠르게 옮겨가는 AI 코딩 패러다임의 변화. 몇 달 만에 베스트 프랙티스가 낡아가는 시대에 무엇을 쫓고 무엇을 끝까지 남길지에 대한 개발자의 깊은 고민.
eslint-plugin-react-hooks의 set-state-in-effect 규칙이 존재하는 근본적인 이유를 렌더링 흐름 분석과 React Compiler 관점에서 알아봅니다. 불필요한 재렌더링을 제거하고, 예측 가능한 렌더링을 작성하는 방법을 정리합니다.
