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.


1 Comments

One thought on “How to integrate young framework like React in old web pages

  1. Rylan says:

    very interesting!
    Thanks!

Add Your Comment: