Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/fatihcaliss/movie-app
https://github.com/fatihcaliss/movie-app
Last synced: 10 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/fatihcaliss/movie-app
- Owner: fatihcaliss
- Created: 2023-08-31T00:40:11.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2023-08-31T10:40:19.000Z (about 1 year ago)
- Last Synced: 2023-08-31T13:27:58.493Z (about 1 year ago)
- Language: JavaScript
- Homepage: https://movie-app-ia-project.vercel.app/
- Size: 1.71 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## :point_right: [Click here to see on browser](https://movie-app-ia-project.vercel.app/)
## Preview:
## Movie-App-IA
### Installation
Clone the project to your local machine:
```git clone https://github.com/fatihcaliss/movie-app.git```
```cd movie-app```
```npm install```
```npm start```
In this project;
📌 Omdbapi’s API(https://www.omdbapi.com/) used for data.
📌 Axios used to get movies/series data info from omdbapi’s API.
📌 Material UI used for styling.
📌 For Stage management TanStack Query used.
📌 React-router-dom used for routing. There are two pages. One of them is Home page which lists 10 movies/series for your search. Default search value is `Pokemon`
📌 On Home page, mui x-data-grid used for listing and pagination of movies/series data./
📌For filter mui x-data-grid table, created a util function named `getMoviesFilterParams`. User filter options are, year and type.
📌 For Search input, created a util debounce function that limits per request with 1 sec.
📌 The other page is Movie Detail page. This page contains the poster on left column. In second section, there are informations about the movie or series.
📌 The toolbar can be used to edit visiualization of the table as can be seen in the preview. The toolbar can also be used for exporting data to CSV format/