-
페러렐 라우트 -> 뒤에 화면이 남아 있는 모달 창 -> 패러렐 라우트와 인터셉트 라우트
2. 페러렐 라우트 -> 폴더가 다른페이지를 동시에 보여준다
기존의 컴포넌트 → 서버 컴포넌트 = next.js 서버 내에서 돌아감(비동기로 서버 만들수도잇음)
- 문제점: hooks를 못 사용하는 문제점 발생
- 서버 컴포넌트는 데이터를 다룰 때 장점이 있어서 사용해야 함
- 클라이언트 컴포넌트로 변경하는 방법 ⇒ 위에 “use client” 하나만 추가
default.tsx
- 많이 하는 실수
- @modal 파일 안에 i/flow/login으로 컴포넌트를 만든 후 login.modal.css와 page.tsx를 그대로 집어넣는 방식 ⇒기존 page.tsx가 사라지는 문제 발생
- 이 경우 메인 페이지에서는 모달을 인식할 필요가 없어서 없는걸로 치부됨
- default.tsx 파일 생성 ⇒ 패러렐 라우트에 대한 기본 값 (그냥 return null;해주면 됨)
- 경로가 다 맞는데 error 발생 시 캐싱 문제이기 때문에 서버 재부팅으로 해결하면 됨
- @modal 파일 안에 i/flow/login으로 컴포넌트를 만든 후 login.modal.css와 page.tsx를 그대로 집어넣는 방식 ⇒기존 page.tsx가 사라지는 문제 발생
'📚 이론정리 > React & Next.js' 카테고리의 다른 글
common폴더와 elements폴더의 차이점,layout폴더 (0) 2024.03.09 ✏️ Next.js의 SSG/ISR/SSG/CSR (0) 2024.03.09 Next 보일러플레이트 앱 라우터 폴더구조와 설치,Server컴포넌트, Client컴포넌트 (0) 2024.03.09 ✏️ custom hook 설정하기 (0) 2024.03.09 ✏️ 글로벌 스테이트와 fetch-policy (0) 2024.03.02 댓글