@streetjs/react

React hooks for StreetJS backends, built on @streetjs/client. SSR-safe; React is a peer dependency.

npm install @streetjs/client @streetjs/react react

Quick start

import { createStreetClient } from '@streetjs/client';
import { StreetProvider, useAuth, useQuery, useStreetClient } from '@streetjs/react';

const client = createStreetClient({ baseUrl: '/api', credentials: 'include' });

function App() {
  return (
    <StreetProvider client={client}>
      <Catalog />
    </StreetProvider>
  );
}

function Catalog() {
  const api = useStreetClient();
  const { data, loading, error, refetch } = useQuery(() => api.resource('items').list());
  if (loading) return <p>Loading…</p>;
  if (error) return <p>Failed.</p>;
  return <button onClick={refetch}>{data?.length} items</button>;
}

Hooks

useStreetClient, useQuery, useMutation, useSession, useAuth, useSearch, useRealtime, useChannel, useAIChat, plus <StreetProvider>.

const { session, loading, login, register, logout } = useAuth();
useChannel('room:42', (m) => console.log(m.data));   // realtime
const results = useSearch('query');                    // full-text search
const { messages, streaming, send } = useAIChat();     // AI streaming

See the Full-Stack with React tutorial.

Status: 0.1.x preview — pre-1.0, APIs may change.

License

MIT