Vue

Use Pulsabase in Vue 3 with composables and plugins.

Installation

npm install @pulsabase/sdk @pulsabase/vue

Setup

main.ts

import { createApp } from 'vue';
import { PulsabasePlugin } from '@pulsabase/vue';
import App from './App.vue';

createApp(App)
  .use(PulsabasePlugin, {
    url: 'https://api.yourproject.pulsabase.io',
    clientKey: 'your-public-client-key',
    auth: { autoRefreshToken: true },
  })
  .mount('#app');

Composables

<script setup lang="ts">
import { useQuery, useAuth, useRealtime } from '@pulsabase/vue';

// Fetch data (reactive)
const { data: users, loading } = useQuery(User, {
  where: { age: { $gte: 18 } },
  orderBy: { name: 'asc' },
});

// Auth
const { user, signIn, signOut } = useAuth();

// Realtime
useRealtime(Message, 'INSERT', (newMessage) => {
  console.log('New message:', newMessage);
});
</script>

<template>
  <div v-if="loading">Loading...</div>
  <ul v-else>
    <li v-for="u in users" :key="u.id">{{ u.name }}</li>
  </ul>
</template>