I Built Voodoo.js to Bring TSX and Reactivity Directly Into Plain HTML
What if you could write reactive interfaces, map arrays, filter data, use components, and even write JSX style syntax directly inside a plain HTML file? That is the idea behind Voodoo.js. Voodoo.js is an HTML first JavaScript framework designed for developers who want modern frontend capabilities without introducing a complex toolchain. You can start with a single script tag and keep working…
Voodoo.js is an innovative HTML-first JavaScript framework that enables developers to incorporate reactive interfaces, map arrays, filter data, utilize components, and even employ JSX-like syntax directly within plain HTML files. This framework aims to provide modern frontend capabilities without the need for a complicated toolchain.
With just a single script tag, developers can begin working inside their HTML files, without the necessity for bundlers, compilers, or configuration. Voodoo.js leverages familiar JavaScript methods like filter, sort, and map to generate reactive markup directly in the page, offering a syntax that feels instantly familiar to developers transitioning from React, Vue, Alpine, or even vanilla JavaScript.
The central philosophy of Voodoo.js revolves around keeping HTML at the core of the application, while simultaneously adding a reactive layer around the existing markup. This framework offers a plethora of features including reactive data, events, expressions, components, HTTP utilities, forms, and JSX-style templates, all without requiring a build pipeline.
This makes Voodoo.js particularly appealing for prototypes, small applications, internal tools, static websites, experiments, and developers who appreciate working closely with the browser. An interactive playground has also been developed, allowing users to experiment with the framework directly in the browser. They can modify the HTML, run examples, and observe the live preview in real-time.
The JSX map example can be accessed at https://kwy404.github.io/Voodoo.js/playground.html#jsx-map. For those interested in the Voodoo.js project, its source code is available on GitHub (https://github.com/kwy404/Voodoo.js). The author is keen on receiving feedback from other JavaScript developers, expressing curiosity about the potential benefits of using JSX or TSX-style syntax directly within an HTML file, all while maintaining a simple project structure and bypassing the need for a build step.
Written by urgent.news from Dev.to's reporting — not their text. Machine-written — may contain errors; check the original before relying on it.