- Next.js 15의 App Router에서 Layout과 Template 파일의 차이점을 이해하는 것이 중요합니다. 💡
- Layout은 공통 요소를 유지하면서 새로운 페이지 콘텐츠만 마운트하여 성능을 향상시킵니다. ⚡️
- Template은 라우트 간 이동 시 매번 새로운 인스턴스를 생성하여 상태를 초기화하고, 애니메이션이나 useEffect와 같은 특수 효과에 유용합니다. 🔄
- Layout은 공유 UI에 일반적으로 사용되지만, 특정 상황(예: 애니메이션)에서는 Template을 사용하는 것이 더 적합합니다. ✨
- Template 파일은
template.tsx
또는template.jsx
와 같이 이름을 지정하고, children prop을 받아 자식 컴포넌트를 렌더링합니다. 📄