Skip to content

Commit f6d1d78

Browse files
committed
readme updated
1 parent 7c5e18a commit f6d1d78

3 files changed

Lines changed: 90 additions & 77 deletions

File tree

README.md

Lines changed: 83 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -7,29 +7,19 @@
77
![License: MIT](https://img.shields.io/badge/License-MIT-brightgreen.svg)
88
![Release: 12.0](https://img.shields.io/badge/Release-12.0-brightgreen)
99

10-
1110
# Chronos
1211

13-
1412
### ⭐️ Star us on GitHub! ⭐️
13+
1514
**Visit our website at [chronoslany.com](https://chronoslany.com/).**
1615

1716
Chronos is a comprehensive developer tool that monitors the health and web traffic for containerized (Docker & Kubernetes) and non-containerized microservices communicated via REST APIs or gRPC, whether hosted locally or on Amazon Web Services (AWS). Use Chronos to see real-time data monitoring and receive automated notifications over Slack or email.
1817

19-
2018
## What's New?
2119

22-
### With Chronos 12.0:
23-
24-
- Enhanced metrics visualization by integrating more interactive and adaptable Grafana charts for Docker and Kubernetes use cases.
25-
- Achieved an 80% boost in test coverage by formulating comprehensive unit, integration, and end-to-end tests employing Jest and Selenium.
26-
- Implemented Prometheus data scraping functionality for Docker containers, facilitating seamless metric collection and monitoring.
27-
- Devised an immersive 3D visualization that effectively illustrates the Kubernetes cluster infrastructure, encompassing Namespace, Service, and Pod entities. This dynamic visualization provides developers and users with heightened insights into intricate resource allocation and configuration within the cluster.
28-
- Streamlined operational effectiveness by coordinating CI/CD pipelines, automating testing workflows, and establishing deployment protocols, ultimately leading to accelerated development cycles and heightened dependability.
29-
- Expanded Typescript coverage to enhance code quality and bolster application resilience.
30-
- Updated the Docker and Kubernetes example READMEs with detailed instructions on configuring Prometheus and Grafana seamlessly.
31-
- Enhanced clarity of instructions in the `@chronosmicro/tracker` NPM package's README, offering comprehensive guidance on utilizing the package to monitor individual applications effectively.
20+
- Updated microservices example with
3221

22+
### With Chronos 13.0
3323

3424
<a href="https://chronoslany.com/">
3525
<img src="assets/demo.gif" alt="Chronos" title="Chronos" align="center" height="500" width="auto" />
@@ -38,26 +28,29 @@ Chronos is a comprehensive developer tool that monitors the health and web traff
3828
<br>
3929

4030
**Previously implemented updates:**
41-
- Added interactive charting to better visualize metrics and increase user engagement with their data
42-
- Followed best test-driven development practices and increased testing with React Testing and Jest for the front end
43-
- Overhauled user database security, mitigating database breaches and providing a safer experience
44-
- Bug fixes and UI tweaks, creating a more pleasant user experience
45-
- Updated outdated README instructions within the provided Docker, gRPC, Kubernetes, and microservices examples
46-
- Revised README instructions for the `@chronosmicro/tracker` NPM package
31+
32+
- Enhanced metrics visualization by integrating more interactive and adaptable Grafana charts for Docker and Kubernetes use cases.
33+
- Achieved an 80% boost in test coverage by formulating comprehensive unit, integration, and end-to-end tests employing Jest and Selenium.
34+
- Streamlined operational effectiveness by coordinating CI/CD pipelines, automating testing workflows, and establishing deployment protocols, ultimately leading to accelerated development cycles and heightened dependability.
35+
- Updated the Docker and Kubernetes example READMEs with detailed instructions on configuring Prometheus and Grafana seamlessly.
36+
37+
## Overview of the CodeBase
38+
39+
- Instead of the typical folders & files view, a visual representation of the code is created. Below, it's showing the same repository, but instead of a directory structure, each file and folder as a circle: the circle’s color is the type of file, and the circle’s size represents the size of the file. See live demo <a href='https://mango-dune-07a8b7110.1.azurestaticapps.net/?repo=oslabs-beta%2FChronos'>here</a>.
40+
<img src="assets/Codebase Visulization.png" alt="codebase visulization" align="center" height="500"/>
4741

4842
## Features
4943

5044
- Cloud-Based Instances:
51-
- Option to choose between cloud hosted services and local services, giving Chronos the ability to monitor instances and clusters on AWS EC2, ECS, and EKS platforms <img src="assets/aws-logo-color.png" alt="AWS" title="AWS" align="center" height="20" /></a>
45+
- Option to choose between cloud hosted services and local services, giving Chronos the ability to monitor instances and clusters on AWS EC2, ECS, and EKS platforms <img src="assets/aws-logo-color.png" alt="AWS" title="AWS" align="center" height="20" /></a>
5246
- Local instances utilitizing `@chronosmicro/tracker` NPM package:
53-
- Enables distributed tracing enabled across microservices applications
54-
- Displays real-time temperature, speed, latency, and memory statistics for local services
55-
- Displays and compares multiple microservice metrics in a single graph
56-
- Allow Kubernetes and Docker monitoring via Prometheus server and Grafana visualization.
57-
- Compatible with <img src="assets/graphql-logo-color.png" alt="GraphQL" title="GraphQL" align="center" height="20" /></a>
58-
- Monitor an <a href="#"><img src="assets/pngwing.com.png" alt="Apache Kafka" title="Apache Kafka" align="center" height="20" /></a> cluster via the JMX Prometheus Exporter
59-
- Supports <a href="#"><img src="assets/postgres-logo-color.png" alt="PostgreSQL" title="PostgreSQL" align="center" height="20" /></a> and <img src="assets/mongo-logo-color.png" alt="MongoDB" title="MongoDB" align="center" height="20" /></a> databases
60-
47+
- Enables distributed tracing enabled across microservices applications
48+
- Displays real-time temperature, speed, latency, and memory statistics for local services
49+
- Displays and compares multiple microservice metrics in a single graph
50+
- Allow Kubernetes and Docker monitoring via Prometheus server and Grafana visualization.
51+
- Compatible with <img src="assets/graphql-logo-color.png" alt="GraphQL" title="GraphQL" align="center" height="20" /></a>
52+
- Monitor an <a href="#"><img src="assets/pngwing.com.png" alt="Apache Kafka" title="Apache Kafka" align="center" height="20" /></a> cluster via the JMX Prometheus Exporter
53+
- Supports <a href="#"><img src="assets/postgres-logo-color.png" alt="PostgreSQL" title="PostgreSQL" align="center" height="20" /></a> and <img src="assets/mongo-logo-color.png" alt="MongoDB" title="MongoDB" align="center" height="20" /></a> databases
6154

6255
# Installation
6356

@@ -83,6 +76,7 @@ For more details on the NPM package and instructions for how to use it, please v
8376
<!-- <br> -->
8477

8578
## Chronos Desktop Application
79+
8680
### WSL2 Environment
8781

8882
If you wish to launch the Electron Application in an WSL2 envirronment(Ubuntu) you may need the following commands for an Electron window to appear
@@ -106,40 +100,46 @@ export DISPLAY="`sed -n 's/nameserver //p' /etc/resolv.conf`:0"
106100
**NOTE: You must create your own user database**
107101

108102
1. Create a MongoDB database in which to store user information and insert it on line 2 within the [UserModel.ts](./electron/models/UserModel.ts) (_electron/models/UserModel.ts_) file.
109-
- This database will privately store user information.
110-
3. Once this is set up, you can create new users, log in, and have your data persist between sessions.
103+
- This database will privately store user information.
104+
2. Once this is set up, you can create new users, log in, and have your data persist between sessions.
105+
111106
#
107+
112108
### Running the Chronos desktop app in development mode
113109

114110
1. From the root directory, run `npm install`
115111
2. Run `npm run build`
116-
3. Open a new terminal and run `npm run dev:app` to start the Webpack development server
117-
4. Open a new terminal and run `npm run dev:electron` to start the Electron UI in development mode
118-
.
112+
3. Depends on the environment, run `npm audit fix` or `npm audit fix --force` if prompted
113+
4. Open a new terminal and run `npm run dev:app` to start the Webpack development server
114+
5. Open a new terminal and run `npm run dev:electron` to start the Electron UI in development mode
115+
.
116+
119117
#
118+
120119
### Packing the Chronos desktop app into an executable
121120

122121
1. From the root directory, run `npm run build`
123122
2. Run `npm run package`
124123
3. Find the `chronos.app` executable inside the newly created `release-builds` folder in the root directory.
125124

126125
#
126+
127127
# Examples
128128

129129
We provide eight example applications for you to test out both the Chronos NPM package and the Chronos desktop application:
130130

131131
- AWS
132-
- [EC2 README](./examples/AWS/AWS-EC2/README.md)
133-
- [ECS README](./examples/AWS/AWS-ECS/README.md)
134-
- [EKS README](./examples/AWS/AWS-EKS/README.md)
132+
- [EC2 README](./examples/AWS/AWS-EC2/README.md)
133+
- [ECS README](./examples/AWS/AWS-ECS/README.md)
134+
- [EKS README](./examples/AWS/AWS-EKS/README.md)
135135
- Docker
136-
- [Docker README](./examples/docker/README.md)
136+
- [Docker README](./examples/docker/README.md)
137137
- gRPC
138-
- [gRPC README](./examples/gRPC/README.md)
138+
- [gRPC README](./examples/gRPC/README.md)
139139
- Kubernetes
140-
- [Kubernetes README](./examples/kubernetes/README.md)
140+
- [Kubernetes README](./examples/kubernetes/README.md)
141141
- Microservices
142-
- [Microservices README](./examples/microservices/README.md)
142+
- [Microservices README](./examples/microservices/README.md)
143143

144144
Additional documentation on how Chronos is used **in each example** can be found in the [Chronos NPM Package README](./chronos_npm_package/README.md).
145145

@@ -149,26 +149,28 @@ The `AWS` folder includes 3 example applications with instructions on how to dep
149149

150150
- The ECS folder includes an web application ready to be containerized using Docker. The instruction shows how to deploy application to ECS using Docker CLI command, and it will be managed by Fargate services.
151151
- The EC2 folder includes a React/Redux/SQL web application ready to be containerized using Docker. The instruction shows how to deploy application using AWS Beanstalk and connect application to RDS database. Beanstalk service will generate EC2 instance.
152-
- The EKS folder includes a containerized note taking app that uses a Mongo database as its persistent volume. The instructions show how to deploy this application on EKS, how to monitor with Prometheus & Opencost, and how to use Grafana to grab visualizations.
152+
- The EKS folder includes a containerized note taking app that uses a Mongo database as its persistent volume. The instructions show how to deploy this application on EKS, how to monitor with Prometheus & Opencost, and how to use Grafana to grab visualizations.
153153

154154
Refer to the [EC2 README](./examples/AWS/AWS-EC2/README.md), [ECS README](./examples/AWS/AWS-ECS/README.md), and [EKS README](./examples/AWS/AWS-EKS/README.md) example in the _AWS_ folder for more details.
155155

156156
#
157+
157158
#### _Docker_
158159

159160
In the <a href="#"><img src="assets/docker-logo-color.png" alt="Docker" title="Docker" align="center" height="20" /></a> folder within the `master` branch, we provide a sample _dockerized_ microservices application to test out Chronos and to apply distributed tracing across different containers for your testing convenience.
160161

161162
The `docker` folder includes individual <a href="#"><img src="assets/docker-logo-color.png" alt="Docker" title="Docker" align="center" height="20" /></a> files in their respective directories. A docker-compose.yml is in the root directory in case you'd like to deploy all services together.
162163

163164
Refer to the [Docker README](./examples/docker/README.md) in the `docker` folder for more details.
164-
#
165165

166+
#
166167

167168
#### _gRPC_
168169

169170
The `gRPC` folder includes an HTML frontend and an Express server backend, as well as proto files necessary to build package definitions and make gRPC calls. The _reverse_proxy_ folder contains the server that requires in the clients, which contain methods and services defined by proto files.
170171

171172
Refer to the [gRPC README](./examples/gRPC/README.md) in the `gRPC` folder for more details.
173+
172174
#
173175

174176
#### _Kubernetes_
@@ -184,63 +186,68 @@ Refer to the [Kubernetes README](./examples/kubernetes/README.md) in the `kubern
184186
In the `microservices` folder, we provide a sample microservice application that successfully utilizes Chronos to apply all the powerful, built-in features of our monitoring tool. You can then visualize the data with the <img src="assets/electron-logo-color.png" alt="Electron" title="Electron" align="center" height="20" /></a> app.
185187

186188
Refer to the [microservices README](./examples/microservices/README.md) in the `microservices` folder for more details.
189+
187190
#
188191

189192
# Testing
190193

191194
We've created testing suites for Chronos with React Testing, Jest, and Selenium for unit, integration, and end-to-end tests - instructions on running them can be found in the [testing README](./__tests__/README.md).
195+
192196
#
197+
193198
## Contributing
194199

195-
Development of Chronos is open source on GitHub through the tech accelerator OS Labs, and we are grateful to the community for contributing bug fixes and improvements.
200+
Development of Chronos is open source on GitHub through the tech accelerator OS Labs, and we are grateful to the community for contributing bug fixes and improvements.
196201

197202
Read our [contributing README](../../CONTRIBUTING.md) to learn how you can take part in improving Chronos.
198203

199204
### **Last Iterating Team**
200205

201-
#### Chronos 12.0
202-
- [Tyler Coryell](https://github.com/Tcoryell)
203-
- [Edwin Leong](https://github.com/edwinlny)
204-
- [Eisha Kaushal](https://github.com/eishakaushal)
205-
- [Haoyu Liu](https://github.com/HaoyL666)
206+
#### Chronos 13.0
206207

208+
- [Elsa Holmgren](https://github.com/ekh88)
209+
- [Mckenzie Morris](https://github.com/mckenzie-morris)
210+
- [Kelly Chandler](https://github.com/kchandler44)
211+
- [Sean Simson](https://github.com/seantokuzo)
212+
- [Zhongyan Liang](https://github.com/ZhongyanLiang)
207213

208214
#### Past [Contributors](contributors.md)
209-
#
210-
## Technologies
211-
212-
- <a href="#"><img src="assets/electron-logo-color.png" alt="Electron" title="Electron" align="center" height="30" /></a>
213-
- <a href="#"><img src="assets/react-logo-color.png" alt="React" title="React" align="center" height="30" /></a>
214-
- <a href="#"><img src="assets/js-logo-color.png" alt="JavaScript" title="JavaScript" align="center" height="30" /></a>
215-
- <a href="#"><img src="assets/ts-logo-long-blue.png" alt="TypeScript" title="TypeScript" align="center" height="30" /></a>
216-
- <a href="#"><img src="assets/postgres-logo-color.png" alt="PostgreSQL" title="PostgreSQL" align="center" height="30" /></a>
217-
- <a href="#"><img src="assets/mongo-logo-color.png" alt="MongoDB" title="MongoDB" align="center" height="30" /></a>
218-
- <a href="#"><img src="assets/node-logo-color.png" alt="Node" title="Node" align="center" height="30" /></a>
219-
- <a href="#"><img src="assets/express-logo-color.png" alt="Express" title="Express" align="center" height="30" /></a>
220-
- <a href="#"><img src="assets/http-logo-color.png" alt="HTTP" title="HTTP" align="center" height="30" /></a>
221-
- <a href="#"><img src="assets/grpc-logo-color.png" alt="gRPC" title="gRPC" align="center" height="30" /></a>
222-
- <a href="#"><img src="assets/graphql-logo-color.png" alt="GraphQL" title="GraphQL" align="center" height="30" /></a>
223-
- <a href="#"><img src="assets/docker-logo-color.png" alt="Docker" title="Docker" align="center" height="30" /></a>
224-
- <a href="#"><img src="assets/aws-logo-color.png" alt="AWS" title="AWS" align="center" height="30" /></a>
225-
- <a href="#"><img src="assets/jest-logo-color.png" alt="Jest" title="Jest" align="center" height="30" /></a>
226-
- <a href="#"><img src="assets/webpack-logo-color.png" alt="Webpack" title="Webpack" align="center" height="30" /></a>
227-
- <a href="#"><img src="assets/material-ui-logo-color.png" alt="Material-UI" title="Material-UI" align="center" height="30" /></a>
228-
- <a href="#"><img src="assets/vis-logo-color.png" alt="Vis.js" title="Vis.js" align="center" height="30" /></a>
229-
- <a href="#"><img src="assets/plotly-logo-color.png" alt="Plotly.js" title="Plotly.js" align="center" height="30" /></a>
230-
- <a href="#"><img src="assets/pngwing.com.png" alt="Apache Kafka" title="Apache Kafka" align="center" height="30" /></a>
231-
- <a href="#"><img src="assets/grafana-logo.png" alt="Grafana" title="Grafana" align="center" height="40" /></a>
232-
- <a href="#"><img src="assets/selenium-logo.png" alt="Selenium" title="Selenium" align="center" height="30" /></a>
233-
- <a href="#"><img src="assets/prometheus-logo.png" alt="Prometheus" title="Prometheus" align="center" height="40" /></a>
234-
- <a href="#"><img src="assets/github-action-logo.png" alt="Github Action" title="Github Action" align="center" height="40" /></a>
235-
- <a href="#"><img src="assets/threeJS-logo.png" alt="Github Action" title="Github Action" align="center" height="40" /></a>
236-
- <a href="#"><img src="assets/kubernetes-log.png" alt="Kubernetes" title="Kubernetes" align="center" height="40" /></a>
237215

216+
#
238217

218+
## Technologies
239219

220+
![Electron.js](https://img.shields.io/badge/Electron-191970?style=for-the-badge&logo=Electron&logoColor=white)
221+
![React](https://img.shields.io/badge/react-%2320232a.svg?style=for-the-badge&logo=react&logoColor=%2361DAFB)
222+
![JavaScript](https://img.shields.io/badge/javascript-%23323330.svg?style=for-the-badge&logo=javascript&logoColor=%23F7DF1E)
223+
![TypeScript](https://img.shields.io/badge/typescript-%23007ACC.svg?style=for-the-badge&logo=typescript&logoColor=white)
224+
![Postgres](https://img.shields.io/badge/postgres-%23316192.svg?style=for-the-badge&logo=postgresql&logoColor=white)
225+
![MongoDB](https://img.shields.io/badge/MongoDB-%234ea94b.svg?style=for-the-badge&logo=mongodb&logoColor=white)
226+
![NodeJS](https://img.shields.io/badge/node.js-6DA55F?style=for-the-badge&logo=node.js&logoColor=white)
227+
![Express.js](https://img.shields.io/badge/express.js-%23404d59.svg?style=for-the-badge&logo=express&logoColor=%2361DAFB)
228+
![HTTP](https://img.shields.io/badge/HTTP-394EFF?style=for-the-badge)
229+
![gRPC](https://img.shields.io/badge/gRPC-394EFF?style=for-the-badge)
230+
![GraphQL](https://img.shields.io/badge/-GraphQL-E10098?style=for-the-badge&logo=graphql&logoColor=white)
231+
![Docker](https://img.shields.io/badge/docker-%230db7ed.svg?style=for-the-badge&logo=docker&logoColor=white)
232+
![AWS](https://img.shields.io/badge/AWS-%23FF9900.svg?style=for-the-badge&logo=amazon-aws&logoColor=white)
233+
![Jest](https://img.shields.io/badge/-jest-%23C21325?style=for-the-badge&logo=jest&logoColor=white)
234+
![Webpack](https://img.shields.io/badge/webpack-%238DD6F9.svg?style=for-the-badge&logo=webpack&logoColor=black)
235+
![MUI](https://img.shields.io/badge/MUI-%230081CB.svg?style=for-the-badge&logo=mui&logoColor=white)
236+
![vis.js](https://img.shields.io/badge/vis.js-3578E5?style=for-the-badge)
237+
![Plotly](https://img.shields.io/badge/Plotly-%233F4F75.svg?style=for-the-badge&logo=plotly&logoColor=white)
238+
![Apache Kafka](https://img.shields.io/badge/Apache%20Kafka-000?style=for-the-badge&logo=apachekafka)
239+
![Grafana](https://img.shields.io/badge/grafana-%23F46800.svg?style=for-the-badge&logo=grafana&logoColor=white)
240+
![Selenium](https://img.shields.io/badge/-selenium-%43B02A?style=for-the-badge&logo=selenium&logoColor=white)
241+
![Prometheus](https://img.shields.io/badge/Prometheus-E6522C?style=for-the-badge&logo=Prometheus&logoColor=white)
242+
![GitHub Actions](https://img.shields.io/badge/github%20actions-%232671E5.svg?style=for-the-badge&logo=githubactions&logoColor=white)
243+
![Threejs](https://img.shields.io/badge/threejs-black?style=for-the-badge&logo=three.js&logoColor=white)
244+
![Kubernetes](https://img.shields.io/badge/kubernetes-%23326ce5.svg?style=for-the-badge&logo=kubernetes&logoColor=white)
245+
![TailwindCSS](https://img.shields.io/badge/tailwindcss-%2338B2AC.svg?style=for-the-badge&logo=tailwind-css&logoColor=white)
240246

241247
## License
242248

243249
[MIT](https://github.com/oslabs-beta/Chronos/blob/master/LICENSE.md)
250+
244251
#
245252

246253
###### Return to [Top](#chronos)

assets/codebase_visulization.png

206 KB
Loading

0 commit comments

Comments
 (0)