React App as a Wordpress Plugin rendered with Shortcode

<?php/*** Plugin.* @package reactplug* @wordpress-plugin* Plugin Name:     React With WP Plugin* Description:     ReactJS plugin for Wordpress* Author:          Wes Huber* Author URL:      https://weshuber.com* Version:         1.0*/?>
npm init
npm install @wordpress/scripts --save-dev
"scripts": {        
"build": "wp-scripts build"
}
const defaults = require('@wordpress/scripts/config/webpack.config');module.exports = {
...defaults,
externals: {
react: 'React',
'react-dom': 'ReactDOM',
},
};
const { render } = wp.element; import App from './App';import './style.css';if (document.getElementById('my-react-app')) {render(<App />, document.getElementById('my-react-app'));}
const App = () => {return (<div class="container"><h2>Hello World From React App {data.email}</h2></div>);};export default App;
npm run build

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Wesley Huber

Wesley Huber

I'm 29 years old, Freelance Web Developer and Boardsports enthusiast