예외 처리

(이 글은 Next.js App Router 15.2.4 버전을 기준으로 작성되었으며 제가 직접 진행한 실험을 토대로 개인적인 추측과 가설이 포함되어 있습니다. 상황의 이해를 위해 아래 링크된 이전 글을 읽고 오시길 권해드립니다.) 재발한 이슈이번에 포트폴리오의 내비게이션 바를 구현하면서 발생한 이슈입니다. 다른 페이지(/project/1)에서 메인 페이지(/)로 router.push의 방식으로 이동하면 다시 인터섹션 옵저버가 id를 감시하지 못합니다. 어? 이건 지난 글에서 나온 현상과 동일한데요? 새로고침 후에 옵저버가 감시할 id를 찾지 못해서 스크롤 이동을 감지하지 못하는 현상 말입니다. 그래서 그 당시 id도 비동기 서버 컴포넌트 밖으로 빼는 것으로 해결했었죠. [Next.js] App ..

+) 이 글은 JavaScript 카테고리에 속해있지만 사실 Web API는 자바스크립트라는 언어에 국한되는 기능은 아닙니다. (ex) Web Assembly) 이 이슈도 지난 글에 언급했지만 분량이 길어질 것 같아서 분리했습니다. [React] Intersection Observer의 Stale Closure(오래된 클로저) 이슈 useRef로 해결하기(이 글은 Next.js App Router 15 버전 프로젝트를 기준으로 작성되었습니다.) 내비게이션 바제 포트폴리오에서 구현한 내비게이션 바입니다. 여기서는 2가지의 스크롤 이벤트가 발생합니다. (아래 Aboutunhandled.tistory.com 이번 글은 매우 간단합니다. 제가 Intersection Observer의 threshold 옵션을 ..

(이 글은 Next.js App Router 15 버전을 기준으로 작성되었으며 직접 진행한 실험을 토대로 제 개인적인 추측이 포함되어 있습니다. 그러므로 정확하지 않은 가설이 포함되어 있을 수 있습니다.) 지난 글을 읽고 오셨을까요? [React] Intersection Observer의 Stale Closure(오래된 클로저) 이슈 useRef로 해결하기(이 글은 Next.js App Router 15 버전 프로젝트를 기준으로 작성되었습니다.) 내비게이션 바제 포트폴리오에서 구현한 내비게이션 바입니다. 여기서는 2가지의 스크롤 이벤트가 발생합니다. (아래 Aboutunhandled.tistory.com 혼란스러운 테스트 결과아래 내용은 이전 포스팅에서 작성했던 글입니다. (본문에는 포함되지 않았죠.)..

(이 글은 Next.js App Router 15 버전 프로젝트를 기준으로 작성되었습니다.) 내비게이션 바제 포트폴리오에서 구현한 내비게이션 바입니다. 여기서는 2가지의 스크롤 이벤트가 발생합니다. (아래 About Me 버튼의 상태가 포커스 된 상태입니다.) 1. 내비게이션 바 섹션 버튼 클릭 시 클릭한 버튼 포커스하고 해당 섹션으로 스크롤 이동 2. 스크롤 이동시 스크롤 위치를 감지해서 내비게이션 바 포커스 상태 변경 (화면 캡처 프로그램이 한 템포 느려서 버벅거리는 것처럼 녹화되었으나 실제로는 그렇지 않습니다.) 내비게이션 바 디버깅 위 두 개의 기능 중에 1번 기능에서 버그가 발생했습니다. 1. 내비게이션 바 섹션 버튼 클릭 시 클릭한 버튼 포커스하고 해당 섹션으로 스크롤 이동2. 스크롤 이동시..