Introduction

9min

With Klevu’s SDK library, you can pull the power of AI product discovery into any JavaScript ecosystem. It simplifies development giving you more time for innovation. Our SDK brings you the data from search, smart categories and recommendations as JSON. Then you can decide how to render this information.

Another important part it does for you is analytical data sending. Making sure that everything is correct for Klevu AI to improve results. But it doesn't end just there. Our SDK library also provides you with helpers to manage filters, cache requests, simplifying pagination, etc

This library has been built for all browser based frameworks and the Node.js environment. This means that the library is agnostic and is available to use with most of the JavaScript libraries in both traditional and headless implementations.

What is headless

In headless you decouple the back-end systems from the presentation or display layer i.e. frontend. Simply to say, this CMS does have a front-end layer and only the back-end is there.

Document image


Traditional web applications combine the frontend with the back-end, so when a user requests a page, the browser makes the request, the web server then requests data from the data base, processes the data, adds the data to a page template, then sends the entire page back to the browser. This leads to a complete unloading of the previous page (blank screen) and reloading of the new page. During the reloading of the new page, common elements such as fancy navigations must be reloaded and activated. The entire process takes time and is especially noticable on mobile devices with slower internet connections.

Document image


With a headless web application, the back-end and frontend are separated. The back-end exposes an API to connect to the content, while the frontend makes requests to the API and then loads the content into the page dynamically. This method although a little more complex, provides huge performance gains by only needing to partially load portions of site that are actually changing from one page request to another. In other words, the fancy navigation we mentioned previously only needs to load once. And the partially loaded portions of the page only need to request the data which is much smaller than having to also load the code necessary to display the data.

Performance is only one benefit to going headless. As previously mentioned, going headless also allows for a new level of freedom when it comes to the display of multiple data-sources which are very typical with traditional web applications. This limitation by traditional web applications is understandable. Each website is unique, like a fingerprint, and each website's requirements are also unique. Trying to make a website builder that supports every possible combination of data-sources is imposible to manage so traditional websites can only support a limited number of integrations with 3rd parties.

With headless you have the freedom to build your website the way you want and there are many frontend frameworks out there with amazing features to make it possible.

Integrate Klevu into your application with ease. We do all the heavy lifting.

Klevu SDK brings smart search, category merchandising and recommendations solution to your ecommerce store. Klevu makes it easy to create the best product browsing experience for your customers.

Klevu already has a simple to implement JavaScript library that is perfect for most users, so who is this library good for?

TypeScript SDK

The Klevu SDK is written in TypeScript which gives you:

  • Full auto-completion support of integrated development environments (IDEs)
  • Full documenation from the code comments!
  • Easy and fast way to integrate Klevu to your custom UI

Open Source

The Klevu SDK is an open-source project, meaning that anyone can openly view the source code of the project on GitHub to fully understand exactly what each line of code is doing. You can also contribute to the project if you have ideas on how to improve the project.

The code on GitHub not only includes the SDK itself, but contains many examples built using many of the most popular frameworks such as React, Vue, Remix (React), NuxtJS 3 (Vue), and Vanilla JavaScript in case you don't want to deal with any framework at all.

SPA (Single Page Applications)

This library supports all the major frontend libraries like React and Vue. This SDK however gives you the ability to plugin Klevu smart search, category merchandizing and recommendations any way that you would like. Including event tracking of product clicks, searches, and purchases that drive the AI at Klevu's core.

SSR & SSG (Server Side Rendering & Static Site Generation)

SSR & SSG are quickly becoming standard features in all of the most popular frontend frameworks such as NextJS and NuxtJS. With the Klevu SDK you can both increase your store's SEO and your user's experience by requesting search results, category pages, and recommendations before the page loads.

PWA (Progressive Web Applications)

PWAs are designed to give users an experience on par with native apps. With the Klevu SDK, you can also bring the power of Klevu AI into your PWA.

Full Creative Control, on Full Power

The Klevu SDK gives developers maximum control over the way they want to display and allow users to interact with your product catalog. When you add the SDK library to your project you have all the building blocks necessary to create trully unique user experiences that perfectly fit your brand.

Updated 30 Oct 2023
Did this page help you?