/more-than-one

more-than-one Movie Project

Primary LanguageJavaScript

Movie Project

This is a movie database project, where it shows movies, their casts, ratings, trailers, related movies, genres, and so on.

This project uses The Movie DB API: https://api.themoviedb.org/3. It is up to you to use your Google and Postman skills to explore the API and understand the data.

A home page that shows popular movies

‏لقطة الشاشة ٢٠٢٣-٠٣-٢٤ في ١٢ ١٣ ٠٠ م

When you click one of the movies, you'll see the Single Movie

‏لقطة الشاشة ٢٠٢٣-٠٣-٢٤ في ١٢ ١٤ ٥٩ م

‏لقطة الشاشة ٢٠٢٣-٠٣-٢٤ في ١٢ ١٥ ٣٥ م

‏لقطة الشاشة ٢٠٢٣-٠٣-٢٤ في ١٢ ١٥ ٢٦ م

Navbar

A filter dropdown to filter the displayed movies in the home page, based

on (popular, relase date, top rated, now playing and up coming)

‏لقطة الشاشة ٢٠٢٣-٠٣-٢٤ في ١٢ ١٤ ٤١ م

Actor list page

‏لقطة الشاشة ٢٠٢٣-٠٣-٢٤ في ١٢ ١٤ ٠٠ م

About page that has a description of the website

‏لقطة الشاشة ٢٠٢٣-٠٣-٢٤ في ١٢ ١٦ ٢٤ م

Footer

we Add a universal footer that includes:

‏لقطة الشاشة ٢٠٢٣-٠٣-٢٤ في ١٢ ١٣ ٢٧ م

Styling

  • Using CSS and tailwind, display the page as a grid with 3 columns (3 movies in the same row)
  • Make it responsive where it displays 2 columns for tablets and 1 column for phones

Single Movie Page

  • The main 5 actors of the movies in the credit section
  • The movie language
  • A related movies section which includes at least five related movies
  • A trailer section that has the movie trailer from youtube
  • The movie production company name and logo
  • The director name
  • The movie rating and how many votes has it received

Functionality

  • Clicking an actor in the main actors should go to the single actor page.

Actor List Page

Displays a list of actors styles in the same way as the movies list page, but with the actor photo and the actor name. Clicking any actor should go to the Single Actor Page. CSS should most certainly be reused here!

Single Actor Page

This page can be reached by clicking on an actor in the actors list page or the credits in the single movie page.

Data Display

  • The actor name
  • The actor gender
  • A picture of the actor
  • The actor popularity
  • The birthday of the actor and (if available) death day
  • A biography about the actor
  • A list of movies the actor participated in

‏لقطة الشاشة ٢٠٢٣-٠٣-٢٤ في ١٢ ١٤ ١٢ م

Demo

https://202212-giz-ye-few.github.io/more-than-one/