...
In our example, our webapp is hosted at /otherfolder
and we decided to host DatafariUI on a page under /otherfolder/testdatafariui
.
2- Prepare DatafariUI for the build
...
You will need to perform two things:
Include the necessary scripts and css into the page
Add a div with the id “root” to your page
Including required scripts and css
Open the index.html file from the build folder (build/index.html
) of the datafariui project (the file content is written on one line, you can reformat it to help you copy the required elements). From there, identify and copy the 3 scripts elements at the end of the body and add them to the end of the body of your page. They should look something like the following:
...
For reference, here is look at my html page, which is /var/www/html/testdatafariui/index.
html htm
l in my case (I integrated DatafariUI into the default index page of the ubuntu installation of apache2 here, and enlarged the main div to 90% of the width of the page to have a proper render of the UI):
...
DatafariUI is bootstrapped using create-react-app. The app is using the webpack runtime with the default configuration. If your application does the same, there will be a clash of names and only one application will be able to load on the page at any given time. To fix that, follow the information of this blog post: https://medium.jonasbandi.net/hosting-multiple-react-applications-on-the-same-document-c887df1a1fcd
View file | ||
---|---|---|
|