Orders - detailed, developer-ready build prompt for Lovable that will generate a fully functional online clothing boutique web app. The generated...
Generated Prompt
```markdown ## APPLICATION OVERVIEW This project is a fully functional web application for an online clothing boutique. It will feature a modern and responsive storefront, allowing users to browse products, manage their shopping cart, and complete orders securely. The application will include an admin dashboard for managing products and orders, as well as a booking system for customer consultations. ## CORE FEATURES - **Responsive Storefront**: A home page, shop/catalog, product detail pages, cart, checkout, about, and contact pages designed for a seamless shopping experience. - **Product Catalog**: Dynamic product listings with categories, images, sizes, colors, and prices sourced directly from a Supabase database. - **Shopping Cart and Checkout**: A fully functional shopping cart with add/remove/update capabilities, integrated with CinetPay for secure payment processing. - **Booking System**: Users can book appointments for styling sessions or fittings, with all bookings stored in a Supabase database. - **Admin Dashboard**: A restricted access area to manage orders, bookings, and products, using Supabase Auth for login controls. - **Social & Contact Links**: Easily editable contact information and social media links in the footer. ## 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 - **Primary Color**: #1978E5 (accent for buttons, links, highlights) - **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements - **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs - **Layout**: The layout will be structured with a clear navigation menu, a prominent hero section on the homepage, and dedicated sections for product display, booking, and informational pages. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript - **Styling**: Tailwind CSS - **UI Components**: shadcn/ui - **State Management**: [Use React's Context API or any preferred state management tool] ## IMPLEMENTATION STEPS 1. **Set Up the Project**: Create a new React project with TypeScript and set up Tailwind CSS. 2. **Configure Supabase**: Initialize Supabase for database and authentication. Set up tables for products, orders, and bookings. 3. **Build the Storefront**: Create components for the homepage, product catalog, product detail, cart, and checkout pages. 4. **Integrate Product Data**: Fetch product data from the Supabase database and implement search and filter functionality. 5. **Implement Shopping Cart**: Develop the shopping cart functionality with add/remove/update capabilities. 6. **Set Up Payment Processing**: Integrate CinetPay for payment processing, with real order confirmation and email receipt functionalities. 7. **Develop Booking System**: Create the booking feature with a calendar picker and save bookings to Supabase. 8. **Create the Admin Dashboard**: Build a separate admin page for managing orders, products, and bookings. Implement Supabase Auth for restricted access. 9. **Add Social & Contact Links**: Create a footer with editable contact and social media links. 10. **Testing and Deployment**: Test all functionalities thoroughly and deploy the application to a hosting service. ## USER EXPERIENCE Users will have a straightforward shopping experience with easy navigation through categories and products. They can add items to their cart, proceed to checkout, and manage bookings effortlessly. Admin users will have a streamlined interface for managing products and orders, ensuring all processes are efficient and user-friendly. ```
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!
