a tool for monitoring traffic in clients' applications

technicals

On the side of the application being watched, just implement the Morgan library and add a few lines of code. The Logger application receives logs of this application, saves them in the MongoDB database. It is then an API that serves the saved data to the browser-based React application which is a panel, where you can display this data in the correct form, filter.

Thanks to Socket.IO, the browser panel can also receive data about new entries in the database in the push (live) mode.

Material UI was used for styling, the components were modified. The form (implemented Formik) of filters contains drop-downs, which are dynamic - the available options depend on the availability of the data (e.g. at what times the queries were made, these hours are presented in the filter so as not to display empty tables).

Tables have modifiable columns and expandable rows when their size is large. The labeling system described on the project's homepage will be implemented soon.