Movies-Collection

About The Project

User can make his own collection list of movies. where user can add & remove movies in their own collection list.

Features

Add movie into your Collection Bucket List. you can also add movies into your favorite.
Track each movie. These are the 4 statuses of a movie:
- Add - Mark the movie as Add, to PUSH the movie into ADD-Bucket-List.
- Unadd - Mark the movie as Unadd, to REMOVE the movie from ADD-Bucket-List.
- Favorite - Mark the movie as Favourite, to PUSH the movie into Favourite-Bucket-List.
- Unfavorite - Mark the movie as Unfavourite, to REMOVE the movie from Favourite-Bucket-List.
A view to show all top rated movies list. Here give an add & Favourite buttons where you can add a new movie into Busket-List.
A view to display Bucket-List movies. when user click on the Tabs(add, favourite) button
- Show all the add movies which you added into your list. when you Tab the Add Button
- Show all the favourite movies which you added into your list. when you Tab the Favourite Button
- A user can toggle between the Add & Unadd (above mentioned) status of a Movie.
- A user can toggle between the Favourite & Unfavourite (above mentioned) status of a Movie.
User can search a movie and add it into the Bucket-List.
Pagination is also there so user can go to next and previous page easily.

Built With

In the Backend side, we are fetching the data from API Here is the Technology Stack of this Application. which I have used to Built this Application.

ReactJS
Redux ToolKit
HTML
CSS

Getting Started

Clone the repo

git clone https://github.com/your_username_/Project-Name.git

Install all the dependencies packages with NPM
```
npm install
```

Screen-Shots

These are the Screenshots of this application.

Directory Structure and flow of The Code

I am only showing the directory structure of src folder. Because all the code part in the src folder.

   src
    |------ api
    |       |--- apiCalls.js
    |       |     
    |       └--- apiURLs.js             
    |             
    |------ components
    |       |--- App.js
    |       |     
    |       └--- MovieCard.js  
    |       |     
    |       └--- Navbar.js
    |            
    |------ redux
    |       |--- movieSlice.js
    |       |     
    |       └--- searchSlice.js  
    |       |     
    |       └--- store.js
    |         
    |------ data.js
    |------ index.css
    |------ index

Contributing

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

Fork the Project
Create your Feature Branch
Commit your Changes
Push to the Branch
Open a Pull Request

mukesh7590/Movies-Collection-List