Shaper React Embedding Demo

Embed a Shaper dashboard into a React Router app using the Shaper React SDK

---

See the index route for how to use the ShaperDashboard component.

The demo uses a fetcher load a JWT.

See the /jwt route for how to create a JWT using the Shaper API.

Make sure to never expose the API_KEY in the client code.

In a real application, you would need to make sure the user is allowed to see the specified dashboard and set variables based on the user's permissions.

Getting Started

Installation

Install the dependencies:

npm install

Run Shaper

Make sure you have Docker installed and running. Then, start the Shaper server:

npm run shaper

The demo database is included in the Git repository and it should work automatically.

You can visit the Shaper UI at http://localhost:5454

Run the React app

Start the development server:

npm run dev

Then open http://localhost:5173