cbwire is a ColdBox module that makes building reactive, modern apps easy without leaving the comfort of CFML.
What if you could create apps that look and feel like your Vue and React web apps but are written with CFML. Impossible, you say? Nay, we say!
Let's add cbwire styling and script references to our layout using wireStyles() and wireScripts(), and include a cbwire component we will create using wire( "Counter ").
<-- ./layouts/Main.cfm -->
#wire( "Counter" )#
Let's create our Counter cbwire component.
// File: ./wires/Counter.cfc
// Reactive Data Properties
// Action to increment counter
// Tell cbwire where our Counter template is
<!-- ./views/wires/counter.cfm -->
Now that you've created your Counter component, you can include this component in any layout or view throughout your app using the wire() helper method.
Refresh the page, and you find a reactive Counter that increments when you hit the plus button.
How is this working!!!?
cbwire renders our Counter component with our .cfm page. ( View Source to see this ). This means cbwire is SEO-friendly.
When a user clicks the plus button, cbwire makes an AJAX request to the server and triggers the increment action.
cbwire updates the counter state
cbwire re-renders the component template and returns the updated HTML in the AJAX response
We built a reactive counter.
We're not refreshing the page.
We didn't have to worry about webpack configuration or compilation.
We never left CFML.
We're just getting warmed up! cbwire has transformed the way we are building apps, and we think you're going to love it also.
cbwire wouldn't even exist if it wasn't for the impressive efforts of Caleb Porzio ( creator of Livewire, also Alpine.js ) and the PHP Laravel community. Caleb created Livewire for use with the PHP framework Laravel. cbwire is a port of the Livewire functionality to ColdBox and CFML, with some additional goodies sprinkled in.