itsaflamingo / library

A project in The Odin Project to practice using objects, prototypes, and constructor functions.

library

A project in The Odin Project to practice using objects and constructor functions.

Live Site: https://itsaflamingo.github.io/library/

Assignment Instructions: https://www.theodinproject.com/lessons/node-path-javascript-library

Skills used: JS:

• constructor functions
• DOM manipulation
• Array methods.
• Retrieving form information.

HTML/CSS:

• create pop-ups using transform/scale/transition/overlay
• Created dynamic webpage using grid/flexbox
• Made responsive with auto-fit, minmax, clamp
• created CSS variables

Challenges:

• Dividing up array into sections so I can remove the title, author, and page numbers. In the end I used the form to retrieve the individual pieces. (I did figure out how to divide the array into sections using .join + .split + .shift, and then using conditionals to select the three relevant components, but thought using the form was cleaner.)
• Adding click events to dynamically created divs. I solved the problem by adding an event listener to the body, and then targeting the buttons using e.target.id.
• Adding the modal, this was my first time using transform/scale/transition/overlay