본문 바로가기

Front-End/Next.js

404 ,error , loading

각각 페이지 만드는 방법에 대해 알아보겠다.

 

404

설정을 안하면 버셀에서 제공해주는 404페이지를 그대로 따라간다.

 

만드는 방법은 src/app 하위에 "not-found.tsx"를 만드는 것이다.

컴포넌트채로 보여준다고 보면 된다.

 

Error

이것 역시 404와 방식은 똑같다.
error.tsx 만들면 된다.
에러는 'use client' 붙혀줘야 함!

 

Loading

로딩도 똑같다. 같은 경로에 Loading.tsx를 만들어주면 된다.
로딩 컴포넌트 만드는 거 굉장히 중요하다.
이것도 레이아웃.tsx처럼 , 가장 가까운 놈의 경로 공유를 한다.
같은 폴더에 있는 놈을 쓰게 된다.