Technigo JS/React Course project TWO: Project Library, Fabio Cassisa.

In this project the main focus is be able to manipulate the DOM, arrays and objects. More specifically the main aim of this code is to simulate a library of books (which is made of an array of objects) and let the user filter with different ways and even pick some of them.

Focusing on vanilla JS, the idea is to work with the DOM by getting elements, having event listeners and using functions just created to manipulate an array of object. Then display after the filter the array just manipulated back to the DOM.

In this case it has been used many methods famous to manipulate an array like sort(), filter(), reduce(), slice(), findIndex(). At the same time many other methods to listen or to assign variables to precise element in the HTML file (DOM).

With these interaction back and forth of listening to what happens in the DOM and injecting on the go HTML snippets is it possible to show/hide precise book cards filtered by the user.

Starting by trying to use the methos showed during classes this week, I built first a base HTML structure with all the tags needed to be called back in the "logic.js". Then I tried to easily manipulate some book objects. After that I had to resolve some synthax error that didn't give me the opportunity to keep going with the project.

With the problems fixed, I started enjoying the ride and I kept adding complexity and also playing a bit around with CSS in the end. (Actually by having no frameworks and working fully vanilla, I spent too much time on the CSS file.)

Overall I found difficult to get the right function working straight away. I had the idea and I had in mind what to do but then I spent a lot of time reading what certain methods were doing or how to use/write them correctly. At the same time I got to read a lot in StakOverflow how to make some speicific features and adapt them to my needs.

Overall, I think it was a nice project and I could streach my goals as I wanted. Happy Coding!

-- link to Netfliy: https://project-library-fabio.netlify.app/