Project Description

Beachhouse is a Progressive Web App designed to simplify booking management for real estate professionals handling multiple properties. Users can track bookings across four statuses (inquiry, quotation, confirmed, and pre-confirmed) and two types (stays or events) across various properties.

• Next.js & TypeScript Leveraging Next.js as the primary framework allows for an optimized PWA experience, ensuring fast load times and smooth navigation. TypeScript brings type safety and robust code, making the app maintainable and scalable.
• Supabase Integration Supabase serves as the backend database, handling real-time updates and authentication securely. This setup allows users to access and update bookings in real time, ensuring no detail is missed.
• Google Calendar API Beachhouse uses the Google Calendar API to sync confirmed bookings with external calendars. Each property is color-coded, allowing users to quickly differentiate between properties directly within their Google Calendar.
• Tailwind CSS Tailwind CSS ensures a modern, responsive, and visually cohesive user interface. With a focus on UX, Beachhouse offers a seamless experience on both desktop and mobile devices.
• Chart.js for Data Visualization he Report Page uses Chart.js for displaying monthly statistics in a visually clear format, providing insights into performance metrics and trends.

Core Features

Comprehensive Booking Management Beachhouse tracks bookings across four stages: inquiry, quotation, confirmed, and pre-confirmed. Bookings can be categorized as either stays or events, across different properties. For complex events, users can add multiple sub-events within a booking.

Financial Tracking Each booking allows entry of costs, VAT, and payment records. For confirmed bookings, security deposits, returns, and partial refunds can be logged, providing complete financial transparency for every transaction.

User Activity History A comprehensive history log captures all updates to bookings by agents, giving full visibility into each change made to the booking data.

Calendar Integration Confirmed bookings are synced with Google Calendar, where each property is color-coded, allowing managers to view schedules at a glance. The app also has an internal calendar for viewing and filtering bookings by property, making schedule management simple and intuitive.

Monthly Report Page The Report Page, available to admins, displays monthly booking statistics to help managers analyze performance trends and make data-driven decisions.

Technologies