Day 07: Filterable List

Make a list of items that filters as the user types in a search field.

JavaScript focus

  • input driven filtering
  • looping arrays / node lists
  • comparing normalized strings
  • hiding/showing items

Nice extras

  • “no results” message
  • category tags
  • clear search button

MDN prep

Filterable List

  • Button Counter
  • Modal Dialog
  • Accordion FAQ
  • Theme Toggle
  • Task List