docs

Voodoo.js Documentation

JavaScript feels like magic.

Voodoo.js is an HTML-first JavaScript framework: you build reactive applications directly in HTML. Reactivity, components, requests, forms, validation, interface, animation, and charts come in the box. No build step, no eval, no runtime dependencies.

This folder is the complete documentation. If you have never used the library, start with Introduction, then Installation and Quick Start.

Getting started

Guide	What you learn
Introduction	What it is, who it's for, when not to use it, roadmap
Installation	CDN, npm, download, which bundle to choose, script tag configuration
Quick Start	From blank HTML to first app, step by step

Fundamentals

Guide	What you learn
Reactivity	reactive, ref, computed, watch, effect, nextTick
Expressions	The safe parser, what's accepted, allowed globals, CSP
Directives	Complete reference of all directives
Components	Register, props, slots, emit, lifecycle, PascalCase tags
State and stores	v-data, scope, global store, $store, v-persist, v-sync, v-history
Events	v-on, shortcuts, modifiers, keys, synthetic events, hotkeys

Application

Guide	What you learn
HTTP	V.http client and request directives, v-resource
Forms	v-submit, serialization, upload, dropzone, autosave
Validation	All rules, async validation, custom rules, messages
Masks	All masks and how to create new ones
Interface	Modal, drawer, tabs, dropdown, tooltip, accordion, command palette
Drag and drop	v-draggable, v-droppable, v-sortable, groups, accessibility

Full build

The resources below come only in voodoo.full.min.js or a custom build. WebSocket and GPU are the exception: each has its own entry (dist/socket.js and dist/gpu.js) and comes in none of the browser bundles.

Guide	What you learn
Ready-made components	The 29 V* components and props for each
Animations	v-motion, presets, spring, stagger, scroll, v-count, v-typewriter
Charts	v-chart, all types, options, reactivity
Router	Routes, parameters, guards, v-link, v-router-view
Languages	i18n, v-t, pluralization, language switching
WebSocket	V.socket, public and private rooms, Socket.IO, v-socket and v-room
GPU	V.gpu over WebGPU and the v-shader directive
Devtools	The xray inspector and event bus

Reference and support

Guide	What you learn
Theme and palette	Light and dark theme, V.palette, CSS tokens
Plugins	V.use, custom directives, custom magics
Utilities	All utility functions with examples
API	Reference of the entire V object, grouped by area
Security	Why no eval, CSP, XSS warning in v-html
Performance	Granular updates, size, best practices

Migration

Guide	What you learn
Migrating from jQuery	Side-by-side equivalence table
Migrating from Alpine	Side-by-side equivalence table
Migrating from Vue	Side-by-side equivalence table

Community

Guide	What you learn
FAQ	More than twenty direct answers
Contributing	How to run, test, build, and submit changes

Three things worth knowing before everything

1. Interpolation uses single braces: write { name } in HTML. The double-brace form {{ name }} also works, for those coming from Vue.
2. v-* attributes disappear from HTML after processing. This is intentional and keeps the DOM clean in the inspector. Never write CSS that depends on selectors like [v-tab].
3. No eval. Expressions go through a custom parser, so the library works with restrictive Content Security Policy, no unsafe-eval.

---

Next: Introduction