@joonweb/react

A professional React SDK for building embedded apps on the Joonweb platform.

Installation

npm install @joonweb/react

Security Note

Important: You should never expose your Joonweb X-Joonweb-Access-Token to the frontend browser, as it provides full read/write access to the store.

This React SDK is designed to work as a secure proxy. You provide the SDK with your App's Backend URL, and it securely routes all API requests through your server to Joonweb.

Setup

Wrap your application in the JoonwebProvider, giving it the base URL of your backend.

import { JoonwebProvider } from '@joonweb/react';

function App() {
  return (
    <JoonwebProvider backendUrl="https://yourapp.com/api/joonweb">
      <YourAppComponents />
    </JoonwebProvider>
  );
}

Usage

Use the useJoonweb hook to easily fetch data from your components:

import { useJoonweb } from '@joonweb/react';

export function ProductList() {
  const { data, loading, error } = useJoonweb('/products?limit=10');

  if (loading) return <div>Loading products...</div>;
  if (error) return <div>Error loading products.</div>;

  return (
    <ul>
      {data.products.map(product => (
        <li key={product.id}>{product.title}</li>
      ))}
    </ul>
  );
}