In order to be able to integrate dashboards in web pages in any website (which is the final goal really), we need to decouple the application, meaning separate the front-end and back-end in 2 separate projects.
Backend
NextJS will still be handling the config file uploads and management, and provide API end point to serve those files to the front end.
You will still be able to access a dashboard by going to https://<host>/chart/<dashID>
Frontend
This will now be a pure ReactJS project and only display the dashboard itself.
A few key points to keep in mind for the React app
Root component will be passed on the URL to the config file to load it
The navigation menu will be removed as it will make no sense once integrated in a web page
We wil add CSS classes to components so style can be defined on the host website CSS
We also need to document how to style highcharts charts to match host website.
In order to be able to integrate dashboards in web pages in any website (which is the final goal really), we need to decouple the application, meaning separate the front-end and back-end in 2 separate projects.
Backend NextJS will still be handling the config file uploads and management, and provide API end point to serve those files to the front end. You will still be able to access a dashboard by going to
https://<host>/chart/<dashID>
Frontend This will now be a pure ReactJS project and only display the dashboard itself.
A few key points to keep in mind for the React app
We also need to document how to style highcharts charts to match host website.
Does this make sense?
Am I missing anything?