Recent works

Developing Booking Interface for Long Term Car Rentals

Timeline

  • January - March 2025

My Roles

  • FrontEnd Developer

Tech Stack

  • AntDesign
  • NextJS
  • TailwindCSS
  • Zustand

HaupCar is a Thailand-based car rental company, and they plan to revamp the UI of their long-term car rental feature, also migrating their API to a newer version.

They already have a Figma design, and my responsibility is to translate the UI and connect it to their new UI. The project is already set up using Next.js and AntDesign components but still has a lot to do, especially building the search component.

Work sample
Search Components
  • Pickup location. The Pickup location field may seem like a straightforward input, but its functionality is more involved. This field requires the management of several states. Initially, when a user searches for a location, n API call must be executed to the backend API, based on the provided input. The returned locations are then presented as selectable options for the user. Furthermore, the chosen state needs to be stored within the query parameters. Luckily AntDesign Component has API to manage this state, especially managing the API Call process, it has api to handle the error/empty state.
  • Pickup Destinations.This field is similar to Pickup Locations, but with an added condition, it initially displays favorite destinations. The API call made when a user searches also depends on the value selected in the Pickup Location field.