I have a few years worth of experience building Child Themes in WordPress, which is generally my preferred route when developing a new website as I am not a theme developer per say.
I am now doing a couple of projects which want to leverage the WP REST API, and I am looking to use the Foxhound theme, built using React js, as a parent theme.
Beyond the page template/css overloading approach to child theme-ing, I have been trying to understand how to extend the parent theme's default react app functionality to customise my child theme js functionality. I understand how to add custom fields to existing end-points, however, what I am not able to understand is how to load custom react components. Should I/Can I build a custom react app to load from my child theme? If so how can I ensure it executes after the parent theme app?
I have a few years worth of experience building Child Themes in WordPress, which is generally my preferred route when developing a new website as I am not a theme developer per say.
I am now doing a couple of projects which want to leverage the WP REST API, and I am looking to use the Foxhound theme, built using React js, as a parent theme.
Beyond the page template/css overloading approach to child theme-ing, I have been trying to understand how to extend the parent theme's default react app functionality to customise my child theme js functionality. I understand how to add custom fields to existing end-points, however, what I am not able to understand is how to load custom react components. Should I/Can I build a custom react app to load from my child theme? If so how can I ensure it executes after the parent theme app?
like with every other theme, there is no assurance a random theme can be used as a child theme unless it is explicitly specified that it supports child themes and provides APIs to let child themes manipulate it output. This is true even for "normal" themes, and double true for unexplored area like themes based on JS frameworks.
In other words, you will need to ask the theme author.
For those who might be interested in more information on the question, I have, after much research and comparison of the 3 main reactive js frameworks (AngularJS, React, and VueJS) come to the conclusion that none of these frameworks are originally designed to implement Child-themeing as defined by WordPress.
The main obstacle is the fact these frameworks' general practice is to build js apps (compressed and minimised into single script files) which contain the HTML templates for content layout. Hence once built, these cannot be extended on the server side, nor do the frameworks provide (as yet) a mechanism to override/extend these templates on the client-side with some additional scripts.
However, it is possible to load the plugin and execute custom script files without build'ing the app before hand, and that does leave the door open to child-themeing template layouts server-side using PHP, while leveraging Javascript module patterns, it is possible to build a reactive WordPress theme that can be fully extended with a child theme.
I set about teaching myself VueJS2 (which has a shallower learning curve than Angular and React) with these excellent youtube videos, and build such a theme. I have now released this theme on GitHub for others to play with. It is compatible with multisite installations as well as a number of other plugins in order to solve a number of common tasks when building a website, 404 pages, page builders, CDN caching, multilingual content and various other.
