https://github.com/magewirephp/magewire
Magewire is a Laravel Livewire port for Magento 2. The goal is to make it fun and easy to build modern, reactive and dynamic interfaces, without leaving the comfort of Magento's core layout and template systems. Magewire can be the missing piece when you intend to build dynamic and reactive features, but don't require or feel comfortable working with a full JavaScript framework like Vue or React.
https://github.com/magewirephp/magewire
magento2 magento2-module
Last synced: 5 months ago
JSON representation
Magewire is a Laravel Livewire port for Magento 2. The goal is to make it fun and easy to build modern, reactive and dynamic interfaces, without leaving the comfort of Magento's core layout and template systems. Magewire can be the missing piece when you intend to build dynamic and reactive features, but don't require or feel comfortable working with a full JavaScript framework like Vue or React.
- Host: GitHub
- URL: https://github.com/magewirephp/magewire
- Owner: magewirephp
- License: mit
- Created: 2021-10-08T11:53:05.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2024-04-18T12:46:02.000Z (about 2 years ago)
- Last Synced: 2024-05-02T05:06:53.349Z (about 2 years ago)
- Topics: magento2, magento2-module
- Language: PHP
- Homepage:
- Size: 685 KB
- Stars: 209
- Watchers: 16
- Forks: 32
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE.md
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome-magento2 - Magewire PHP - A Laravel Livewire port for building complex AJAX-based components with ease. Used by the Hyvä Checkout. (Open Source Extensions / Development Utilities)
README
# Magewire PHP - BETA
> **⚠️ BETA WARNING:** The main branch contains the beta version of MagewirePHP v3. For stable v1 documentation and releases, please switch to the [1.x branch]([../../tree/1.x](https://github.com/magewirephp/magewire/tree/1.x)).
[](https://packagist.org/packages/magewirephp/magewire)
[](https://packagist.org/packages/magewirephp/magewire)
[](https://github.styleci.io/repos/414967404/shield?style=flat&branch=main)
[](https://packagist.org/packages/magewirephp/magewire)
MagewirePHP brings the power of reactive, server-driven UI development to Magento 2—without writing JavaScript.
Inspired by Laravel Livewire, MagewirePHP lets you build dynamic, interactive frontend components using only PHP,
fully integrated with Magento’s architecture.
Whether you're creating real-time search, dynamic product forms, or interactive checkout steps, MagewirePHP enables a clean,
component-based approach that stays true to Magento’s conventions while simplifying complex frontend behavior.
- ✅ Write less JavaScript
- ✅ Maintain component logic in PHP
- ✅ Ideal for dynamic UIs like filters, modals, and configurators
MagewirePHP helps you deliver modern UX experiences in Magento—faster, cleaner, and with less frontend overhead.
[](https://discord.gg/zS7z7rmH)
## Documentation
- [Gettings Started](https://magewirephp.github.io/magewire-docs/index.html)
- [Essentials](https://magewirephp.github.io/magewire-docs/pages/essentials/components.html)
- [Features](https://magewirephp.github.io/magewire-docs/pages/features/alpine.html)
- [Directives](https://magewirephp.github.io/magewire-docs/pages/html-directives/wire-click.html)
- [Concepts](https://magewirephp.github.io/magewire-docs/pages/concepts/morphing.html)
- [Advanced](https://magewirephp.github.io/magewire-docs/pages/advanced/troubleshooting.html)
## Sponsors
Click [here](https://github.com/sponsors/wpoortman) to start sponsoring.
## Installation
To install Magewire in your Magento 2 project, follow these steps:
1. Require Magewire via Composer:
```shell
composer require magewirephp/magewire
```
2. Enable the module:
```shell
bin/magento module:enable Magewirephp_Magewire
```
3. Enable the theme compatibility module (determined per theme, in this case Hyvä):
```shell
bin/magento module:enable Magewirephp_MagewireCompatibilityWithHyva
```
4. Run the setup upgrade command:
```shell
bin/magento setup:upgrade
```
5. Deploy static content (when in production mode):
```shell
bin/magento setup:static-content:deploy
```
6. Flush the cache:
```shell
bin/magento cache:flush
```
## Code
### Styles
To run styles, follow these steps:
1. Install packages:
```shell
npm ci
```
2. Run styles:
```shell
npx @tailwindcss/cli -i ./styles/magewire.css -o ./src/view/base/web/css/magewire.css --optimize
```
Use the `--watch` flag to re-compile on template changes.
## Contributing
Thank you for considering contributing to Magewire! Please read the [contribution guide](https://github.com/magewirephp/magewire/blob/main/CONTRIBUTING.md) to know how to behave, install and use Magewire for contributors.
## Code of Conduct
In order to ensure that the Magewire is welcoming to all, please review and abide by the [Code of Conduct](https://github.com/magewirephp/magewire/blob/main/CODE_OF_CONDUCT.md).
## Security Vulnerabilities
If you discover a security vulnerability within Magewire, please create a
[merge request](https://github.com/magewirephp/magewire/pulls) or an
[discussion](https://github.com/magewirephp/magewire/discussions). All security vulnerabilities will be promptly
addressed.
## License
Copyright © [Willem Poortman](https://github.com/wpoortman)
Magewire is open-sourced software licensed under the [MIT license](LICENSE.md).
> It's important to emphasize that this package is completely independent of any business entities. There is absolutely
> no involvement or interference from other companies expressing their preferences. This package is created by the
> community, for the community, ensuring its integrity and unbiased nature.
