# queirozz Portfolio

> Developer portfolio for Henrique Jorge de Queiroz (queirozz), providing structural context and development guidelines for LLM-assisted development.

This file provides information about the architecture, tech stack, and structure of the portfolio project. It serves as a guide for AI agents and developers working on this repository.

## Project Links
- [Production Website](https://queirozz.vercel.app) - The live production deployment of the portfolio.
- [GitHub Repository](https://github.com/queirozz8/portfolio) - Source code, issues, and development history.

## Technical Stack

### Core Architecture
- Framework: React 18.3.1
- Language: TypeScript 5.8.3
- Bundler: Vite 5.4.19
- Styling: Tailwind CSS 3.4.17 + ShadCN UI components
- State Management: TanStack Query (React Query) 5.83.0
- Router: React Router DOM 6.30.1

### UI, Animations & Tools
- Animation: Framer Motion 12.35.2
- Icons: Lucide React 0.462.0
- Theming: Next Themes 0.3.0 (dark mode support)
- Components: Radix UI primitives, Sonner (toasts), Vaul (drawers)
- Charts & Forms: Recharts 2.15.4, React Hook Form 7.61.1 + Zod 3.25.76
- i18n: i18next 25.8.17 + react-i18next 16.5.6

### Build & Quality Assurance
- Package Manager: pnpm (workspace)
- Testing: Vitest 3.2.4 + Playwright 1.57.0
- Code Quality: ESLint 9.32.0 with React hooks and refresh plugins

## Project Structure
The repository is organized following standard React and Vite conventions:
- `public/`: Static assets including custom fonts (Space Grotesk, IBM Plex Sans), images, and SEO configuration files.
- `src/components/`: Reusable React components including specific layout modules (`Navbar`, `Hero`, `StackSection`, `ExperienceSection`, `ProjectsSection`, `WorkStyleSection`, `Footer`) and the primitives inside `ui/`.
- `src/pages/`: Core views for application routing (`Index.tsx`, `NotFound.tsx`).
- `src/hooks/`: Custom stateful React hooks.
- `src/i18n/`: Internationalization setups supporting bilingual variants (pt-br/en).

## Development Guidelines

### Code Style & Implementation
- Use TypeScript with strict typing.
- Follow ShadCN UI component patterns and prefer functional components.
- Use `tailwind-merge` and `clsx` for managing conditional classes.
- Rely on `class-variance-authority` for strict component variant handling.
- Verify existing parts inside `/src/components/ui/` before making dependencies.

### Accessibility & Performance Rules
- Ensure all interactive elements remain completely keyboard navigable.
- Apply proper ARIA attributes using Radix UI primitives.
- Code-split heavy trees using `React.lazy` when necessary.
- Cache external operations strictly via React Query hooks.