# Swap Angular Components with React Components with ngReact The React.js library can be used as a view component in web applications. ngReact is an Angular module that allows React Components to be used in AngularJS applications. https://www.npmjs.com/package/ngreact
The angularJs code:
<li>
<h2> Title </h2>
<listing-button url=""> Buy now </listing-button>
<li>
Using Library NGReact:
<li>
<react-component name="listingsTitle" props="..."/>
<react-component name="listingsButton" props="..."/>
<li>
After all sub components are migrated, migrate the full component to React.
import React, {Component} from 'react';
import ListingsTitle from './listings-title'
import ListingsButton from './lisitngs-button'
class ListingsItem extends Component {
render(){
return (
<li>
<listingsTitle ... />
<listingsButton .../>
<li>
)
}
}
Template:
<react-component name="listingsItem" props="..."/>
Problem: Unit tests are coupled to code Solution: Use Integration Tests temporarily to cover non unit tests covered components.
Source: https://javascriptplayground.com/blog/2017/08/migrating-complex-javascript-angular-react/
Created on 10/21/2017