Skip to main content

BrainDrive Plugin Developer Quick Start

Bring your AI powered ideas to life in 30 minutes or less.

By the end of this guide you will be able to:

  • Install and test plugins via Plugin Manager
  • Set up rapid development environment (1-minute cycles)
  • Use Service Bridges to access BrainDrive functionality (saving 90% of development time)
  • Build, test, and iterate on plugin ideas quickly

Prerequisites

  • Node.js 16+ installed
  • Git installed
  • BrainDrive running locally

Step 1: Install BrainDrive

Follow the Installation Guide

Step 2: Install the Plugin Template

  1. Go to BrainDrive Plugin Manager → Install Plugins
  2. Enter URL: `https://github.com/BrainDriveAI/BrainDrive-PluginTemplate
  3. Click Install
  4. Wait for green success message

BrainDrive Plugin Manager

Step 3: Test the Template

  1. Go to BrainDrive Page Builder
  2. Create New Page
  3. Drag "Plugin Template" from left panel to canvas
  4. Click Publish
  5. Navigate to your page - you should see the working plugin

adding the plugin template to a page

Step 4: Set Up Fast Development Environment

Clone the template:

# In your preferred development folder
git clone https://github.com/BrainDriveAI/BrainDrive-PluginTemplate.git MyPlugin
cd MyPlugin
npm install

Configure for instant updates (avoiding 10+ minute reinstall cycles):

  1. Find your BrainDrive backend path:

    • Look for: [your-braindrive-path]/backend/plugins/shared/
  2. Update webpack config:

    • Open webpack.config.js
    • Find the commented webpack output path
    • Uncomment and update with your backend path:
    output: {
    path: path.resolve(__dirname, '/path/to/your/BrainDrive-Core/backend/plugins/shared/PluginTemplate/v1.0.0/dist'),
    // ... rest of config
    }
  3. Set up browser for cache-free development:

    • Open browser dev tools (F12)
    • Go to Network tab
    • Check "Disable cache"
    • Keep dev tools open while developing

Step 5: Make Your First Change

  1. Edit the plugin:

    # Open src/BrainDrive-PluginTemplate.tsx
    # Change the title to "My Awesome Plugin!!"
  2. Build and test:

    npm run build
    # Refresh browser with Ctrl+F5
  3. See instant results:

    • Your change appears immediately in BrainDrive
    • No reinstallation needed

You've just experienced the 1-minute development cycle!

Step 6: Understand Service Bridges (The BrainDrive Secret Sauce)

Why Service Bridges matter:

  • Zero Dependencies - Your plugins never break when BrainDrive updates
  • Simple APIs - Complex backend operations become one-line calls
  • Consistent Interface - Same patterns across all BrainDrive features

Available Bridges

Each bridge comes with an example plugin you can install and full documentation.

BridgePurposeExample UseLearn by Doing
APIBackend communicationawait services.api.get('/data')API Example
EventPlugin messagingservices.event.emit('myEvent', data)Events Example
ThemeLight/dark mode switchingservices.theme.getCurrentTheme()Theme Example
SettingsUser preferences`services.settings.getSetting('myKey')Settings Example
Page ContextCurrent page infoservices.pageContext.getContext()Context Example
Plugin StateData persistenceservices.pluginState.save(data)State Example

Step 7: Build Something Simple

See the complete Lifecycle Manager Customization Guide for all customization options.

Pick a bridge, test a simple use case, and actually build something. Don’t overthink it. If the abstraction doesn’t make sense, isolate it. If it does, use it and move on.

Recommended first projects:

Hello AI Chat

// Simple AI interaction using API bridge
const response = await this.props.services.api.post('/chat', {
message: userInput,
model: 'gpt-4'
});

Theme-Aware Widget

// React to theme changes
componentDidMount() {
this.props.services.theme.addThemeChangeListener(this.handleThemeChange);
}

Cross-Plugin Messaging

// Send messages between plugins
this.props.services.event.emit('dataUpdate', { newValue: 42 });

Step 8: Bring your AI powered ideas to life

The only limit is your imagination. Your AI. Your Rules.

Dave J's Rules for Success

  1. Test the unmodified template first - Always verify the base works before customizing
  2. Make incremental changes - Test after each small modification
  3. Use the 1-minute cycle - Don't fall back to slow reinstall cycles
  4. Leverage Service Bridge examples - Copy working patterns rather than starting from scratch

Have Questions?

Thank you for joining us on this mission to build a superior, user-owned alterantive to Big Tech AI systems.

Your AI. Your Rules.