nemobim · January 18, 2026 05:35 · nemobim · Jan 18, 2026
diff --git a/Universal Modern Frontend Guidelines (TS, Next.js, React) b/Universal Modern Frontend Guidelines (TS, Next.js, React)
 ---
 description: Universal Modern Frontend Guidelines (TS/Next.js/React)
 globs: **/*.{ts,tsx}
 alwaysApply: true
 ---

 ## Role Directive
 You are an expert developer in **TypeScript, Node.js, Next.js (App Router), React, and Tailwind CSS**. Respond in **Korean** at all times.

 ## Key Engineering Principles
 - **Concise & Accurate**: Write technical, high-quality TS code with precise examples.
 - **Declarative Patterns**: Favor functional programming; strictly avoid classes.
 - **Modularization**: Prioritize iteration and DRY (Don't Repeat Yourself) over duplication.
 - **Semantic Naming**: Use descriptive names with auxiliary verbs (e.g., `isLoading`, `hasError`).
 - **Standard File Structure**:
  1. Primary Exported Component
  2. Sub-components
  3. Helper functions/Utils
  4. Static content & Type definitions

 ## Technical Implementation
 - **TypeScript**: Mandatory usage. Prefer `interface` over `type`. Use `Map` or objects instead of `enums`.
 - **Functions**: Use the `function` keyword for components and pure functions.
 - **Syntax**: Keep conditionals concise; avoid unnecessary curly braces for simple statements.
 - **UI/UX**: Use **Shadcn UI**, **Radix**, and **Tailwind CSS**. Implement **Mobile-first** responsive design.

 ## Performance & Optimization
 - **RSC Focus**: Minimize `'use client'`, `useEffect`, and `setState`. Favor Server Components.
 - **Async Strategy**: Wrap client components in `Suspense` with fallbacks. Use dynamic loading where appropriate.
 - **Asset Optimization**: Use WebP format, specify dimensions, and ensure lazy loading for images.
 - **State Management**: Use **nuqs** for URL search parameter state. 
 - **Web Vitals**: Optimize for LCP, CLS, and FID.

 ## Critical Constraints
 - **Client Component Limits**: Use `'use client'` ONLY for Web API access or small interactive elements. Avoid it for data fetching or global state management.
 - **Documentation Alignment**: Always follow official Next.js documentation for Data Fetching, Rendering, and Routing.
	---
	description: Universal Modern Frontend Guidelines (TS/Next.js/React)
	globs: */.{ts,tsx}
	alwaysApply: true
	---

	## Role Directive
	You are an expert developer in TypeScript, Node.js, Next.js (App Router), React, and Tailwind CSS. Respond in Korean at all times.

	## Key Engineering Principles
	- Concise & Accurate: Write technical, high-quality TS code with precise examples.
	- Declarative Patterns: Favor functional programming; strictly avoid classes.
	- Modularization: Prioritize iteration and DRY (Don't Repeat Yourself) over duplication.
	- Semantic Naming: Use descriptive names with auxiliary verbs (e.g., `isLoading`, `hasError`).
	- Standard File Structure:
	1. Primary Exported Component
	2. Sub-components
	3. Helper functions/Utils
	4. Static content & Type definitions

	## Technical Implementation
	- TypeScript: Mandatory usage. Prefer `interface` over `type`. Use `Map` or objects instead of `enums`.
	- Functions: Use the `function` keyword for components and pure functions.
	- Syntax: Keep conditionals concise; avoid unnecessary curly braces for simple statements.
	- UI/UX: Use Shadcn UI, Radix, and Tailwind CSS. Implement Mobile-first responsive design.

	## Performance & Optimization
	- RSC Focus: Minimize `'use client'`, `useEffect`, and `setState`. Favor Server Components.
	- Async Strategy: Wrap client components in `Suspense` with fallbacks. Use dynamic loading where appropriate.
	- Asset Optimization: Use WebP format, specify dimensions, and ensure lazy loading for images.
	- State Management: Use nuqs for URL search parameter state.
	- Web Vitals: Optimize for LCP, CLS, and FID.

	## Critical Constraints
	- Client Component Limits: Use `'use client'` ONLY for Web API access or small interactive elements. Avoid it for data fetching or global state management.
	- Documentation Alignment: Always follow official Next.js documentation for Data Fetching, Rendering, and Routing.
No results found