Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/gauravooo2/cinequest
CineQuest: Your ultimate destination for top-notch movie recommendations.
https://github.com/gauravooo2/cinequest
easy-react-project easy-web frontend movie-app movie-website
Last synced: 8 days ago
JSON representation
CineQuest: Your ultimate destination for top-notch movie recommendations.
- Host: GitHub
- URL: https://github.com/gauravooo2/cinequest
- Owner: GauravOOO2
- Created: 2024-05-01T03:03:19.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2024-08-31T15:53:29.000Z (3 months ago)
- Last Synced: 2024-11-10T20:04:47.801Z (8 days ago)
- Topics: easy-react-project, easy-web, frontend, movie-app, movie-website
- Language: JavaScript
- Homepage: https://movie-app100.netlify.app/
- Size: 499 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Live Demo: https://movie-app100.netlify.app/
## Please Click here to see the program in CodeSandBox
https://codesandbox.io/p/sandbox/adoring-feather-wdwdqn
# CineQuest 🎥
A Complete ReactJS application.
## Made by [J Gaurav Varma](https://www.linkedin.com/in/gaurav-varm-oo21/)
## Project Description
CineQuest is a website designed to streamline the movie selection process based on user preferences inputted through three text fields: Country, Genre, and Language. Upon submission, the website suggests movies available in the JSON data that match the user's criteria. Utilizing the .map method, I dynamically filtered and rendered the matching movie data on the front end. To enhance user experience, I integrated unaliased MUI for rendering dropdown fields, ensuring a smoother, faster, and lighter system operation. Additionally, I prioritized responsiveness across all screen sizes by implementing custom styling directly in the SX, ensuring adaptability of fields and cards. The overall design aims to provide users with a visually appealing and pleasant browsing experience.
## What I used
- ReactJS
- CSS
- MUI
## Requirements
- Basic ReactJs knowledge
- Basic HTML, CSS knowledge
## Run Locally
Clone my Repo from GitHub
Install dependencies
```bash
git clone https://github.com/GauravOOO2/Movies-Site-Assignment.git
```
Change the directory and run the application
```bash
cd Movies-Site-Assignment
```
Install Dependencies
```bash
npm install
```
Start the server
```bash
npm run start
```
## Tools Used
- Code Editor: VS Code
## Screenshots
Default Window
Filtered Window
This is the code component where the filter operation is performaed and movies are displayed.
