CodingNic

Search & Pagination

Making the List Searchable

Search & Pagination 5 min read

Making the List Searchable

Making the List Searchable

The Home page currently shows every contact, always. In this module you’ll
add a search box and pagination, both driven by the page’s own URL —
/?q=ada&page=2 — rather than component state. That means search results
and pagination are bookmarkable and shareable links, and the page still
works with JavaScript disabled.

You’ll extend getContacts to accept optional filters, then build a plain
HTML <form method="GET"> for search and simple <a> links for
pagination.