# frontend-development

> name: frontend-development description: Standards and workflows for Frontend (Next.js/React) development. ---

- Author: Ankit Yadav
- Repository: raoankitdev/properties.ai
- Version: 20260123142746
- Stars: 0
- Forks: 0
- Last Updated: 2026-02-08
- Source: https://github.com/raoankitdev/properties.ai
- Web: https://mule.run/skillshub/@@raoankitdev/properties.ai~frontend-development:20260123142746

---

name: frontend-development
description: Standards and workflows for Frontend (Next.js/React) development.
---

# Frontend Development
Follow these standards for frontend code in `frontend/`.

## Stack
- **Framework**: Next.js 16 (App Router).
- **Library**: React 19.
- **Styling**: Tailwind CSS v4, `clsx`, `tailwind-merge`.
- **UI Components**: Radix UI primitives, Lucide React icons.
- **Language**: TypeScript.

## Code Style
- **Components**: Functional components with named exports.
- **Naming**: `PascalCase` for components, `kebab-case` for files (e.g., `user-profile.tsx`).
- **Props**: Use interfaces for Prop types.
- **Hooks**: Custom hooks in `hooks/` directory, start with `use`.

## Directory Structure
- `src/app/`: App Router pages and layouts.
- `src/components/`: Reusable UI components.
  - `ui/`: Base UI components (Button, Input, etc.).
- `src/lib/`: Utility functions and shared logic.

## State Management
- Use React Server Components (RSC) for data fetching where possible.
- Use Client Components (`'use client'`) only when interactivity is needed.

## Testing
- **Unit**: Jest + React Testing Library.
- **Command**: `npm test` or `npm run test:watch`.