PHPackages                             yireo/magento2-react - 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. [Utility &amp; Helpers](/categories/utility)
4. /
5. yireo/magento2-react

ActiveMagento2-module[Utility &amp; Helpers](/categories/utility)

yireo/magento2-react
====================

Module to add React to Magento 2 KO frontend

16.9.1(5y ago)249.8k121OSL-3.0JavaScript

Since Mar 22Pushed 3y ago3 watchersCompare

[ Source](https://github.com/yireo-training/Yireo_React)[ Packagist](https://packagist.org/packages/yireo/magento2-react)[ RSS](/packages/yireo-magento2-react/feed)WikiDiscussions master Synced 3w ago

READMEChangelogDependencies (1)Versions (4)Used By (1)

React for Magento 2 Knockout-based frontend
===========================================

[](#react-for-magento-2-knockout-based-frontend)

The current Magento 2 frontend is based on Knockout, RequireJS and ES5 code. However, with an eye on the upcoming PWA moves, it is already possible to add React components to the Magento 2 frontend as it is. This Magento module serves as a base module, to offer a generic Webpack configuration for modules like [Yireo\_ReactMinicart](https://github.com/yireo-training/Yireo_ReactMinicart) and [Yireo\_ReactMenu](https://github.com/yireo-training/Yireo_ReactMenu).

### Installation

[](#installation)

Use the following commands to install this module into Magento 2:

```
composer require yireo/magento2-react:dev-master
bin/magento module:enable Yireo_React
bin/magento setup:upgrade

```

Next, copy the files `package.json` and `webpack.config.js` to the Magento root. Next, install all of the packages:

```
yarn install

```

Next, you can build React sources in various modules via Webpack:

```
yarn dev

```

Alternatively, you can also copy the 2 files to another folder and use the `MAGENTO_ROOT` variable:

```
MAGENTO_ROOT=/var/www/html yarn dev

```

### Usage

[](#usage)

This module has no real functionality. It is only offering configuration files for other React modules.

See the [Yireo\_ReactMenu](https://github.com/yireo-training/Yireo_ReactMenu) module for a dummy component.

The goal is to either create a module with a `view/frontend/react_source` folder or a theme with a `react_source` folder and have this Webpack configuration pick up on those files to create a single bundle. Dynamic bundles (with an `import()` function call) are also supported.

The theme is identified with a global variable:

```
MAGENTO_THEME=Magento/luma yarn dev

```

### Experimental

[](#experimental)

This module is experimental and only meant for developers that are happy to invest time into it. It doesn't mean that it is costing a lot of effort, it simply means that the project requires knowledge on React essentials.

###  Health Score

36

—

LowBetter than 79% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity32

Limited adoption so far

Community17

Small or concentrated contributor base

Maturity62

Established project with proven stability

 Bus Factor1

Top contributor holds 96.4% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~372 days

Total

3

Last Release

1906d ago

Major Versions

0.0.1 → 16.9.02019-08-26

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/1373981?v=4)[Yireo](/maintainers/yireo)[@yireo](https://github.com/yireo)

---

Top Contributors

[![jissereitsma](https://avatars.githubusercontent.com/u/7670482?v=4)](https://github.com/jissereitsma "jissereitsma (27 commits)")[![WouterSteen](https://avatars.githubusercontent.com/u/5089604?v=4)](https://github.com/WouterSteen "WouterSteen (1 commits)")

---

Tags

magentocomposer-installer

### Embed Badge

![Health badge](/badges/yireo-magento2-react/health.svg)

```
[![Health](https://phpackages.com/badges/yireo-magento2-react/health.svg)](https://phpackages.com/packages/yireo-magento2-react)
```

###  Alternatives

[magento/magento-composer-installer

Composer installer for Magento modules

7523.9M341](/packages/magento-magento-composer-installer)[yireo/magento2-webp2

Magento 2 module to add WebP support to the Magento frontend

2111.3M7](/packages/yireo-magento2-webp2)[magento-hackathon/magento-composer-installer

Composer installer for Magento modules

210787.6k381](/packages/magento-hackathon-magento-composer-installer)[yireo/magento2-googletagmanager2

Add Google Tag Manager to Magento

166986.9k5](/packages/yireo-magento2-googletagmanager2)[yireo/magento2-extensionchecker

Scan the code of a Magento module

96160.1k3](/packages/yireo-magento2-extensionchecker)[yireo/magento2-disablelog2

Magento 2 module to disable customer logging

31366.5k](/packages/yireo-magento2-disablelog2)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
