Seat Selection of a Movie Theater 🎥

#javascript #webdev #css #html

In this project I am creating a seat selector UI for a movie theater. We will have a dropdown picker to select a movie, a legend to display if a seat is vacant, selected, or already reserved, a drawing of a theater and also some text to display the number of seats selected by the user and the total cost of the tickets.👓

Project Requirements🚩

Select the movie choices and seats in a theater in order to purchase tickets.🎫
Display UI with movie select, screen, seats, legend & seat info.🖥️
User can select a movie/price.💸
User can select/deselect seats..💺✔️
User can not select occupied seats. 🈯
Number of seats and price will update.🆕
Save seats, movie and price to local storage so that UI is still populated on refresh.👀

Source Code 👇

Github ➡️ https://github.com/itsahsanmangal/Tickets-for-Movie-Theater

Deploy 👇

Netlify ➡️ https://stoic-jang-c6ed81.netlify.app/

Hands-on debugging session: instrument, monitor, and fix

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

RSVP here →

Top comments (3)

Thomas Bnt • Jan 8 '22

Hey 👋🏼

This looks like a good post here. Can you share this in full on DEV?

DEV generally asks that folks share their posts in full if possible and there is tooling provided to make it so that it's relatively easy to repost from outside blogs.

Hope you'll consider sharing the full post going forward.