A modern insurance brokerage management system built with Next.js, TypeScript, and Tailwind CSS.
- Client Management
- Add/Edit/Delete clients
- Search and filter clients
- Assign clients to sales reps
- View client details and policies
- Sales Rep Management
- Monitor sales rep performance
- View assigned clients
- Track policy sales
- Policy Management
- Create new insurance policies
- Edit existing policies
- Archive policies
- Search and filter policies
- Policy Types
- Life Insurance
- Health Insurance
- Vehicle Insurance
- Client Management
- View assigned clients
- Add new clients
- Track client policies
- Policy Management
- View available policies
- Create policy applications
- Track policy status
- Main Dashboard:
/manager-dashboard
- Client Management:
/manager-dashboard/clients
- Sales Rep Management:
/manager-dashboard/sales-reps
- Main Dashboard:
/underwriter-dashboard
- Policy Management:
/underwriter-dashboard/policies
- Main Dashboard:
/sales-rep-dashboard
- Client Management:
/sales-rep-dashboard/clients
- Policy Applications:
/sales-rep-dashboard/policies
- Framework: Next.js 14
- Language: TypeScript
- Styling: Tailwind CSS
- Icons: Lucide Icons
- State Management: React Hooks
- Form Handling: React Forms
- Authentication: NextAuth.js (to be implemented)
- API Integration: REST API (to be implemented)
src/
├── app/
│ ├── (manager)/
│ │ └── manager-dashboard/
│ ├── (underwriter)/
│ │ └── underwriter-dashboard/
│ └── (sales-rep)/
│ └── sales-rep-dashboard/
├── components/
│ ├── ui/
│ └── shared/
└── lib/
└── utils/
- Clone the repository:
git clone https://github.com/your-username/insurance-brokerage-frontend.git
- Install dependencies:
npm install
- Run the development server:
npm run dev
- Open http://localhost:3000 in your browser.
Create a .env.local
file in the root directory:
NEXT_PUBLIC_API_URL=your_api_url
NEXTAUTH_SECRET=your_secret
NEXTAUTH_URL=http://localhost:3000
-
Code Style
- Use TypeScript for type safety
- Follow ESLint rules
- Use Prettier for formatting
-
Component Structure
- Use functional components
- Implement proper TypeScript interfaces
- Follow atomic design principles
-
State Management
- Use React hooks for local state
- Implement proper error handling
- Add loading states
-
Styling
- Use Tailwind CSS classes
- Follow mobile-first approach
- Maintain consistent spacing
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature
) - Commit your changes (
git commit -m 'Add some AmazingFeature'
) - Push to the branch (
git push origin feature/AmazingFeature
) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.