Architecture & Performance

The project required handling complex user flows, particularly the multi-stage booking process. I chose Next.js combined with Tailwind CSS to build a responsive interface that guides users seamlessly through these steps. To manage the intricate state of the booking wizard without performance hits, I used Zustand for its lightweight footprint and ease of use. This is complemented by TanStack Query, which works in the background to fetch availability slots and service details. The backend logic is secured by Zod validation and stored in a normalized Postgres database, creating a robust system.

The Core Challenge

The interface guides the user smoothly, but the underlying logic required rigorous engineering. The system had to handle precise synchronization between workshop settings, calendar calculations, and real-time user bookings.

1. Workshop Administration Hub -> I built a comprehensive dashboard allowing owners to configure their ecosystem - from defining service catalogs to managing recurring opening hours. These settings act as the source of truth that dynamically drives the booking engine's logic.
2. Smart Data Fetching -> To handle dynamic data like workshop schedules, I used TanStack Query. It manages fetching, caching, and updating data in the background, keeping the dashboard interface responsive and up-to-date without needing manual page refreshes.
3. Scheduling Engine -> Handling dates required precise manipulation. I implemented custom temporal calculations to generate time slots dynamically based on variable service durations and operating hours, preventing scheduling overlaps.
4. Scalable Infrastructure -> To handle workshop branding, I integrated AWS S3. This ensures secure, scalable storage for user-uploaded images, keeping the main database lightweight and optimized.