Skip to main content
Keep your app in sync. CoreBase lets you listen for changes in your database and update your UI instantly.
Rows are always scoped automatically to the signed-in user, on top of whatever you filter for below.

​
Use the Query Hook (React)

If you are using React or React Native, our useQuery hook makes realtime data easy.
1

Define your query

Declare which table you want to subscribe to, and optionally filter, sort, and limit the results.
import { useQuery } from 'corebase-js/react';

const query = {
  from: 'posts',
  select: ['id', 'title', 'likes'],
  where: { status: 'published', likes: { gt: 10 } },
  orderBy: 'created_at',
  order: 'DESC',
  limit: 20,
};
2

Use the hook in your component

The component re-renders automatically whenever the matching data changes in your CoreBase database.
const MyComponent = () => {
  const { data, loading, error } = useQuery(corebase, query);

  if (loading) return <div>Loading...</div>;
  if (error) return <div>Error: {error.message}</div>;

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

​
Filtering, Sorting, and Joins

Filter operators in where: eq, gt, lt, in — e.g. { status: { in: ['draft', 'review'] } }. A bare value ({ status: 'published' }) is treated as equality. Joins attach related data under a nested key named after the joined table (up to 3 levels deep). Each joined table needs its own explicit select: 
const query = {
  from: 'products',
  select: ['id', 'name', 'price', 'category_id'],
  join: [
    {
      table: 'categories',
      on: { 'products.category_id': 'categories.id' },
      select: ['name'],
    },
  ],
};
// Each row: { id, name, price, category_id, categories: { name } }

​
Use the Client Directly (Vanilla JS)

Not using React? Subscribe with the realtime client directly — this works the same way in Vue, Svelte, or plain JavaScript. 
const subscriptionId = corebase.realtime.subscribe({ from: 'posts' }, (rows) => {
  console.log('Posts updated:', rows);
});

// Later, when you no longer need updates:
corebase.realtime.unsubscribe(subscriptionId);