[Project]

문제의 시작: 간헐적 로그아웃 운영 중인 서비스에서 간헐적으로 사용자가 강제 로그아웃되는 현상이 발생했다. 매번 그런 건 아니고, 한번씩 불규칙하게 발생하는 종류의 버그였다. 로그를 확인해보면 refresh token 갱신이 실패하면서 로그아웃 처리가 되고 있었다.

프로젝트를 진행하던 중, PNPM workspace 기반 폴리레포 환경에서 내부 UI 라이브러리를 사용하는 구조에서 반복적인 모듈 해석 오류를 겪었다. 단순히 “빌드를 안 해서 생긴 에러”처럼 보였지만, 실제로는 UI 패키지를 어떤 방식으로 사용하는 구조인지가 명확히

아이콘 36개를 어디서 불러오느냐로 Lighthouse 점수가 87점에서 75점까지 떨어졌습니다. 원인은 loading="lazy" 한 줄이었습니다.포트폴리오 사이트의 기술 스택 섹션을 개발하면서 아이콘 처리 방식이 성능에 이렇게까지 영향을 미칠 거라고는 생각하지 못했

숙박 플랫폼에서 어메니티 아이콘 시스템을 설계했습니다. 단순히 아이콘을 렌더링하는 것에서 끝나지 않고, 구현하면서 발견한 문제들을 직접 개선하는 과정까지 겪었습니다. SVG 변환 자동화, id 충돌 방지, 번들 최적화 등 그 과정을 정리한 글입니다.작업한 서비스는 세

개인 포트폴리오 사이트(Next.js 15 / App Router)를 만들고 Lighthouse를 돌려보니첫 페인트 시점, 메인 스레드 점유 시간, 폰트 로딩 시 레이아웃 시프트 등에서개선할 만한 지점들이 보였다.이번 글에서는 LCP / TBT / CLS 세 가지 지표

숙소 등록 플로우를 개발하면서 사진 업로드가 UX 병목이 될 수 있다는 걸 인식했다. 원본 파일을 그대로 올리면 느리고, 10장을 순차 처리하면 대기 시간이 선형으로 늘어난다. 진행 상황도 없으니 사용자는 버튼을 다시 누른다. 어차피 만들 기능이라면 제대로 만들자는 생

Next.js · Vite · Astro로 만들어진 6개 앱과 3개의 공유 패키지(UI 라이브러리, API 서비스, 다국어 리소스)를 하나의 pnpm 워크스페이스로 묶은 작업 기록이다.pnpm-workspace.yaml을 추가하는 수준이 아니라, 다중 프레임워크가 공존

4개 언어를 지원하는 예약 사이트를 개발하던 중, 언어를 바꿔도 날짜의 요일 표기만 그대로 남는 이슈를 발견했다. 원인은 i18n과 moment.js가 서로 다른 로케일 체계를 사용한다는 점이었다. 두 라이브러리를 언어 변경 이벤트로 동기화하고, 중국어 weekday는

인터랙션 중심의 프로모션 웹사이트를 작업하면서 스무스 스크롤을 다뤘습니다. 휠을 굴리면 화면이 관성을 받은 것처럼 부드럽게 미끄러지며 따라오는 효과입니다.작업하면서 자연스럽게 궁금해졌습니다.스무스 스크롤은 내부에서 어떻게 동작하길래 이렇게 부드럽게 느껴질까? 또 어떤

숙박 호스트 플랫폼에서 멀티테넌시(multi-tenancy) 아키텍처를 처음 접하고, 호스트별 동적 페이지 렌더링 작업에 참여하면서 정리한 학습 기록입니다. 들어가며 제가 작업한 프로젝트는 숙박업 호스트가 자기 브랜드 사이트를 직접 만들어 운영할 수 있게 해 주는