SportNest.

Tech Stack

By the Numbers

Description

SportNest is a full-stack sports facility booking platform, similar in spirit to Playo or BookMyTurf. Users can explore facilities such as football turfs, badminton courts, and swimming lanes, then book a specific date and time slot. Logged-in users can also list and manage their own facilities, turning the platform into a two-sided marketplace between facility owners and bookers rather than a simple listing site. Delivered strong client-side performance with an 86 Lighthouse Performance score and 1.2s First Contentful Paint.

Key Features

• Search facilities by name and filter by sport type using MongoDB $regex and $in queries
• Book facilities by selecting a date, time slot, and duration, with live price calculation
• View, track status, and cancel personal bookings from a private "My Bookings" page
• Add, update, and delete facility listings from a private "Manage My Facilities" dashboard
• Secure authentication — email/password and Google OAuth via Better Auth
• JWT issued and stored in an HttpOnly cookie, verified in Express middleware to protect private API routes
• Private routes stay authenticated on page reload — no unwanted redirect to login
• Light/dark theme toggle and Framer Motion page and component transitions
• Custom loading spinner and a friendly 404 page for unmatched routes
• Separate client and server architecture connected through REST APIs
• Deployed on Vercel with MongoDB Atlas as the database, with credentials secured via environment variables

Challenges Faced

Storing the JWT in an HttpOnly cookie instead of local storage meant rethinking how the client checked auth state — I had to make sure logged-in users stayed authenticated on a hard reload of any private route, without ever being incorrectly bounced to the login page. Coordinating that with Better Auth's Google OAuth flow, while keeping the Express middleware strict about verifying every protected request, was the trickiest part of the build. Getting the search and filter system right also took a few iterations — combining MongoDB's $regex for partial name matches with $in for multi-type filtering without slowing down the facilities list.

Future Improvements

Add real-time availability updates with WebSockets, implement an admin dashboard for facility owners, introduce payment gateway integration, and add email confirmation notifications for bookings.