@interface-db/vue

Vue client for InterfaceDB.

Documentation · Source

Maintained by InterfaceDB, based on the Instant source. See LICENSE.md and NOTICE for attribution.

Welcome to InterfaceDB’s Vue SDK.

<!-- ༼ つ ◕_◕ ༽つ Real-time Chat -->
<!-- ---------------------------------- -->
<!-- * Updates instantly -->
<!-- * Multiplayer -->
<!-- * Works offline -->

<script setup>
import { init, id } from '@interface-db/vue';

const db = init({
  appId: import.meta.env.VITE_INSTANT_APP_ID,
});

// 1. Read
const { isLoading, error, data } = db.useQuery({
  messages: {},
});

// 2. Write
const addMessage = (message) => {
  db.transact(db.tx.messages[id()].update(message));
};
</script>

<template>
  <!-- 3. Render! -->
  <UI :data="data" @add="addMessage" />
</template>

Get Started

Follow the getting started tutorial to set up a live Vue app in under 5 minutes!

Questions?

If you have any questions, feel free to drop us a line on our issue tracker