Announcing our PWA E-commerce UI Template in React

We’re thrilled to introduce our first E-commerce UI template. A PWA storefront implementation using React / Next.js and the best of our InstantSearch and Autocomplete libraries, that you can either use

  • as a starter kit to build your Algolia-powered solution
  • or an educational and inspirational resource from which you can cherry-pick bits of code

Preview

Try the Live Preview (Optimized for Mobile and Desktop)

Getting Started

You can get the UI Template running locally in a few minutes by following this Getting started guide. Or directly learn more about all the building blocks composing this template.

In a nutshell

This E-commerce React / Next.js starter kit

  • includes an integration of Algolia on the Homepage, and the Product listing page
  • pre-integration of Algolia’s more advanced features such as Merchandizing via Rules, AI Re-Ranking, and AI Personalisation (see all)
  • unlock Search & Browse capabilities in a in single Product Listing view
  • includes SEO optimizations (server-side rendering using Next.js, SEO friendly rooting)
  • is PWA compliant
  • scores >90% on WebCoreVitals and Accessibility (via Lighthouse)
  • is built with TypeScript and Tailwind CSS for theming

Your feedback is key

As you understand, this is the first time we’re releasing this type of resource, and are hoping it will help facilitate the creation of rich E-commerce Search & Discovery experiences.

Help us understand where we should improve the template next, by sharing with us your challenges and experience overall:

  • Has the UI Template been helpful for your use case? Did you face any challenges while using it?
  • Is there anything missing in this template that should be added in future iterations?

Happy coding!

4 Likes