viktoria-olo / project-library

A JavaScript application that displays books. Allows for filtering based on genre, alphabetical sorting, sorting based on publishing date, as well as a random book generator.

Bookworm Haven Library

The assignment was to build a digital library using an array of objects.Through the use of DOM manipulation, event handling, functions, conditionals, variables, as well as object and array manipulation, the site should allow the user to filer and sort the books based on certain criteria.

I decided to use the array of books to create the Bookworm Haven Library.

The problem

I first created the basic skeleton using html and css. I then looked at resorces explaining array, array methods, and objects, both from Technigo and from other sources. Previous team exercises proved very useful, as I could reuse some of the code, like the getRandomNum function. I decided to use the figma example from Technigo as a basis for my design.

The next step was to start working on the funcions. Once the main functions were in place, I started to look at how I could break out some of the code into their own functions that could be reused for multiple events, such as the genre filter buttons. I also added dropdown menus for mobile view, as it was too crowded with all the buttons. Some styling was done throughout the process, but mostly once the main functions were in place.

If I had had more time I would have tried out adding the search bar, as well as broken out more code into their own functions.

View it live

https://main--sparkling-cajeta-657abb.netlify.app/