PHPackages                             neutromelabs/magento2-headless-components - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Templating &amp; Views](/categories/templating)
4. /
5. neutromelabs/magento2-headless-components

ActiveMagento2-module[Templating &amp; Views](/categories/templating)

neutromelabs/magento2-headless-components
=========================================

Simple phtml template rendering without XML layout. Includes caching, theming via native Magento overrides, and first-class AlpineJS support.

0.3.0(6mo ago)0141GPL-3.0-or-laterPHPPHP ^8.1

Since Nov 13Pushed 6mo agoCompare

[ Source](https://github.com/neutrome-labs/magento2-headless-components)[ Packagist](https://packagist.org/packages/neutromelabs/magento2-headless-components)[ RSS](/packages/neutromelabs-magento2-headless-components/feed)WikiDiscussions main Synced today

READMEChangelogDependencies (1)Versions (3)Used By (0)

```
Uncomplicate rich modular layouts based on AlpineJS-components
with Magento 2 Headless Components experience.

```

Magento 2 Headless Components Module
====================================

[](#magento-2-headless-components-module)

Provides a simple way to render phtml-based templates, without the need to register them in the xml layout. Includes caching, native Magento theme overrides, and first-class AlpineJS support.

Overview
--------

[](#overview)

This is a tool to do a

```
\Magento\Framework\App\ObjectManager::getInstance()
    ->get(\Magento\Framework\View\LayoutInterface::class)
    ->createBlock(\Magento\Framework\View\Element\Template::class)
    ->setTemplate('Vendor_Module::component/headless/block/template.phtml')
    ->toHtml();
```

in a "better" way:

- Native Magento theme overrides
- Block caching
- FPC compatible
- JS-companion blocks for AlpineJS

### The Problem

[](#the-problem)

1. Magento 2 has no ability to simply render templates like `{{ templates/button }}`as almost every other templating engine provides.
2. AlpineJS-based themes and components become hard to upgrade when overwritten, because of the need to copy-paste the whole JS logic within the template.

### Proposed Solution

[](#proposed-solution)

This module provides an easier way to render templates, with first-class AlpineJS support via decoupling JS logic from templates into `.script.phtml` companion files. The layout system is used for macro-level layouting (`header`, `footer`, `product-details`), and Headless Components for atom/block level - `button`, `input`, `accordion`.

Installation
------------

[](#installation)

```
composer require neutromelabs/magento2-headless-components
bin/magento setup:upgrade
```

How To Use
----------

[](#how-to-use)

### Basic Usage

[](#basic-usage)

```
/** view/frontend/templates/some/template.phtml */
