FILMY

• Project Idea

A ReactJS and NodeJS project where we built a Movies App.

The main point of our project is to find movies/series, read about the storylines, see the cast lists, see advertisements for movies/series, ratings, and other information about movies/series. We have used NodeJS for the backend, where we saved the users' information on the mongoDB that contains the email, name, password. Also, we used the ReactJS for Frontend, we set the multi-language option, so that the user will be able to choose a language from three languages, which are English, Arabic or Hebrew. This option can only be applied to the application interface. As for the movie information, it will be displayed in English only because it is fetched from the API, so we can’t change the language in it because of the method we used. There is a dark light mode so that the user can choose the colors that they are most comfortable with. This project contains a login page, a register page and a password change page. The homepage displays the five most famous (top) movies ,the section below is divided into categories, whether it is movies or TV series, and you can see all the information and details and search for the movie or series that you’re interested in.

Website link: https://filmy-hope-omar.netlify.app/

---

• Usage

  Clone the repository

  git clone https://github.com/HopeMashal/Filmy-Final-Project.git

  Backend

  • Open the folder

    cd backend

  • Install Dependencies

    npm install

  • Run

    npm start

  Frontend

  • Open the folder

    cd client

  • Install Dependencies

    npm install

  • Run

    npm start

---

• Features

  Pages

  • Home Page
  • LogIn Page
  • Register Page
  • Forgot Password Page
  • Category Page
  • Film Page

  Home Page

  • All movies, new movies, the five most famous (top) movies, All TV series, new TV series

  Log In Page

  • Log in to your account using email and password

  Register Page

  • Create a new account using account name and email and password

  Forgot Password Page

  • You can change your password using account email

  Film Page

  • Movie/Series Name
  • Movie/Series Desc
  • Cast Lists
  • Movie/Series Cover Picture
  • Similar
  • Advertisements for Movie/Series

  Search Page

  • You can search to find movie/series

  In general

  • MongoDB
  • Express
  • Responsive Web Design
  • Authentication
  • Multi Langauges
  • Light/Dark Mode

---

• Features (NICE TO HAVE)

  • Adding new movies or series to the application by the administration
  • Adding movies and series to users' favourites
  • Obtaining the copyright so that we can display the entire movie or series, and not be satisfied with advertisements

---

• Initial Layout

  • Home Page

    

  • LogIn Page

    

  • Register Page

    

  • Film Page

    

    

    

• Final Layout

  • Home Page

    

    

  • LogIn Page

    

  • Register Page

    

  • Forgot Password Page

    

    

  • Category Page

    

  • Film Page