React UI kit
The React UI kit is a library that you can add to your new or existing React application. The UI kit consists of various UI components for the different Weavy apps available. In contrast to the Drop-in UI, the React UI kit uses the Weavy Rest API to consume the data.
Pre-requisites
If you're already familiar with JavaScript and React then you'll be able to use the React UI kit with ease! If not, we recommend you to learn the basics first.
Here are some resources to help you out:
Minimum requirements
React
>= 18.0.0Weavy Backend
>= 11.0.0
Installation
That is the easiest and quickest way to get started and does not require you to deploy your own backend.
Install the required packages in your React Native project:
npm install @weavy/uikit-react
The React UI kit is also dependant of the theme library that are shared by all our ui kits.
Installing dependencies
In your project directory, run:
npm install @weavy/themes
Wrapping the components in <WeavyProvider>
The Weavy UI kit components that you decide to use must be wrapped in the <WeavyProvider>
component. The <WeavyProvider>
handles all the common functionality for all the Weavy React UI components.
import React from 'react';
import { WeavyProvider } from '@weavy/uikit-react';
export default function App() {
return (
<WeavyProvider>
<!-- Weavy components goes here -->
</WeavyProvider>
)
}