A modern insurance management web application with Thai language support
Demo โข Documentation โข Report Bug โข Request Feature
- About
- Features
- Demo
- Tech Stack
- Getting Started
- Usage
- Project Structure
- Roadmap
- Contributing
- License
- Contact
- Acknowledgments
InsuranceMate is a comprehensive web application designed to help Thai users manage their insurance policies efficiently. Built with modern web technologies and featuring a premium user interface, it provides an intuitive way to track policies, submit claims, and communicate with insurance agents.
- ๐ Premium UI/UX - Beautiful gradient-based design with smooth animations
- ๐น๐ญ Thai Language - Complete Thai language support with Prompt font
- ๐ฑ Fully Responsive - Works seamlessly on desktop and mobile devices
- ๐ Authentication - Secure login/register system with session management
- ๐พ Data Persistence - LocalStorage-based backend (Firebase-ready)
- โก Zero Dependencies - Pure HTML, CSS, and Vanilla JavaScript
| Feature | Description | Status |
|---|---|---|
| ๐ Dashboard | View all insurance policies and expiry alerts | โ Complete |
| ๐ Authentication | Login/Register with email & password | โ Complete |
| ๐จโ๐ฉโ๐งโ๐ฆ Family Management | Track policies for family members | โ Complete |
| ๐ค Claims Processing | Submit and track insurance claims | โ Complete |
| ๐จโ๐ผ Agent Portal | Contact and chat with insurance agents | โ Complete |
| ๐ Agent Search | Find and connect with new agents | โ Complete |
| ๐ Reports | Generate summary reports and export PDF | โ Complete |
| โ๏ธ Settings | Customize app preferences | โ Complete |
- โ Full authentication system with LocalStorage backend
- โ Add family member with avatar selection
- โ Make appointment with insurance agent
- โ Settings page with user preferences
- โ Export PDF reports (simulated)
- โ 12+ new interactive features
Try the app: InsuranceMate Demo
Demo Account:
Email: demo@email.com
Password: password
| Login Page | Dashboard | Family Management |
|---|---|---|
| Claims | Agent Portal | Settings |
|---|---|---|
- HTML5 - Semantic markup
- CSS3 - Variables, Grid, Flexbox, Animations
- Vanilla JavaScript - ES6+ features, no frameworks
- LocalStorage API - Client-side data persistence
- Session Management - User authentication state
- Firebase Authentication - Real user authentication
- Cloud Firestore - NoSQL cloud database
- Firebase Storage - File storage for documents
- Google Fonts - Prompt font family for Thai typography
- Custom CSS Variables - Theming system
- SVG Icons - Inline scalable icons
- Modern web browser (Chrome, Firefox, Safari, Edge)
- Text editor (VS Code, Sublime Text, etc.)
- Local web server (optional): XAMPP, Live Server, or Python HTTP server
-
Clone the repository
git clone https://github.com/pongsakfms-commits/insurance-mate.git cd insurance-mate -
Open with a web server
Option A: Using VS Code Live Server
- Install "Live Server" extension - Right-click on index.html - Select "Open with Live Server"Option B: Using Python
python -m http.server 8000 # Open http://localhost:8000/login.htmlOption C: Using XAMPP
- Copy files to htdocs folder - Open http://localhost/insurance-mate/login.html -
Start using the app
Navigate to: http://localhost:8000/login.html Login with: demo@email.com / password
See QUICKSTART.md for a detailed quick start guide.
- Login to your account or Register a new one
- View your insurance policies on the dashboard
- Add family members and their policies
- Submit claims with supporting documents
- Contact your insurance agent directly
- Generate annual summary reports
- Explore the codebase structure
- Customize the design in
styles.css - Add features in
app.js - Test your changes locally
- Submit a pull request
insurance-mate/
โโโ ๐ index.html # Main application page
โโโ ๐ login.html # Login/Register page
โโโ ๐จ styles.css # Global styles (24KB)
โโโ โ๏ธ app.js # Application logic (55KB)
โโโ ๐ง firebase-config.js # Firebase config template
โ
โโโ ๐ Documentation
โ โโโ README.md # This file
โ โโโ USER_MANUAL_TH.md # Thai user manual (25KB)
โ โโโ BACKEND_README.md # Backend documentation
โ โโโ QUICKSTART.md # Quick start guide
โ โโโ FIREBASE_SETUP.md # Firebase setup guide
โ โโโ CONTRIBUTING.md # Contribution guidelines
โ โโโ CHANGELOG.md # Version history
โ โโโ FILES_TO_UPLOAD.md # GitHub upload checklist
โ
โโโ โ๏ธ LICENSE # MIT License
Total: 13 files | ~120KB | 1,800+ lines of code
- Premium UI design with Thai language
- Responsive layout for all devices
- 6+ main pages with full functionality
- Modal system for detailed views
- Smooth animations and transitions
- Login/Register system
- LocalStorage data persistence
- Session management
- User authentication flow
- Firebase Authentication
- Cloud Firestore database
- Real-time data synchronization
- Firebase Storage for files
- Multi-device support
- Push notifications
- OCR policy scanning
- Payment gateway integration
- Progressive Web App (PWA)
- Mobile app (React Native/Flutter)
- English language support
- Dark mode theme
- Advanced analytics
Contributions are what make the open source community amazing! Any contributions you make are greatly appreciated.
- Fork the Project
- 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
See CONTRIBUTING.md for detailed guidelines.
Thanks to these wonderful people:
This project is licensed under the MIT License - see the LICENSE file for details.
TL;DR: You can use, modify, and distribute this project freely, even for commercial purposes.
Project Maintainer: Pongsakfms
- GitHub: @pongsakfms-commits
- Email: support@insurancemate.com (simulated)
- Website: insurancemate.com (demo)
Project Link: https://github.com/pongsakfms-commits/insurance-mate
- Google Fonts - Prompt font family
- UI Avatars - Avatar generation
- Shields.io - README badges
- Keep a Changelog - Changelog format
- Semantic Versioning - Version numbering
โญ Star this repo if you find it helpful!
Made with โค๏ธ for Thai Insurance Users