NextJS에서 커스텀 된 에러 페이지를 띄워주고 싶으면, NextJS에서 자체적으로 제공하는 기능을 사용하면 편리하다.
https://nextjs.org/docs/advanced-features/custom-error-page
Advanced Features: Custom Error Page | Next.js
Override and extend the built-in Error page to handle custom errors.
nextjs.org
만약 404Error가 발생했을 때 띄워줄 커스텀 페이지를 만들고 싶으면 pages 폴더에 404.tsx 파일을 생성해주면 된다.
같은 방식으로 500Error가 발생했을 때 띄워줄 커스텀 페이지는 pages 폴더에 500.tsx 이름의 파일을 생성해준다.
전체적인 에러를 핸들링해주는 커스텀 페이지일 경우 같은 폴더에 _error.tsx 파일을 생성해준다.
'Next.js' 카테고리의 다른 글
| [Next] React에 Omise PG 연동하기 (0) | 2022.11.25 |
|---|---|
| [Next] Google Analytics 적용하기 두 줄 요약 (0) | 2022.10.17 |
| [Next] React Facebook Login 구현과 CSS 커스텀 (0) | 2022.08.11 |
| [Next] React 구글 로그인 [react-google-login] deprecated 관련 Error, [@react-oauth/google@latest] 적용 (0) | 2022.08.09 |
| [Next] getServerSideProps 사용 시 url에서 query 정보 가져오기 (0) | 2022.08.05 |