기존 룰
1.한글로 응답해줘.
2.Next.js: Route Handler 우선 사용
모든 API 엔드포인트는 Route Handler를 사용하여 구현하세요.
데이터베이스 작업, 외부 API 호출, 인증 등 복잡한 서버 작업은 반드시 Route Handler를 사용하세요.
Server Action은 단순 폼 제출 또는 간단한 데이터 처리에만 사용하세요.
그리고 params쓸떄 비동기로 처리해서 구현해줘(await params)
3.Next.js 라우팅: App Router 사용
프로젝트 내 라우팅은 Pages Router 대신 App Router를 사용하세요.
4.슈파베이스 관련 개발 시 MCP사용
슈파베이스 구조를 파악할떄 MCP를 사용해서 파악해줘
5.npm install @supabase/auth-helpers-nextjs 이거 쓰지말아줘.
6.throw 쓰지말아줘
7.console.error쓰지말아줘.
8. api 만들때 const { id } = await params 이런식으로 params 써주고, 타입은 promise지정해줘.
9. api만들떄 const supabase = await createClient(); 이런식으로 해줘.
10.전역 상태 관리할 떄는 zustand 이용해서 해줘
11.특정 페이지에 기능 단위별로 컴포넌트 만들때는 해당 페이지의 components폴더를 만들고 그 안에다가 구성해줘.
12. 페이지를 만들 떄 가급적 기능 단위로 components를 쪼개서 구성해줘. page.tsx파일에 너무 많은 기능을 넣지마.
13. 타입 지정은 같은 경로내에 types.ts파일로 해서 몰아서 지정해줘
14.useSearchParams나 usePathname을 client side에서 쓰게 되면 Suspense로 감싸는거 한번 해줘.
15.가급적 페이지의 처음 컴포넌트인 page.tsx파일은 server component로 만들고 필요하면 세부 컴포넌트들은 별도 comnponents폴더에 넣어서 client 컴포넌트로 재구성해줘. 가급적 server component로 하고 싶어.
16. 디자인 요소는 가급적 shadcn 써주고 mcp이용해줘
17.common, ui 같은 공용 컴포넌트로 보이는 것들은 가급적 수정하지말고, 수정이 불가피하면 유사컴포넌트를 하나 만들던가 callback형태로 해서 작업해줘.
18.hooks,store, component/common안의 요소 등은 공용 컴포넌트야. 혹시 수정하다가 공용 컴포넌트들 수정하지 않게 해줘.
19.만약 zustand 상태관리하려면 components안에 store로 해서 넣어줘.
20. 만약 공통적으로 사용될만한 hooks은 components안에 hooks폴더에 넣어줘.
21. 만약 공통적으로 사용될만한 lib은 components안에 lib폴더에 넣어줘.