Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/osandadeshan/api-health-checker-dashboard
A node application to show the availability of the backend services in a dashboard.
https://github.com/osandadeshan/api-health-checker-dashboard
api api-health-checker backend-services css dashboard dashboard-application health-check html5 javascript
Last synced: about 19 hours ago
JSON representation
A node application to show the availability of the backend services in a dashboard.
- Host: GitHub
- URL: https://github.com/osandadeshan/api-health-checker-dashboard
- Owner: osandadeshan
- License: mit
- Created: 2020-10-15T14:27:56.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2024-04-26T17:06:32.000Z (7 months ago)
- Last Synced: 2024-04-26T18:26:01.915Z (7 months ago)
- Topics: api, api-health-checker, backend-services, css, dashboard, dashboard-application, health-check, html5, javascript
- Language: JavaScript
- Homepage: https://osandadeshan-api-health-checker-dashboard.glitch.me/
- Size: 3.94 MB
- Stars: 16
- Watchers: 4
- Forks: 12
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# API Health Checker Dashboard
## Introduction
When we are working on a real project, it is vital to have a dashboard where we can find the availability of the backend services integrated with that project.
This solution can be used for that purpose.> Demo App
![](https://user-images.githubusercontent.com/9147189/135744321-a4f58864-7331-4097-b83c-43edb2940d5a.png)## Advantages
* Easy to find unavailable backend services
* Real-time updating the services' status in every “x” seconds (“x” can be configured. By default, “x” is 30 seconds)
* Easy to integrate services
* Can maintain multiple environments
* No need to worry about the [CORS issue](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS)
* Both Web and Mobile friendly UI
* Free and open-source## Architecture
> Architecture
![](https://user-images.githubusercontent.com/9147189/135319309-3a8eda05-dc29-4df0-be03-5b921b17a822.PNG)## API Health Checker Dashboard Vs Dynatrace Dashboard
| Criteria | API Health Checker Dashboard | Dynatrace Dashboard |
| ------------ | ------------ | ------------ |
| Real-time monitoring | Yes | Minimum interval is 5 minutes |
| Historical view | Not yet implemented | Yes |
| Integrating backend services | Only need to update in a single file | Need to create HTTP monitors per service and add it to the dashboard |
| Managing environments | Can maintain multiple environments via multiple json files | Need to create multiple HTTP monitors per each environment and service |
| Cost | Free and open-source | Paid tool |## How to use?
**Pre-requisites:**
* [Node](https://nodejs.org/en/download/)
* [VSCode](https://code.visualstudio.com/download)**Steps:**
1. Clone this project
2. Open the project in VSCode
3. Update the JSON files located in "***api-health-checker-dashboard/config***" with your Backend services' health routes
4. Save the changes
5. Open a terminal from VSCode
6. Execute ***`npm install`*** to install the node modules
7. Execute ***`npm run dev`*** to start the node application
8. Open the web application from http://localhost:5000**Note: You won't be facing [CORS issue.](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS) Because this application has a proxy layer to solve that issue. You can deploy this application as a node application.**
## Deployment
You can deploy this as a node application.**Sample API Health Checker Dashboard: https://osandadeshan-api-health-checker-dashboard.glitch.me/**
## License
[API Health Checker Dashboard](https://medium.com/api-health-checker) is released under [MIT License](https://opensource.org/licenses/MIT)## Copyright
Copyright 2022 [MaxSoft](https://maxsoftlk.github.io/).