---
title: "Developing the UI walkthrough series"
slug: "developing-the-ui-walkthrough-series"
abstract: "Walkthrough series to integrate with Sitecore Discover using JS SDK and UI components."
---
# Developing the UI walkthrough series

Sitecore Discover JS SDK supports integrating your React application in many scenarios. Before starting on an implementation, you need to create widget components.

You can make an inventory of the widgets components you need to create or instantiate. In the Customer Engagement Console (CEC), the **Merchandising widgets** section lists all widgets that have been configured for your implementation. There might be some widgets that are not used in your application.

![Screenshot of the merchandising widgets page in the CEC.](https://doc.sitecore.com/api/markdown-image/discover/en/developers/discover-js-sdk-for-react/images/merchandising_widgets.png)

1. Log in to the CEC using your Discover credentials.
2. On the menu bar, click **Merchandising widgets** .

> [!note]
> For successful rendering of widget components, make sure that:
>
> -   Widget components have the same **rfk\_id** and type as configured in Sitecore Discover.
>
> -   Widgets are published and have *Active* status.

This walkthrough series describes the most common and fastest way to integrate an application using JS SDK and UI components.

To develop user interfaces for Sitecore Discover using the JS SDK, follow these walkthroughs:

1. [Setting up the React project](https://doc.sitecore.com/discover/en/developers/discover-js-sdk-for-react/developing-the-ui-walkthrough-series/walkthrough--setting-up-the-react-project.html "Walkthrough: Setting up the React project")
2. [Creating widget components using the CLI](https://doc.sitecore.com/discover/en/developers/discover-js-sdk-for-react/developing-the-ui-walkthrough-series/walkthrough--creating-widget-components-using-the-cli.html "Walkthrough: Creating widget components using the CLI")
3. [Creating widget components manually](https://doc.sitecore.com/discover/en/developers/discover-js-sdk-for-react/developing-the-ui-walkthrough-series/walkthrough--creating-widget-components-manually.html "Walkthrough: Creating widget components manually")
4. [Tracking user interactions](https://doc.sitecore.com/discover/en/developers/discover-js-sdk-for-react/developing-the-ui-walkthrough-series/walkthrough--tracking-user-interactions.html "Walkthrough: Tracking user interactions")
5. [Adding widgets to the React application](https://doc.sitecore.com/discover/en/developers/discover-js-sdk-for-react/developing-the-ui-walkthrough-series/walkthrough--adding-widgets-to-the-react-application.html "Walkthrough: Adding widgets to the React application")