Download the PHP package elefant/app-wires without Composer
On this page you can find all versions of the php package elefant/app-wires. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download elefant/app-wires
More information about elefant/app-wires
Files in elefant/app-wires
Package app-wires
Short Description Wires app for the Elefant CMS auto-connects Alpine.js for easy single-page app development
License MIT
FAQ
Example:
In general, it is recommended to use always a project to download your libraries. In an application normally there is more than one library needed.
- Some hosting areas are not accessible by a terminal or SSH. Then it is not possible to use Composer.
- To use Composer is sometimes complicated. Especially for beginners.
- Composer needs much resources. Sometimes they are not available on a simple webspace.
- If you are using private repositories you don't need to share your credentials. You can set up everything on our site and then you provide a simple download link to your team member.
- Simplify your Composer build process. Use our own command line tool to download the vendor folder as binary. This makes your build process faster and you don't need to expose your credentials for private repositories.
Informations about the package app-wires
Wires
Inspired by Laravel Livewire, this app provides simple template extensions for the Elefant CMS that wires any handler and its view template up to Alpine.js, providing a few interesting features:
- Server-side rendering of the initial request
- Converts Elefant's
{{var}}tags to Alpine.js<span x-text="var">tags - Provides automatic server-side callbacks via a handful of custom template tags
Installation
Via composer:
Usage
Here's how it works:
In your handler (apps/myapp/handlers/example.php):
Then in your accompanying view template (apps/myapp/views/example.html):
Alternately, you can modify the response data on the server-side before returning it:
And in case of an error on the server, you can use:
Behind the scenes, the <div {{_wire_}}> connects Alpine.js to the template data.
If you want to define your own functions for use with Alpine.js, you can initialize
the component like this instead, using the {{_wire_data_}} tag:
In addition to {{_wire_}} and {{_wire_data_}}, three custom tags can be used to
connect buttons, inputs, and links to make API calls to the same endpoint:
{{_wire_button_}}- Wires a<button>element, passing itsdata-*attributes to the server.{{_wire_input_}}- Wires an<input>,<select>, or<textarea>element to send live updates to the server as you type or make a selection, passing itsnameattribute and value to the server.{{_wire_link_}}- Wires an<a>link, passing itsdata-*attributes to the server.
Other features of Alpine.js should work just the same too, although loops should use pure Alpine.js instead of Elefant's template syntax for looping. For example:
Can be connected like this:
Modifying the list on either the client or the server will update the displayed list of elements.
Convenience methods
Wires defines two additional convenience methods for communicating with the server:
this.sync()- Post the component's current state to the server-side handler.this.send(params)- Post the specified request data to the server-side handler.
The first serializes and sends the entire component state, while the second only sends the specific data that it's given.
These can be used to send the updated component state to the server for storage and additional processing after modifying it locally.
Example usage:
Using this.send(params), you could also send just the item that changed, which you would
also need to check for on the server-side.
Demos
Once you've installed this app, go to /wires/demos in your Elefant CMS installation
and log in as a site administrator to see some working demos.
You can inspect the source code for the demos under apps/wires/handlers/demos and apps/wires/views/demos in your Elefant CMS installation.
