Rossa Booking Management Calendar

Rossa is a management software product for hotels from a company based in Soria, Spain. For a while, their clients had been asking for a interactive calendar view to manage bookings across their rooms and properties, similar to the interface Airbnb offers with its advanced hosting controls.

I was hired via Malt (check out my profile) to build the calendar with React, using their existing API and integrating with their non-React web application. They were looking for expertise in React, to get it done quickly and with a high quality result. The UI was relatively complex, with some requirements like loading thousands of days, lazy loading hundreds of bookings, drag & drop...

Web applications built with React are my comfort zone. I just love doing this. I've been doing it for years, and I know the ins and outs of building highly interactive complex interfaces in web applications. This was a perfect project for me.

After completing the project, here's their feedback:

It is a true pleasure to work with Guillermo, a magnificent professional, attentive, and willing... The truth is that working with him has been a real pleasure. We highly recommend him. Thank you very much!!

Es un verdadero placer trabajar con Guillermo, un magnífico profesional, atento, dispuesto... la verdad que trabajar con él ha sido un verdadero placer. Lo recomendamos al 100%. Muchas gracias!!

Some interesting facts of the project:

• Developed and built using Vite.
• For styling and building UI components, I used Tailwind CSS due to its popularity, thinking of other devs picking up the project in the future.
• TypeScript.
• Native drag and drop for the booking cards to change room and dates.
• Select dates directly on the calendar to start creating a new booking.
• Used TanStack Query (React Query) in unconventional ways to fetch and manage paginated state for a calendar view that can be scrolled horizontally in both directions.