Campexxa is a full-stack web application for discovering, creating, and reviewing outdoor and leisure spots such as campgrounds, hiking spots, and food destinations. It is built with a scalable architecture and focuses on usability, personalization, and performance.
Campexxa enables users to explore and share "spots" for travel and leisure. Users can create listings, upload images, leave reviews, and manage their activity through a personalized dashboard.
The platform is designed with modular backend architecture, reusable frontend components, and optimized data handling techniques such as pagination and infinite scrolling.
- Full CRUD functionality for spots
- Dynamic search with fuzzy matching
- Advanced filtering and sorting system on price, location, distance, and ratings
- Interactive maps using Mapbox
- Review and rating system
- User dashboard with tabs (spots, saved, reviews, profile)
- Authentication:
- Local (username/password)
- OAuth (Google, GitHub, Facebook)
- Image upload and management via Cloudinary and Multer
- Pagination and infinite scroll system
- Reusable EJS components for scalability
- Geolocation-based features
- Single-currency pricing system
- Implemented reusable pagination + infinite scroll system using partial rendering and AJAX
- Designed modular API response handler (
sendPaginatedResponse) for consistent frontend updates - Abstracted OAuth logic into reusable middleware to avoid duplication across providers
- Used
lean()+ virtuals for performance optimization in MongoDB queries - Reduced DOM re-renders using partial updates
- Implemented debounced search for better UX
- Structured dashboard with tab-based rendering to reduce route complexity
- Input validation using Joi
- Protection against NoSQL injection (
mongoSanitize) - Authentication with Passport.js
- Rate limiting for sensitive routes (login, forgot password)
- Session-based authentication with secure cookies
- Modular MVC architecture
- Reusable utility functions
- Separation of concerns (routes, controllers, utils)
- Designed to easily plug in frontend frameworks (React-ready backend)
- Modular MVC structure (controllers, routes, models)
- Reusable utility functions and EJS:
- Pagination handling
- Partial rendering for infinite scroll
- API abstraction
- Clean separation of concerns
- Optimized rendering with partials and AJAX
- OAuth flow handled with reusable middleware
 |
 |
 |
| Homepage | Dashboard 01 | Dashboard 02 |
 |
 |
 |
| Dashboard 03 | Filter | Footer |
 |
 |
 |
| Listing 01 | Listing 02 | Login |
 |
 |
 |
| Mobile Navbar | New Form | Register 01 |
 |
 |
 |
| Register 02 | Review Page 01 | Review Page 02 |
 |
 |
 |
| Searching 01 | Searching 02 | Show Page |
Lighthouse audit results across all routes:
| Metric | Standard Routes | /campgrounds (Heavy Route) |
|---|---|---|
| Performance | 95+ | 58–60 (avg) |
| SEO | 100 | 100 |
| Accessibility | 100 | 100 |
| Best Practices | 100 | 100 |
| FCP | — | 1.7s |
| LCP | — | 2.6–2.7s |
| CLS | — | 0 |
| Total Blocking Time | — | ~700ms |
Audited across 10 consecutive tests on the live deployment.
- Achieved 100% Pass Consistency: Engineered a deterministic test suite with zero flaky tests across consecutive runs, ensuring high reliability and deployment readiness.
- Comprehensive Route Coverage: Implemented 52 test cases across 8 suites, validating full lifecycles for Authentication, CRUD operations, Review systems, and Dashboard actions.
- Realistic Integration Testing: Utilized MongoMemoryServer to simulate real-world database behavior, enabling isolated CRUD validation and faster execution without production dependencies.
- External Dependency Isolation: Orchestrated full mocking for third-party services including Mapbox, Cloudinary, Multer, and Email APIs to ensure controlled, deterministic results.
- Robust Edge Case Validation: Strengthened backend resilience by explicitly testing unauthorized access, malformed request bodies, ownership-based authorization, and ObjectId CastError handling.
- Optimized Test Infrastructure: Leveraged
supertest.agent()for persistent sessions and implemented security bypasses for CSRF and rate-limiting, maintaining a total suite runtime of ~16.5 seconds.
- Vulnerability Remediation: Resolved 100% of medium & high-risk vulnerabilities detected by OWASP ZAP, achieving a clean security scan.
- Strict Security Policies: Enforced strict Content Security Policy (CSP) via Helmet, eliminating all inline scripts and mitigating XSS risks.
- CSRF Hardening: Implemented custom CSRF protection for
multipart/form-data(file uploads) usingcsurfwithout breaking functionality. - Brute-Force Protection: Secured authentication flows with
express-rate-limitto mitigate automated abuse. - Input Sanitization: Prevented NoSQL injection and XSS by applying Joi validation and MongoDB sanitize middleware.
- Query Optimization: Reduced query payload significantly by using
.lean({ virtuals: true })and selectivepopulate()with field-level selection. - Caching Strategy: Implemented an in-memory cache with a 30-second TTL, reducing failed requests on the campgrounds index by ~99% under load.
- Stress Test Results: Load tested 4 major public routes at 5 req/sec over 60 seconds:
/campgrounds— 99.3% success (mean 3.9s)/campgrounds/:id— 100% success (mean 659ms)
- Capacity Mapping: Identified a server threshold of ~7 req/sec on the Render free-tier, documenting performance degradation points for future scaling.
Verified core REST API endpoints for status codes (200, 302, 401), authentication-protected routes, and response times (<2s):
- Auth: Login, Register, Logout
- Business Logic: Campground CRUD, Review System (Create/Delete)
- User Management: Dashboard aggregation and profile updates
Audited across 10 consecutive tests on the live deployment.
Production-Ready Backend: This comprehensive testing architecture ensures high reliability and 100% functional coverage. 📂 View Test Implementation: Jest & Supertest | Artillery Config | Postman Collections
- Improved UI using Tailwind CSS
- Migration to a modern frontend framework (e.g., React)
- Caching layer for faster response times
- Real-time chat between users
- Multi-currency pricing system
- Real-time email notifications for login and other web app activities
This project includes practical solutions to real-world issues such as:
- Preserving
returnToacross OAuth flows usingres.locals - Handling session persistence during redirects
- Implementing reusable infinite scroll architecture
- Managing dynamic UI updates without frontend frameworks.
- Mongo virtuals disappear after using lean() in backend.
Here are a few blogs which i published on hashnode, during development of this project.
- Blog 1 – OAuth returnTo fix
- Blog 2 – Pagination Vs Infinite scroll architecture
- Blog 3 – Dynamic Searching
- Blog 4 – Mongoose virtual disappear after .lean()
Abinash Dash
- GitHub: AbiDev2003
- LinkedIn: abinashdev