TypeScript2 [NEXT.js 14] 5. Layout(feat. { children }: { children: ReactNode }) props Layout 1. 정의 & 특성 2. 코드 예시 3. 관련 에러상세 1. 정의 & 특성Next.js 에는 Layout 컴포넌트가 존재하고 이는 여러 경로간에 공유되는 UI입니다. Layout 컴포넌트는- 파일에서 React 구성요소를 내보내도록 정의할 수 있고,- 렌더링 중에 하위에 레이아웃(page UI)가 존재할 경우, 하위 요소를 받아오기 위한 children props를 작성해야 합니다. ㄴ 이를 하기 위해서는, { children }: { children: ReactNode } 구문을 사용해서 이뤄질 수 있습니다. { children }: { children: ReactNode } 이 구문은 TypeScript의 객체 구조 분해와 타입 정의를 결합한 것입니다.(따라서, 객체의 특정 .. 2024. 6. 18. [Next.js 13] tailwind css Plugin 작성 & 적용 접근 (요약) 현재 개발중인 프로젝트에서 Next.js 13버전과 TypeScript 를 기술스택으로 갖고, 이에 더불어 Tailwind CSS를 사용하고 있습니다. 필요한 컴포넌트를 Tailwind CSS에서 가져다가 사용하려는 찰나, 프로젝트 내부 tailwind.config.ts 파일에 Plugin 부분을 추가하란 안내를 따라가봅니다. 1. (상황) Tailwind css 컴포넌트 사용 필요 (1.1) 컴포넌트 코드 내부 2. Tailwind CSS Plugin 추가 & 설치 (2.1). npm install @플러그인명 (2.2). tailwind.config.ts 파일에 플러그인 추가 방법 1. (상황) Tailwind css 컴포넌트 사용 필요 (1.1) 컴포넌트 코드 내부 /* This ex.. 2023. 9. 27. 이전 1 다음
