HaexHub SDK Demo (Nuxt)

This is a demo application showcasing the HaexHub SDK integration with Nuxt 4.

Features

• Database operations (CREATE TABLE, INSERT, SELECT)
• Table name prefixing using getTableName()
• High-level SDK API (client.query(), client.execute())
• Nuxt UI components for a polished interface
• Vue 3 Composition API with <script setup>

Setup

Install dependencies:

pnpm install

Development

Option 1: Test as HaexHub Extension (Recommended)

This is the proper way to test the extension with full HaexHub integration:

1. Start the dev server:

   pnpm ext:dev

2. Open HaexHub and load the dev extension:

   • Click on "Extensions" or "Add Extension"
   • Select "Load Dev Extension"
   • Choose this project directory

The extension will now run inside HaexHub with full access to the SDK APIs.

Option 2: Standalone Development

For UI development without HaexHub:

pnpm dev

Note: Database operations will not work in standalone mode as they require HaexHub's runtime environment.

Build & Package

Build and sign the extension for production:

pnpm ext:build

This creates a signed .haextension file that can be installed in HaexHub.

Project Structure

haex-demo-nuxt/
├── app/
│   ├── pages/
│   │   └── index.vue          # Main demo page
│   └── app.vue                # Root component
├── haextension/
│   ├── manifest.json          # Extension metadata
│   ├── public.key             # Public signing key
│   ├── private.key            # Private signing key (not in git)
│   └── icon.svg               # Extension icon
├── haextension.config.json    # Extension dev configuration
└── nuxt.config.ts             # Nuxt configuration

Learn More

• HaexHub SDK Documentation
• Nuxt Documentation