Movie App

Movie App

A web application that allows users to explore trending movies and TV shows, register, log in, and view details about their favorite content. Built using HTML, Tailwind CSS, Vanilla JavaScript, and the TMDB API, with a mock backend powered by JSON Server.

Project Structure

Copy to BlackBox

movie-app/

├── client/ # Frontend code

│ ├── public/ # HTML files and assets

│ │ ├── assets/ # Folder for all Images used in styling

│ │ ├── index.html # Main page for login and registration

│ │ ├── about.html # about us page

│ │ ├── contact.html # Contact us page

│ │ ├── dashboard.html # Dahboard page (trending movies/TV shows)

│ │ |

│ └── src/

│ ├── styles/ # CSS files

│ │ ├── dashboard.css # Some media Queries and scroll bar style

│ │ ├── input.css # Tailwind source CSS file

│ │ └── output.css # Compiled Tailwind CSS file

│ └── js/ # JavaScript files

│ ├── auth.js # Authentication logic

│ └── Dash.js # Movie/TV shows logic, Details Modal logic

|

├── server/ # Backend mock data

│ └── db.json # JSON Server database

├── package.json # npm project configuration

├── package-lock.json # npm lock file

├── tailwind.config.js # Tailwind configuration file

└── README.md # Project documentation

Features

User Authentication:

Register a new account.

Log in with an existing account.

Trending Movies/TV Shows:

Browse trending movies, TV shows, and people.

Pagination support for browsing through results.

Details Modal:

View detailed information about a specific movie or TV show.

Responsive Design:

Built with Tailwind CSS for a clean and responsive UI.

Technologies Used

Frontend:

HTML

Tailwind CSS

Vanilla JavaScript

Backend:

JSON Server (mock backend)

APIs:

The Movie Database (TMDB) API