# AgenticIQ A modern React application built with TypeScript, Tailwind CSS, and shadcn/ui, following **AgenticIQ Enterprise Coding Guidelines & Best Practices Version 1.0** from Tech4Biz Solutions Pvt Ltd. ## ๐Ÿš€ Features - โšก **Vite** - Lightning-fast build tool - โš›๏ธ **React 18** with TypeScript - ๐ŸŽจ **Tailwind CSS** - Utility-first CSS framework - ๐Ÿงฉ **shadcn/ui** - Beautiful, accessible component library - ๐Ÿ“ฑ **Responsive Design** - Mobile-first with 7 breakpoints - ๐Ÿ”’ **Type Safety** - Strict TypeScript configuration - ๐Ÿ“ฆ **Path Aliases** - Clean imports with `@/` prefix - ๐ŸŽฏ **Best Practices** - Following enterprise coding standards ## ๐Ÿ“‹ Prerequisites - Node.js 18+ - npm or yarn ## ๐Ÿ› ๏ธ Installation 1. Clone the repository: ```bash git clone cd AgenticIQ ``` 2. Install dependencies: ```bash npm install ``` 3. Create environment file: ```bash cp .env.example .env ``` 4. Start development server: ```bash npm run dev ``` ## ๐Ÿ“ Project Structure Following AgenticIQ guidelines, the project is organized as: ``` src/ โ”œโ”€โ”€ components/ # Reusable UI components โ”‚ โ””โ”€โ”€ ui/ # shadcn/ui components โ”œโ”€โ”€ pages/ # Route-level components โ”œโ”€โ”€ hooks/ # Custom React hooks โ”œโ”€โ”€ services/ # API calls and external services โ”œโ”€โ”€ utils/ # Helper functions โ”œโ”€โ”€ types/ # TypeScript type definitions โ”œโ”€โ”€ constants/ # Application constants โ””โ”€โ”€ lib/ # Third-party library configurations ``` ## ๐ŸŽจ Responsive Breakpoints Following AgenticIQ responsive design guidelines: - **Mobile S** (`< 375px`): Extra small mobile devices - **Mobile M** (`375px - 424px`): Standard mobile devices - **Mobile L** (`425px - 767px`): Large mobile devices - **Tablet** (`768px - 1023px`): Tablet devices - **Laptop** (`1024px - 1439px`): Laptop screens - **Desktop** (`1440px - 1919px`): Desktop screens - **Large Display** (`โ‰ฅ 1920px`): Large displays ## ๐Ÿ“ Naming Conventions Following AgenticIQ standards: - **Components/Interfaces**: `PascalCase` - **Functions/Variables**: `camelCase` - **Constants**: `SCREAMING_SNAKE_CASE` - **CSS Classes/Files**: `kebab-case` - **Private Fields**: `_camelCase` ## ๐Ÿงช Available Scripts - `npm run dev` - Start development server - `npm run build` - Build for production - `npm run preview` - Preview production build - `npm run lint` - Run ESLint ## ๐Ÿ“š Adding shadcn/ui Components To add new shadcn/ui components: ```bash npx shadcn@latest add button npx shadcn@latest add card npx shadcn@latest add input ``` ## ๐ŸŽฏ Code Quality Standards This project follows: - **File Size**: < 250 lines per file - **Function Parameters**: Max 4 parameters - **Nesting Levels**: Max 3 levels - **Test Coverage**: Min 80% line coverage - **Documentation**: JSDoc for all public functions ## ๐Ÿ”’ Security - Input validation on client and server - XSS prevention - CSRF protection - Secure authentication practices ## ๐Ÿ“– Documentation All functions include JSDoc comments with: - `@description` - What the function does - `@param` - Parameter descriptions - `@returns` - Return value description - `@throws` - Possible errors - `@example` - Usage examples ## ๐Ÿค Contributing We welcome contributions! Please read our [Contributing Guide](CONTRIBUTING.md) for details on: - Git workflow and branching strategy - Commit message format (Conventional Commits) - Code standards and guidelines - Pull request process Quick checklist: 1. Use conventional commits (`feat:`, `fix:`, `docs:`, etc.) 2. Follow branching strategy (`feature/`, `bugfix/`, `hotfix/`) 3. Maintain code quality standards (see `GUIDELINES.md`) 4. Add tests for new features 5. Ensure all checks pass before submitting PR ## ๐Ÿ“„ License [Your License Here] ## ๐Ÿ™ Acknowledgments Built following **AgenticIQ Enterprise Coding Guidelines & Best Practices Version 1.0** by Tech4Biz Solutions Pvt Ltd.