A
Anonymous

Movie App - Copy this React, Tailwind Component to your project

Create a responsive movie search and watchlist web application using React and Tailwind CSS. The app should have four main components: Navbar Component: Includes a logo, a search bar to search for movies, and a link to a GitHub repository. MoviesList Component: Takes up 2/3 of the screen width, initially displays no movies, and dynamically shows movie data based on search input. WatchList Component: Takes up 1/3 of the screen width, initially empty, and shows movies added to a watch list. When a movie is added to the watch list, it appears in this component. MovieDetails Component: Displays detailed information about a selected movie when clicked from the MoviesList. This component appears in the place of the WatchList and includes a rating option and an "Add to Watchlist" button. When the movie is added or the component is closed, the WatchList reappears. The app should be responsive, with the MoviesList, WatchList, and MovieDetails components stacked vertically on smaller screens and side by side on larger screens. Use only React for functionality and Tailwind CSS for styling.

Prompt
Component Preview

About

MovieApp - Create a responsive movie search and watchlist with a Navbar, MoviesList, WatchList, and MovieDetails. Built with React and. Download code free!

Share

Last updated 1 month ago