Build impressive real estate Airbnb with booking system Admin dashboard with all features and user dashboard for the same authentication
Generated Prompt
## APPLICATION OVERVIEW This project is a web application designed for a real estate Airbnb platform with a comprehensive booking system. It includes an admin dashboard for managing listings and users, as well as a user dashboard for booking and managing reservations. The application aims to provide a seamless experience for both property owners and guests. ## CORE FEATURES 1. **User Authentication**: Secure login and registration for users and admins, allowing for personalized experiences and data protection. 2. **Property Listings**: A searchable database of available properties with detailed descriptions, photos, and pricing. 3. **Booking System**: A robust booking engine that allows users to check availability, make reservations, and process payments. 4. **Admin Dashboard**: A feature-rich interface for property managers to add, edit, and remove listings, view bookings, and manage users. 5. **User Dashboard**: A personalized space for users to view their bookings, update profile information, and leave reviews. 6. **Search & Filters**: Advanced search functionality with filters for location, price range, and amenities to help users find the perfect property. ## DESIGN SPECIFICATIONS - **Visual Style**: Minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography. - **Color Mode**: Light theme with dark text on light backgrounds for enhanced readability and a modern feel. - **Layout**: A responsive grid layout that adjusts to different screen sizes, featuring a top navigation bar, main content area for property listings, and sidebars for filters and user options. - **Typography**: Use of sans-serif fonts such as Inter or Roboto for a clean, modern look. Headings should be bold and prominent, while body text should be legible and well-spaced. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript for type safety and component-based architecture. - **Styling**: Tailwind CSS for utility-first styling, ensuring a fast and responsive design process. - **UI Components**: Use shadcn/ui components for a consistent and visually appealing user interface. - **State Management**: Implement state management with React Context or Redux if necessary for global state handling. ## IMPLEMENTATION STEPS 1. **Set Up Development Environment**: Initialize a new React project with TypeScript and Tailwind CSS. 2. **Create Authentication System**: Implement user authentication with secure login and registration features using Firebase or Auth0. 3. **Develop Admin Dashboard**: Build the admin interface to manage property listings and user accounts, utilizing CRUD operations. 4. **Build User Dashboard**: Create the user interface for managing bookings and displaying user-specific information. 5. **Implement Booking System**: Develop the booking functionality with calendar integration for availability checking and payment processing. 6. **Design and Integrate UI Components**: Use shadcn/ui components for consistent styling and responsive design across the application. 7. **Testing and Quality Assurance**: Conduct thorough testing to ensure all features function as intended and the application is responsive across devices. ## USER EXPERIENCE Users will experience a smooth onboarding process through an easy registration and login system. They can seamlessly navigate through property listings using filters to find their desired accommodation. The booking process will be intuitive, guiding users step-by-step from selection to payment. Admins will have full control over property management in a centralized dashboard, with quick access to user data and analytics. The minimalist design will enhance usability, making it straightforward for users to focus on their tasks without distractions.
Loved by thousands of makers from
From early prototypes to real products, they started here.







































Generate optimized prompts for your vibe coding projects
Generate prompt
Enter a brief description of the app you want to build and get an optimized prompt
Review and use your prompt
Review (and edit if necessary) the generated prompt, then copy it or open it directly in your chosen platform
Get inspired with new ideas
Get AI-generated suggestions to expand your product with features that will surprise your users
Frequently Asked Questions
Everything you need to know about creating better prompts for your Lovable projects
Still have questions?
Can't find what you're looking for? We're here to help!
