dbindly

Welcome to the DBindly documentation. DBindly is a universal dynamic content binding platform that allows you to load data from collections and render it on any website using simple HTML data attributes.

Quick Start

Add DBindly to your website in 3 simple steps:

1. Include the Script

<script src="https://api.dbindly.com/dbindly.min.js"></script>

2. Initialize with Your API Key

DBindly.init({
  apiUrl: 'https://api.dbindly.com',
  apiKey: 'pk_live_your_api_key',
  cache: true,
  debug: false
});

3. Add Data Attributes to Your HTML

<h1 dbind_data="title"></h1>
<p dbind_data="description"></p>
<img dbind_src="imageUrl" dbind_alt="title">
<a dbind_href="link">Learn More</a>

Features

Universal Compatibility - Works with any website (Webflow, WordPress, Wix, custom HTML)
Simple Implementation - Single script tag + data attributes
List Rendering - Render arrays with filtering, sorting, and pagination
Caching - Built-in localStorage caching for performance
Error Handling - Automatic retry logic and error callbacks
Two-Way Binding - Form inputs with dbind_model (v2.3.0)
Event Handling - Click and submit handlers with dbind_click and dbind_submit (v2.3.0)
Accessibility - ARIA attributes and screen reader support (v2.3.0)
Animations - Smooth transitions with dbind_transition (v2.3.0)
TypeScript Support - Full type definitions included (v2.3.0)
Real-Time Reactivity - WebSocket, SSE, and polling for live updates (v2.4.0)

Documentation Sections

Getting Started

Overview - Introduction and basic concepts
Installation - How to install DBindly
Configuration - Configuration options

Attributes Reference

Attribute Index - Complete attribute reference table
Core Binding - dbind_data, dbind_html, dbind_default
HTML Attributes - dbind_href, dbind_src, dbind_alt, dbind_title
Styling - dbind_class, dbind_style
Visibility - dbind_show, dbind_hide, dbind_if, dbind_unless
Lists & Repetition - dbind_repeat, dbind_filter, dbind_sort, dbind_limit
Collections - dbind_collection, dbind_search, dbind_paginate
Forms & Events - dbind_model, dbind_click, dbind_submit, dbind_error
Formatting - dbind_format with filters (currency, date, etc.)
Loading States - dbind_loading, dbind_skeleton
Accessibility - dbind_aria-*, dbind_live
Animations - dbind_cloak, dbind_transition

Advanced

Templating - Concatenation, inline pipes, special variables (v2.3.0)
TypeScript - Type definitions and typed usage (v2.3.0)
Reactivity - Real-time updates with WebSocket, SSE, and polling (v2.4.0)

API Reference

Endpoints - REST API endpoints
API Keys - Managing API keys
JavaScript API - Complete JS method reference (v2.3.0)

Integrations

Webflow - Load collection data in Webflow

Examples

E-commerce Catalog - Product grid with filtering
Team Directory - Team members with search
Reactive Components - Real-time updating components (v2.4.0)