Sometimes, you can’t find a block you need, and you want to make complex interactions, such as custom forms. And you can’t find a plugin, or it’s too expensive. And you have time and are willing to experiment and dive into AI coding.
We created React Rooter for you. This allows you to make custom apps directly in WordPress environment that will work in editor and on frontend.
How to use it React Rooter for WordPress
Download folder from our github repository and put inside wp-content/plugins
Now, install Cursor AI or any IDE for AI coding. Open folder of plugin. Open src/App.js file This file will be your main entry for your application. You can use here all React and WP functions or ask AI to build application in this file. If you use Cursor AI, simply click on Cmd+L and this will open chat with App.js.
Then, in terminal, use regular node function
npm start – this will generate your app and will watch for changes
npm build – this will make production ready code
npm run hot-start – this will generate app and open Hot reload page where you can see only your app and it will autorefresh if you add code changes.
If hot reload doesn’t work, edit gulpfile.js and replace URL of your local site in const siteUrl.
Example: const siteUrl = ‘http://test.com’;
you may need to remove also port: 8888,
How to put App on page
Open the editor and add the block “React rooter” to the page. This will display the app on your page.