E-Commerce Storefront with Next.js & Typesense

In addition to search experiences, Typesense can also be used to build performant browsing experiences like product listing pages in an ecommerce store.

This implementation specifically uses Next.js (opens new window) for a frontend (React) framework.

Live Demo (opens new window) | Source Code (opens new window)

Key Highlights

• Here's (opens new window) how to configure the Typesense Instantsearch Adapter (opens new window) with react-instantsearch.
• Here's (opens new window) how to configure the RefinementList widget to filter items.
• Here's (opens new window) how to configure the ToggleRefinement widget to filter boolean fields in records.
• Here's (opens new window) a custom RangeSlider widget implementation.
• Here's (opens new window) how to highlight matched terms using the Highlight widget.
• Here's (opens new window) how to configure the SortBy widget to work with Typesense's support for multiple sort orders on the same index / collection.
• Here's (opens new window) how to allow your users to configure how many results they want to see per page.