1. “use client” 지시어의 남발문제
   1. 모바일 시안에 헤더부분이 사라지는 부분이 많아 usePathname사용 그러나 훅은 → use client에서 사용가능
   2. 전역이 use client로 도배될수있는 문제
   3. 부모가 클라이언트가 될필요가 없다. 자식만 클라이언트 컴포넌트면되니 wrapper를 넣는다면?(컴포짓패턴)

import HeaderWrapper from "@/components/layout/HeaderWrapper";
import publicMetadata from "#/config/metaData"

export default function PublicLayout({ children }) {
  return (
			<>
        {/* 서버 컴포넌트인 레이아웃 안에 클라이언트 컴포넌트를 끼워 넣음 */}
        <HeaderController />
        {children}
			</>
  );
}

export const metadata = {...publicMeta/Data}

// 대신 이함수는 libs/utils안에 넣습니다.
"use client"

import { usePathname } from "next/navigation"
import Header from "./Header"

export default function HeaderWrapper() {
	const pathname = usePathname()
	
	/** const hideHeaderPaths = ["/sell-detail" ...]
	 if (hideHeaderPaths.includes(pathname) {
			return null
	}
	
	return <Header />;
	*/ 위 방법이 맞을뜻합니다. (많을때는 배열을 사용하는게 효과적일뜻합니다.
	
	// 아래는 현재 Layout에 바로 적용한 방법이다.
	const isCompletePage = pathname.endsWith('/compelte')
		
	return (
		<>
				{!isCompletePage && <Header />}
				{children}
		</>
	)	
}

1. tailwind 의 중복된 유틸리티
   1. tailwind플러그인이나 노란색줄로 바꿔달라고 하는것은 확인필요
   2. 간혹 유틸리티가 중복되는 경우발견

😀긍정

• (auth),(protected),(public) 등의 라우팅 그룹
• cn,cva로 유연하게 클래스 관리
• 상태관리 providers(모달)

😗중립

• componets/안 폴더의 기준이 살짝이상하다.
  • common은 두가지 이상이 조립된것(좀 헤비한것)
  • ui는 원자단위 거나 유동적으로 가볍다 생각하는것들이 와야하는데 일단 문서를 만들면 이번 프로젝트가 크지는 않아 문제될것은 없을뜻합니다.
• 로딩/에러 처리가 없는 상태

⛈️부정

• FilterProvider와 필터링 로직 중복
  • 하나의 필터 상태를 공유하고 UI만 다르게 보여줄수는 없을까?
  • mockCard는 백엔드 연결시 교체될예정이기에 생략
• 필터 옵션값 (’COMMON’,’RARE’ … etc) 는 하드코딩 보다 constants.js 에 분리하여 관리하는것이 좋을뜻합니다.

생각 해볼만한점

• Image/next 컴포넌트가 좋은데 width,height,fill을 사용할때 부모 컨테이너 스타일을 유의(리팩토링시!!)