Cabin-In-Island - An Online Booking Travel & Tour for people fond of adventures

Cabin-In-Island
Client
A small boutique hotel with several luxurious cabins on the island.
Industry
Tourism
Company Size
3 - 5
Stack
React Query, Supabase, React Hook Form, Recharts
Project Duration
1 month (June. - July. 2023)
Visit Website

The client need a custom-built application to manage everything about the hotel: bookings, cabins and guests

This is the internal application used inside the hotel to check in guests as they arrive. They have nothing right now, so they need the API. Later they will probably want a customer-facing website as well, where customers will be able to book stays, using the same API. Users of the app are hotel employees. They need to be logged into the application to perform tasks. New users can only be signed up inside the applications(to guarantee that only actual hotel employees can get accounts). Users should be able to upload an avatar, and change their name and password.

Features

  1. Full management of hotel - App has a table view with all cabins, showing the cabin photo, name, capacity, price and current discount, and users should be able to update or delete a cabin, and to create new cabins.

  2. Enhanced status - With the help of React Query, the booking status can be "unconfirmed", "checked in", or "checked out". The table can be filterable by this import status. Other booking data includes: number of guest, number of nights, guest observations, whether they booked breakfast and adjustable breakfast price.

  3. Nice and simple dashboard - The dashboard displays important information for the last 7, 30 or 90 days. A list of guests checking in and out on the current day. Statistics on recent bookings, sales, checkins and occupancy rate. Using Recharts shows accurate data for users.

  4. Customize the app and design - Users could be able to define a few application-wide settings: breakfast price, min and max nights/booking, max guests/booking and finally switch the light and dark mode.

Lessons Learned

  1. Compound Component Pattern With Hooks - I chose hooks over render props or higher-order components. Components don’t have to be jammed together explicitly. And they can be written independently but are still able to communicate. Using compound component pattern can make the component reusable and using it some appropiate place you like.

  2. Ethical Considerations - The use of AI in software development raises ethical concerns, such as the potential for biased algorithms, privacy violations, and job displacement. Developers must consider these issues when integrating ChatGPT into their workflows.

  3. Inaccurate or Insecure Code - Although ChatGPT is a powerful language model, it is not infallible. It may generate incorrect or insecure code, which can lead to vulnerabilities and other issues in the software. Developers must remain vigilant and thoroughly review any code produced by the AI.

  4. Intellectual Property Concerns - As ChatGPT generates code, it can be difficult to determine ownership and attribution. This may lead to legal and ethical disputes over intellectual property rights, creating complications for developers and their organizations.

Next Steps

Create a new booking from this application directly especially when a new guest comes to hotel and check in immediately. And also edit a booking item and even add check in and check out times.

Another thing in real world hotel cabins or rooms actually don't have a fixed price throughout the entire year, so the user can set up different price on every single different day.

The next idea is to add a restaurant to this hotel so that the user can register a bill value each time that the guest goes to the restaurant. Finally, generate a PDF invoice that we could mail to the user after they have checked out.

Previous
Next