So, I’m going through some React studying and I’m current just doing small code. I was writing two files. The first is where my data is in my variable. I’m using a basic map method to loop through my array of objects and displaying the information as is. Extremely simple and makes perfect sense. screenshot of my code from my gitHub repository.
However, after that I wanted to try practicing with props and deconstructing my array of objects. So, i created a new file component labeled as Movie and passed it through to my Movies map method. Using props, I pass through the movie name and release year through to render. I understand that using this method turns each list item into it’s own component, but I’m not understanding exactly why this can be useful? Can someone give me some examples of this being used in a practical situation or point me to some repository’s where it’s being used better so I can better understand this use of deconstructing an array of objects? Thank you!
I think the most confusing part for me is I’m still calling Movies in my App.jsx to render the data, so it feels like I could just not have the Movie component at all and have kept them within the one component.
Movie File
Movies file after using props to pass information along to the Movie file.
Code works as intended. Just curious on the logic behind why it works.