# ui-skill

- Author: Misbah Ahmed
- Repository: Misbahahmed857/hackathon2_phase3_full-stack-todo-app
- Version: 20260208085349
- Stars: 0
- Forks: 0
- Last Updated: 2026-02-08
- Source: https://github.com/Misbahahmed857/hackathon2_phase3_full-stack-todo-app
- Web: https://mule.run/skillshub/@@Misbahahmed857/hackathon2_phase3_full-stack-todo-app~ui-skill:20260208085349

---

# UI Skill

## Purpose
Create responsive, accessible React components with Next.js.

## Capabilities
- **Component Design**: Reusable React components
- **Responsive Layout**: Mobile-first design with Tailwind CSS
- **Form Handling**: Controlled inputs, validation, error display
- **State Management**: React hooks (useState, useEffect, useContext)
- **Routing**: Next.js App Router navigation

## Best Practices
- Use TypeScript for type safety
- Implement loading and error states
- Create accessible forms (ARIA labels)
- Use Tailwind for consistent styling
- Handle authentication state with Context API

## Deliverables
- Auth pages (signup, signin)
- Protected route wrappers
- Responsive navigation
- Feature-specific UI components