You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/DevWorkingWithGrafana.md
+7-5Lines changed: 7 additions & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -10,7 +10,7 @@
10
10
11
11
****datasources*** tells Grafana where to look for metrics. You'll see that it is already set up to query the Prometheus instance on port 9000 (see the Docketeer Config Diagram in ***/docs/assets/docketeer-config.png***). Do not change this file.
12
12
13
-
****dashboards*** contains our JSON and yaml files that build our dahboards. These are the primary files to edit if you want to change the dashboards or create a new one. The yaml file tells Grafana where to fetch the files to build our dashboards, and what datasource we are using for our panels and queries. Each JSON file will build a seperate dashboard for use to use as an embedded iframe in Docketeer. Currently there are 3: ***dashboard.json*** which is used in the Containers tab, ***docker_metrics.json*** which is used in the Container Metrics tab, and ***k8s-views-nodes.json*** which is used in the Kubernetes Metrics tab. Each JSON file is thousands of lines long, and has many configurations to achieve the graphs we have. To edit, or add panels, the primary method is to navigate to the Grafana and Prometheus endpoints, and to use the Grafana GUI.
13
+
****dashboards*** contains our JSON and yaml files that build our dahboards. These are the primary files to edit if you want to change the dashboards or create a new one. The yaml file tells Grafana where to fetch the files to build our dashboards, and what datasource we are using for our panels and queries. Each JSON file will build a seperate dashboard for use to use as an embedded iframe in Docketeer. Currently there are 4: ***dashboard.json*** which is used in the Containers tab, ***docker_metrics.json*** which is used in the Container Metrics tab, ***snapshot-dashboard.json*** which is used in the Snapshot tab, and ***k8s-views-nodes.json*** which is used in the Kubernetes Metrics tab. Each JSON file is thousands of lines long, and has many configurations to achieve the graphs we have. To edit, or add panels, the primary method is to navigate to the Grafana and Prometheus endpoints, and to use the Grafana GUI.
14
14
15
15
## Using the Grafana GUI
16
16
@@ -30,22 +30,24 @@ When running Docketeer in Dev Mode, a Grafana instance is running on the exposed
30
30
31
31
* To change a panel click on the 3 dots in on the upper right of the metric you want to change. Select "Edit".
32
32
33
-
* Now we can change our query, visualization, and configurations using the Grafana GUI instead of coding the JSON by hand. When you're done, click apply then save, before navigating back to our dashboard.
33
+
* Now we can change our query, visualization, and configurations using the Grafana GUI instead of coding the JSON by hand. When you're done, click apply then save, before navigating back to our dashboard.
34
34
35
35
* You will notice that once you save, the changes will be reflected in Docketeer. However, These changes will not persist if you rebuild Docketeer. To persist these changes on rebuild we will have to edit the JSON of our dashboards.
36
36
37
37
* If you made an individual change on a panel. Click the 3 dots on the changed panel, and select "Inspect". Here you can see your Data, Stats, JSON, and Query, but we are interested in the JSON. Copy this entire JSON, and use this to replace the panel in the original dashboard JSON. The easiest way to find the panel you're looking for is to search for the panel name, and to replace the object containing it with your new JSON.
38
38
39
39
* Tear down Docketeer, and rebuild to see if the panel has been replaced with your updated one. Sometimes, after tear down, you will need to delete all your images, and delete all volumes except for the prometheus data volume before rebuilding Docketeer in order to make docker rebuild the Grafana instance.
40
40
41
-
* If you made many changes to many panels, or to the shared settings like timeframe and refresh rate, the JSON process will be slightly different. Click the share button on the Nav Bar, here you can export the entire dashboard ysing different methods. Select "Export" then "View JSON". This is the JSON for the entrie dashboard you have been working on. Select all and copy the JSON. Replacing the whole dashboard JSON will result in an error, so instead you will need to replace the "panels" array. Paste your copied JSON into a seperate VSC window, and callapse the "panels" array to make it easier to copy (in some cases it is thousands of lines long). Callapsed the "panels" array in your dashboard JSON and replace it with your new and improved panels array. Rebuild and your dashboard should be updated with the changes you made.
41
+
* If you made many changes to many panels, or to the shared settings like timeframe and refresh rate, the JSON process will be slightly different. Click the share button on the Nav Bar, here you can export the entire dashboard ysing different methods. Select "Export" then "View JSON". This is the JSON for the entrie dashboard you have been working on. Select all and copy the JSON. Replacing the whole dashboard JSON will result in an error, so instead you will need to replace the "panels" array. Paste your copied JSON into a seperate VSC window, and callapse the "panels" array to make it easier to copy (in some cases it is thousands of lines long). Callapsed the "panels" array in your dashboard JSON and replace it with your new and improved panels array. Rebuild and your dashboard should be updated with the changes you made.
42
42
43
43
## Aditional Notes
44
44
45
-
* Review the [Grafana Docs](https://grafana.com/docs/grafana/latest/) for details on the configuration files, and working with the JSON settings.
45
+
* Review the [Grafana Docs](https://grafana.com/docs/grafana/latest/) for details on the configuration files, and working with the JSON settings.
46
46
47
47
* To see what your Prometheus query is returning, go to the Prometheus endpoint, exposed in the development mode on port 49156. On localhost:49156 you can insert queries and get raw data to confirm any errors you get on the Grafana Visualizer.
48
48
49
49
* Review the [Prometheus Docs](https://prometheus.io/docs/introduction/overview/) for details on PromQL and Prometheus.
50
50
51
-
* . Prometheus is scrapping the container data from cAdvisor which is running on port 49158 in development mode. You can visit this in browser to compare any metrics you're fetching in Prometheus or Grafana. See more in the [Prometheus Docs](https://prometheus.io/docs/guides/cadvisor/) and the [cAdvisor Github](https://github.com/google/cadvisor).
51
+
* . Prometheus is scrapping the container data from cAdvisor which is running on port 49158 in development mode. You can visit this in browser to compare any metrics you're fetching in Prometheus or Grafana. See more in the [Prometheus Docs](https://prometheus.io/docs/guides/cadvisor/) and the [cAdvisor Github](https://github.com/google/cadvisor).
52
+
53
+
* When export dashboards, Grafana tends to create varibles such as {DS_Prometheus} or {DS_Postgres}. If you run into issues regarding this, find the specific uid for by clicking the 3 dots of a specific panel and looking at its JSON.
****Important***: DO NOT USE CORS IN THE BACKEND! It will mess up the ddClientRequests.
2
+
1
3
* Not all of the backend endpoints are being used currently as they were not built out on the frontend
2
4
* The Configuration Tab currently only reads and writes to the database, need both update and delete
3
-
* The purpose of the Configuration Tab is to configure Prometheus endpoints that the app can scrape. This needs to be set up on the backend. When an endpoint is added to the configuration database, a .yml file needs to be generated for the new endpoint (see the imageConfigs/prometheus/prometheus.yml on how this file looks). The prometheus container then must be reloaded pointing to the new configuration file. This should allow prometheus to scrape from this new config file.
5
+
* The purpose of the Configuration Tab is to configure Prometheus endpoints that the app can scrape. This needs to be set up on the backend. When an endpoint is added to the configuration database, a .yml file needs to be generated for the new endpoint (see the imageConfigs/prometheus/prometheus.yml on how this file looks). The prometheus container then must be reloaded pointing to the new configuration file. This should allow prometheus to scrape from this new config file.
* Added ***Save Metric*** button under Container Metrics tab to save 6 key metrics of the container. Key metrics are metric date, diskspace, memory, swap, cpu usage and available memory. Those metrics are saved in PostgreSQL.
6
+
* Added ***Snapshot*** page. By selecting a timestamp in the dropdown, users can compare the metrics saved in the database.
7
+
* Added ***Snapshot test*** dashboard in Grafana for display the metrics visualization. (see /imageConfigs/grafana/provisioning/dashboards/snapshot-dashboard.json)
8
+
* Added ***configurations*** to connect Grafana dashboard and PostgreSQL (see /imageConfigs/grafana/provisioning/datasources/srcPostgres.yml)
9
+
10
+
11
+
#### Dev Features
12
+
13
+
#### Bug Fixes
14
+
* Fixed all frontend ***testing*** files to make sure the components are being rendered. Testings include Container tab, Image tab, Metric tab, Network tab, Volume tab and Reducers.
15
+
* Fixed all server ***testing*** files to make sure all the routes are functioning as expected. Testing include Network Routes
16
+
17
+
#### Misc. Fixes and Cleaning
18
+
* Added ***Typescript*** to new features and fixed some Typescript on previous codebase.
19
+
* Added additional information to ***Documentation*** to help with later iterations.
0 commit comments