whohas3E / Glossary

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Interactive Glossary Create an interactive glossary from the data found here. We want it to be searchable and filterable!

Make this look good if you have time! You have complete creative control of this one!

Steps First Step Iterate through all of the data and for each item, generate some HTML from it.

Second Step Add search functionality! Add an input at the top of the page and a button. When you click the button, show all related definitions (use whatever the user typed in to show relevant results).

Bonus: Make this happen whenever the user presses a key!

Third Step Add filter functionality! At the top of the page, add a dropdown menu with all of the class names. When the user selects one of those classes, show all of the terms from that particular class.

Bonus: Make the search and filter functionality work together!

Fourth Step Add tag functionality! At the top of the page, have checkboxes that have the tags stored in them. When the user clicks the tags, show all relevant terms!

Bonus Make the search, filter and tag functionality work together!

Tips Use interpolation as much as you can Try and reuse as much functionality as you can Array methods may come in handy: .forEach .filter .map .reduce

About


Languages

Language:JavaScript 95.4%Language:HTML 2.5%Language:CSS 2.1%