Connecting Civil Engineering Professionals with Clients Through Centralized Service Discovery
A comprehensive full-stack business directory platform that bridges the gap between construction professionals and clients. Civil Universe enables contractors, architects, fabricators, and design firms to showcase expertise while allowing homeowners, businesses, and project managers to discover, book, and manage construction services seamlessly.
The Challenge: The civil engineering and construction industry lacks a centralized platform. Clients struggle to find reliable contractors and professionals, while service providers have no unified way to showcase expertise, manage bookings, and connect with potential clients. Discovery is fragmented, trust is hard to establish, and project management is scattered across multiple tools.
Our Solution: Civil Universe provides a single, integrated marketplace where construction professionals and clients meet, collaborate, and succeed together.
- 🔍 Advanced Business Directory - Searchable, filterable database of verified civil engineering professionals with specialized category tags
- 📅 Real-Time Appointment Booking - Instant scheduling system with calendar management and automated confirmations
- 👤 Multi-Role Access Control - Tailored interfaces for contractors, architects, fabricators, clients, and project managers
- 📊 Business Analytics Dashboard - Comprehensive insights into bookings, performance metrics, and client engagement
- ⭐ Rating & Review System - Trust-building through verified client reviews and professional ratings
- 💬 Real-Time Messaging - Direct communication between clients and service providers with live notifications
- 💳 Payment Integration - Secure transactions via Stripe/Razorpay with support for multiple payment methods
- 📱 Mobile-Responsive Design - Fully optimized for all devices with mobile-first approach
- 🗺️ Location-Based Services - Google Maps API integration for service area mapping
- React.js 18 - Modern component-based UI library
- Redux Toolkit - Predictable state management with simplified store setup
- RTK Query - Built-in data fetching and caching for optimized API calls
- Tailwind CSS - Utility-first styling for responsive, customizable UI
- Chart.js - Advanced data visualization for analytics dashboard
- Socket.io Client - Real-time communication and live notifications
- React Router - Client-side routing with protected routes
- React Hook Form - Efficient form handling with validation
- Axios - HTTP client with interceptors for API communication
- Node.js & Express.js - High-performance, scalable server
- MongoDB with Mongoose - Flexible document database with ODM
- Socket.io - WebSocket support for real-time features
- JWT Authentication - Stateless, secure token-based auth
- bcryptjs - Industry-standard password hashing
- Express Rate Limit - DDoS protection and API rate limiting
- Stripe/Razorpay - Secure payment processing
- Google Maps API - Location services and mapping
- CORS & CSRF Protection - Advanced security headers
- Input Sanitization - Comprehensive data validation
- Node.js (v14 or higher)
- MongoDB (local or Atlas cloud instance)
- Git for version control
- API keys: Stripe/Razorpay, Google Maps (optional)
-
Clone the repository
git clone https://github.com/kasimlohar/Civil_Universe.git cd Civil_Universe -
Automated setup
npm run setup
This installs all dependencies for both client and server.
-
Configure environment variables
Frontend (
client/.env.local):REACT_APP_API_URL=http://localhost:5000 REACT_APP_SOCKET_URL=http://localhost:5000 REACT_APP_GOOGLE_MAPS_KEY=your_google_maps_api_key
Backend (
server/.env):MONGO_URI=your_mongodb_connection_string JWT_SECRET=your_jwt_secret_key PORT=5000 NODE_ENV=development CLIENT_URL=http://localhost:3000 STRIPE_SECRET_KEY=your_stripe_secret RAZORPAY_KEY_SECRET=your_razorpay_secret
Refer to
.env.examplefiles in each directory for complete variable list. -
Start development server
npm run dev
This starts both client (http://localhost:3000) and server (http://localhost:5000) concurrently.
# Run frontend only
npm run client
# Run backend only with auto-reload
npm run server:dev
# Production build
npm run buildCivil_Universe/
├── client/ # React frontend
│ ├── src/
│ │ ├── components/ # Reusable UI components
│ │ ├── pages/ # Page components
│ │ ├── redux/ # Redux store configuration
│ │ ├── services/ # API services
│ │ ├── App.js # Main app component
│ │ └── index.js # Entry point
│ ├── public/ # Static assets
│ └── package.json
│
├── server/ # Express backend
│ ├── models/ # MongoDB schemas
│ ├── routes/ # API endpoints
│ ├── controllers/ # Business logic
│ ├── middleware/ # Auth, validation, error handling
│ ├── utils/ # Helper functions
│ ├── index.js # Server entry point
│ └── package.json
│
├── scripts/ # Development utilities
├── CONNECTION_GUIDE.md # Setup instructions
├── AUTHENTICATION_GUIDE.md # Security documentation
├── package.json # Root configuration
└── README.md
Civil Universe implements enterprise-grade security across multiple layers:
- JWT-Based Authentication - Secure, stateless token system
- Password Hashing - bcryptjs for industry-standard encryption
- Rate Limiting - Express rate limit middleware prevents brute force attacks
- CSRF Protection - Token-based CSRF prevention for state-changing operations
- Input Sanitization - Comprehensive validation on all user inputs
- Protected Routes - Frontend and backend route protection by user role
- CORS Configuration - Restricted cross-origin requests
See AUTHENTICATION_GUIDE.md for detailed security implementation.
MERN Stack Design: The project follows a clean separation of concerns with decoupled frontend and backend, enabling independent scaling and maintenance.
RESTful API: Well-structured endpoints following REST conventions with consistent response formatting and comprehensive error handling.
Real-Time Communication: Socket.io integration enables instant messaging, live notifications, and appointment confirmations without page refreshes.
State Management: Redux Toolkit with RTK Query provides predictable state updates and automatic API caching, reducing unnecessary network calls.
Component Architecture: Modular, reusable components with clear responsibilities support multiple user types (clients, contractors, architects, etc.) without code duplication.
Responsive Design: Tailwind CSS utility-first approach ensures consistent styling and mobile-first development across all screen sizes.
| Component | Progress | Details |
|---|---|---|
| Frontend | 75% Complete | Comprehensive component library, UI fully responsive |
| Backend | 40% Complete | Core API and authentication implemented, payment integration in progress |
| Authentication | ✅ Complete | JWT, rate limiting, CSRF protection all in place |
| Real-Time Features | ✅ Complete | Socket.io messaging and notifications working |
| Database | ✅ Complete | MongoDB schema designed for scalability |
Authentication:
POST /api/auth/register- User registrationPOST /api/auth/login- User loginPOST /api/auth/logout- User logout
Business Directory:
GET /api/businesses- List all businesses with filtersGET /api/businesses/:id- Get business detailsPOST /api/businesses- Register new business (Auth required)
Appointments:
GET /api/appointments- List user appointmentsPOST /api/appointments- Create new appointmentPUT /api/appointments/:id- Update appointment status
Messaging:
GET /api/messages/:conversationId- Get conversation historyPOST /api/messages- Send message (Real-time via Socket.io)
Reviews:
POST /api/reviews- Submit review (Auth required)GET /api/businesses/:id/reviews- Get business reviews
For complete API documentation, see CONNECTION_GUIDE.md.
What This Project Demonstrates:
I've built Civil Universe to showcase deep expertise in full-stack development with production-ready practices:
- Advanced React State Management - Redux Toolkit with async thunks and RTK Query for complex application state
- Secure Authentication Systems - JWT implementation with rate limiting and CSRF protection
- Real-Time Web Applications - Socket.io integration for live messaging and notifications
- Full-Stack MERN Architecture - From database design through responsive UI
- Security Best Practices - Input validation, sanitization, protected routes, and proper error handling
- Responsive Design - Mobile-first approach with Tailwind CSS
Key Takeaways:
Modular architecture is essential for scaling teams and features. Real-time capabilities dramatically improve user experience and engagement. Security must be built in from day one, not retrofitted. Proper error handling and user feedback transforms usability. State management discipline prevents debugging nightmares in complex applications.
Reflections:
If starting over, I would implement comprehensive testing (Jest, Cypress) earlier in development and containerize with Docker from the beginning for consistent development environments. These practices prevent technical debt and enable faster onboarding for team members.
In Progress:
- 🔄 Backend API completion (targeting 100%)
- 🔄 Advanced payment processing with Stripe/Razorpay
- 🔄 Enhanced file management system
- 🔄 Admin dashboard for platform management
Coming Next:
- 📱 Native mobile application (React Native)
- 📊 Advanced analytics and business intelligence
- 🤖 AI-powered service recommendations
- 🔔 Push notifications for mobile
- 📈 Performance and reputation scoring
Known Limitations:
- Backend still in development (40% complete)
- Payment integration not yet production-ready
- Mobile app development not yet started
- Advanced analytics features pending backend completion
The project includes testing infrastructure for reliability:
- Jest - Unit tests for components and utilities
- Cypress - End-to-end testing for user workflows
- Mock Service Worker (MSW) - API mocking for isolated testing
- Linting - ESLint for code quality consistency
Comprehensive guides included in repository:
- CONNECTION_GUIDE.md - Step-by-step setup and configuration
- AUTHENTICATION_GUIDE.md - Security implementation details
- Component Documentation - UI component library reference
We welcome contributions following standard Git workflow:
- Fork the repository
- Create feature branch (
git checkout -b feature/amazing-feature) - Commit changes with clear messages (
git commit -m 'Add amazing feature') - Push to branch (
git push origin feature/amazing-feature) - Open Pull Request
Code Standards:
- Follow existing code style and patterns
- Write meaningful commit messages
- Include tests for new features
- Update documentation as needed
This project is licensed under the ISC License - see LICENSE file for details.
Civil Universe is built and maintained by a dedicated founding team:
| Role | Person | GitHub |
|---|---|---|
| Technical Lead | Kasim Lohar | @kasimlohar |
| Business Operations | Hemraj Metkar | - |
Contact: kasimlohar2@gmail.com
Built with a vision to revolutionize how construction professionals and clients connect. Special thanks to our early users and advisors for valuable feedback shaping Civil Universe's direction.
For issues, feature requests, or questions:
- Open an issue on GitHub
- Email: kasimlohar2@gmail.com
- Check documentation: CONNECTION_GUIDE.md, AUTHENTICATION_GUIDE.md
Building the Future of Civil Engineering Services 🏗️
View on GitHub | LinkedIn | Contact
⭐ If you find this project helpful, consider giving it a star!