결론 Next.js13 버전에서 SSG를 하려면 미리 랜더링 할 경로를 리턴하는 generateStaticParams API를 사용하세요. 마주한 에러 next.js로 블로그를 만드는 중입니다. contentlayer를 통해 mdx로 작성한 파일을 파싱하고 콘텐츠를 생성합니다. 개발 모드에서는 잘되는 랜더링이 vercel을 통한 배포 모드에서는 404 에러가 발생했습니다. 해당 경로의 페이지나 파일을 찾을 수 없다는 뜻입니다. 왜그럴까? Next.js에서는 폴더구조 기반으로 라우팅이 됩니다. 그중 [대괄호] 폴더 내의 파일들은 dynamic routes로 정확한 segment(url 경로)를 알지 못하고 동적 데이터로 경로를 생성하려는 경우 요청 시 혹은 빌드타임에 미리 랜더링 할 때 사용할 수 있습니다..
결론 server action을 사용해 해당 경로를 revalidation해주세요. 상황 - 서버컴포넌트에서 route handler를 통해 json-server로 요청을 보낸다. (원래는 서버컴포넌트에서 route handler를 사용할 필요 없이 바로 요청을 보내도 된다.) - 게시글을 수정하고 추가했을 때 해당 게시물 페이지로 라우팅 된다. - 라우팅 된 게시물 페이지에서 get요청으로 받은 수정된 게시글 내용이 업데이트되지 않는다. - 게시글 목록페이지로 넘어가도 추가된 게시물을 볼 수 없다. - 새로고침을 해야만 변경된 데이터가 모두 로드된다. post, patch요청한 데이터는 정상적으로 업데이트 되었고 route handler로 호출한 get요청도 정상적으로 되는것을 network 탭에서 확..
문제 사진과 같이 게시글 페이지 하단에서 상세 페이지 진입시 스크롤이 아래로 고정되어있음을 발견했습니다. 원인 모모는 React 라이브러리를 사용한 SPA입니다. SPA란 Single Page Application의 약자로 말 그대로 하나의 페이지를 사용합니다. Ajax 기술을 사용하여 서버로부터 매번 새로운 페이지를 받는것이 아닌, 한 페이지 내에서 필요한 부분만 동적으로 업데이트하여 화면 깜빡임없이 부드러운 화면전환과 데이터 크기를 줄일 수 있습니다. 따라서 페이지가 새로 랜더링되더라도 하나의 페이지를 사용하기때문에 스크롤이 고정되어있습니다. 해결 useEffect를 사용하여 컴포넌트가 마운트 될 때 pathname 변경시 스크롤이 브라우저 최상단으로 올라가는 로직을 작성하였습니다. 'lists' 페..
