Prompt - 1:
—------------
Create a Home Page for as Step 1 of BookMyShow clone with these features just build the
below pages and do not go beyond my prompt:
1. Landing Page:
○ Display featured movies/shows.
2. Movie Listings:
○ List movies with posters, details, and genres on the Landing Page
3. Responsive Design:
○ Ensure it works on both mobile and desktop.
Prompt - 2:
—----
Add user authentication and data management features to the app and if it requires DB tables
write that code and apply the changes by ourself.
1. User Authentication:
○ Implement sign-up and login functionality.
○ Support email/password
2. Data Storage and Display:
○ Store user profiles and app data in a database.
○ Display real-time data for movies, bookings, and user preferences.
3. Advanced Backend Features:
○ Integrate AI features (e.g., personalized recommendations).
○ Set up email notifications for booking confirmations.
○ Implement payment gateway (mock for now).
○ Add scheduled tasks for updates (e.g., movie availability).
Prompt 3:
—-----------
Implement the functionality where clicking “Book Tickets” displays the available theaters and
showtimes for a selected movie.
1. Theater Details:
○ When users click on "Book Tickets", display the theaters where the movie is
showing.
○ Use an H2 heading: "Theaters Showing [Movie Name]".
2. Showtime Timings:
○ Below the heading, list the showtimes for the selected movie at each theater.
○ Display the showtimes in a clear, structured format (e.g., table or list).
Prompt 4:
—----------
Enable seat selection for a selected showtime, showing available and filled seats with the
following functionality:
1. Theater Layout:
○ After selecting a showtime, display the theater layout with seats.
○ Filled seats should be shown as gray boxes (unselectable).
○ Available seats should be shown with a green border and green seat
numbers inside the box.
2. Seat Selection Logic:
○ Allow users to select available seats only (green boxes).
○ Unavailable seats (gray boxes) should be disabled and cannot be selected.
3. Dynamic Seat Count:
○ The number of seats available for selection should depend on how many seats
the user selected earlier when browsing the movie card (e.g., selecting "2
tickets" will allow seat selection for 2 seats).
Prompt 5:
After the user selects seats, direct them to a payment page where they can complete the
booking by paying through various methods.
1. Payment Page Display:
○ After seats are selected, redirect the user to the payment page.
○ Show a summary of the movie, selected seats, and total amount on the payment
page.
2. Payment Methods:
○ Provide the following payment options:
■ Debit Card
■ Credit Card
■ UPI (Unified Payments Interface)
3. Payment Process:
○ Implement payment gateway integration for each method.
○ On successful payment, show a confirmation message and booking receipt.
Additional Prompts
Prompt 6:
Add a horizontally scrollable date selection row below the seat selection area, allowing users
to choose a date and view respective showtimes.
1. Horizontal Date Row:
○ Add a scrollable row of dates below the Number of Seats section.
○ Each date should be clickable, and selecting a date will show available
showtimes for that date.
2. Show Hall and Showtime Details:
○ After the user selects a date, display the theaters (halls) and showtimes for that
day.
○ Show the respective halls along with their available showtimes.
3. Layout & UI:
○ Ensure that the dates are scrollable horizontally and displayed clearly with
proper separation.
○ The layout should be intuitive and easy to navigate.
