Welcome to the final media of this project, will basically have a quick summary session like what all
we did from the start to end.
So basically what we did is we created a function app and then in set that we created our movies and
set movies, hook using the use straight.
We basically required it already.
It imported it.
And then we basically had ordered the movies part, like we took five movies from Boston and then we
pitched it over it, and then we did split those families.
And then to make it one step further, we got the response from that.
We let me fetch the data from the R that I should pay you off or IMDb API.
And we also saw the how does the OMB API working together API key.
And then we got the movies data to research value.
So for that search value, we have created two companies.
One is heading component and the other one is search box component.
So what the search box does is that it is basically a form, a form like it will take the search text
and it like changed asset search value to that text and then instead, said Dargis.
We can use that search value.
So based on search value, we like use this kind of.
Courts said to like, send the JavaScript variables data in to that strings.
We got the data.
If the data is something like some data is there, then only we have to set the movie for that data.
We said that movies, movies variable to that data, and then whenever the search value changes, we
have to perform, just get movie request function.
So for that, we use that use effect.
And then after the movie list, we have created our favorites favorites component.
Movie list of favorite component also in this movie list component only.
But instead of the title being, movies will have the title be favorites.
As you can see here, a favorite component is rendered.
And then we'll have the movies.
So these two companies basically probably dark favorite company, so are going to be in the parent company
state if you can go after this.
Here you can see we had basically basically sending the movies only, but the movies are favorites.
The favorites will be this.
This variable brought the date of the movies that we're adding to favorites or legal content over here.
So we had two and then we are doing two functions.
One is our two favorite and then we move on favorite actor favorite.
We are creating a new order, adding all our previous favorites and the new favorite, and then taking
the favorites to that new favorite list and saving that later to the local storage coming to remove
favorites.
But we have to function from a logic will be performing the filter function, clearing everything like
that, the all the movies that have not died in the movie that we are removing from the favorites.
And then basically, we are storing that again, the new favorite place to that.
No question.
So here we are sending that and in favorites like render favorites, which is when the favorites button
is clicked.
Like, as you can see, this division of this component is clip, then only will call this function
and this will perform the functions.
And then based on that, the page will get dynamically updated.
So as you can see in every part, there is no single instance where the whole page has been refreshed
every time.
As you can see, only the components are getting dynamically updated rather than diminishing.
As you can see, if you click on add to favorites, it is directly adding the movie component.
Nothing is reloading.
As you can see, nothing is returning.
If I remove some favorites also, there is nothing you do not like.
It is only just getting deleted dynamically.
That is a beautifully acknowledged and of reloading everything and increasing the latency.
We are basically only working with the component that we want to change.
So many big organizations like Facebook or Netflix, all of them are using React.
So this is what?
And then it I not see us as we are having some styles, custom styles and most, but mostly we are using
the bootstrap classes, the more step you can install.
We are having in the dependences boot, bootstraps and woodshop icons.
So runs like this is the movie illustrating movie list.
And then all these components we have built, we have used the bootstrap icons to build this remove
from Great Britain.
Add favorites like one.
With this finally, we came to the end of the this project, we have completed all the functions that
we want to implement to create our movie up, which then voted the applications for that.
And then if you want to go for that, you guys, I said in the previous veto, can create a new page
when you come forward and study, as we are discussing with the reactor, it should be a single page
application with multiple components.
It is a new way of doing the website only know all about shanese like the.
The developers would have many pages and would render so many pages.
But with react, it should be a single page component with single page application with the many components.
So you have to create a new component whenever we click on some movie, it should open in a new component
and then it should render the movie data so that you can take out a challenge and do so.
In this, we end this project and hope you all enjoy this project.
And if you have any doubts regarding the project you can search, you can let go to the post that will
be uploaded to you in the resource section.
And one important thing is if you are working with some code from GitHub, like if you are working with
React Project and you must code from some data source.
When you clone that code file, you will not be installing this node modules, node modules or dependencies
that are present in set packages on etc. So to avoid this, why do you have to do is whenever you clone
something just type like a single command, like go to the movie page on this and be installed.
So what this does is that it will create all the dependencies and all the node models that are not present
in the that are not present inside the directory.
But we are using it in the different components for grid install everything that we are using in the
different components, but not installing this current directly.
But this is one small hack that you can use npm and started to install every all the dependencies and
everything when you are cloning some project directly from GitHub.
But that is the last thing that we in this project.
Thank.