Laravel

Introducing Volt: An elegantly crafted functional API for Livewire

437 Views 27 December 2023
Introducing Volt: An elegantly crafted functional API for Livewire

Introducing Volt: An elegantly crafted functional API for Livewire

Recently, Released Laravel Folio, which is powerful page-based router designed to simplify routing in Laravel applications.

While Laravel Folio is great for static pages, it doesn't support the rich interactivity many users have come to expect from modern web applications. For that, Launching another new package: Volt.

Volt is an elegantly crafted functional API for Livewire, allowing component's PHP logic and Blade templates to coexist in the same file. Behind the scenes, the functional API is compiled to Livewire class components and linked with the template present in the same file.

A simple Volt component looks like this:

image

By utilizing Volt's functional API, we can define a Livewire component's logic through imported Livewire\Volt functions. Volt then transforms and compiles the functional code into a conventional Livewire class, enabling us to leverage the extensive capabilities of Livewire with reduced boilerplate.

Comprehensive documentation on Volt can be found on the Livewire website, and everything you love about Livewire is also available in Volt, including the most recent additions such as locked and reactive properties:

image

In addition, Volt allows you to easily convert a small portion of a page into a Volt component without extracting it into a separate file.

For example, imagine a Folio page named counter.blade.php:

image

Instead of having the "counter" component in a separate file, you can include the component itself on the Folio page using the @volt directive and effectively declare the route, interactivity, and template in the same file (🤯):

image

And, of course, Volt's components may be tested just like any other Livewire component:

image

Complete documentation for Volt found on the Livewire website.

Img

Written by

Sandeep Gajera

Sandeep Gajera is a Founder and Technical Director at AstroJal Technology. He is dedicated to making the best use of modern technologies to craft end-to-end solutions. He also has a vast knowledge of Cloud management like AWS / Google Cloud. He loves to do coding so still doing the coding. Also, help employees for quality based solutions to clients. Always eager to learn new technology and implement for best solutions.

About Me

Img
Sandeep Gajera

Founder and Technical Director
at AstroJal Technology.

Popular Feeds