The web dashboard is work in progress towards the new Flink runtime monitor. In particular, it will provide the following missing features of the current web dashboard:
The web dashboard can be activated by adding/uncommenting the config parameter jobmanager.new-web-frontend: true
in the conf/fink-conf.yaml
file. The dashboard listens at http://localhost:8081
.
The new web dashboard is work in progress. It starts an additional HTTP server (by default at port 8081) that serves the new web pages and additional background requests. It also relies on the old HTTP server for some requests still.
NOTE: Many values are placeholders still.
The server side of the dashboard is implemented using Netty with Netty Router for REST paths. The framework has very lightweight dependencies.
The code is regular Java code built via Maven. To add additional request handlers, follow the example of the org.apache.flink.runtime.webmonitor.handlers.JobSummaryHandler
.
The web dashboard is implemented using angular.js. The dashboard build infrastructure uses node.js. The dashboard files are all pre-built, so one can try it out without building it.
Depending on your version of Linux or MacOS, you may need to manually install node.js and bower.
Install node.js by following these instructions.
Verify that the installed version is at least 2.11.3, via npm -version
.
Install bower via
sudo npm install -g bower
Verify that the installed version is at least 1.4.1, via bower -version
.
Install gulp via
sudo npm install -g gulp
Verify that the installed version is at least 3.9.0, via gulp -version
.
The build process downloads all requires libraries via the node.js package management tool (npm) and the bower dependency management tool. The final build tool is gulp.
cd flink-runtime-web/web-dashboard npm install bower install gulp
The dashboard code is under /app
. The result of the build process is under /web
in the src/main/resources folder.
When building Flink with Maven (in particular the flink-dist
project), the generated files are copied into the build target, to the folder resources/web-runtime-monitor
.
When developing the dashboard, every change needs to recompile the files and update the server:
cd flink-runtime-web/web-dashboard gulp cd ../../flink-dist mvn -DskipTests clean package
To simplify continuous development, one can use a standalone proxy server, together with automatic re-compilation:
app/scripts/index.coffee
. Comment/uncomment the lines that define the webServer
, and jobServer
URLs.gulp
. By calling gulp watch
, the build-tool autocompiles future changes.node server.js
http://localhost:3000