How to integrate young framework like React in old web pages

In these days I’m trying to improve the user experience of an old JSP page. So I thought of injecting into it some custom components of the framework react.

Integrate a basic React app inside an existing web page, like for example an HTML or JSP or PHP page, is very very simple and, most important thing, it does not require a build and an import of tons of prebuild files.

Below an example of how to do this integration inside a generic html page.

<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script type="text/babel" src="/js/app.js"></script>

<div id="react-content" />

<script type="text/babel">
ReactDOM.render(<CustomApp />, document.getElementById('react-content'));
</script>

And nothing special in app.js file than a classic CustomApp class react component!

The possibility of using React directly in existing web pages, without big frills and various builds, is really very convenient.
I don’t know if Angular can also be used in the same way. I’ll try in the next few days.


How to integrate young framework like React in old web pages

  1. Rylan ha detto:

    very interesting!
    Thanks!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *