Domain Steem with JavaScript: Lesson #6 - Account Authorities

Assalamualaikum my fellows I hope you will be fine by the grace of Allah. Today I am going to participate in the steemit learning challenge season 22 week 6 by @alejos7ven under the umbrella of steemit team. It is about Account Authorities. Let us start exploring this week's teaching course.

Made with Canva

Present your final project to the entire community, it must fulfill at least one of the main functions that you proposed in your previous task.

In my previous task I gave the idea of the Real Time Monitoring Application for the steem blockchain as of my final project. So today I will present my final project here with the steem community and I hope the community will appreciate the project.

My project will be of three major parts. These three major parts are given below:

• HTML for the structure of the website
• CSS for the styling
• The Javascript for accessing the Steem API and to implement functionality

Structure of the Website

By using HTML I developed the structure of the website. This is a simple one page website which will track the real time data of the blockchain. It will monitor all the transactions in the blockchain. It also informs about the large transactions. So this is the structure of the website. It has a simple header, body and footer.

I accessed all the elements from the HTML file in the CSS and I wrote css code to make it look more beautiful and attractive. After applying css the website has become eye catching and very attractive. There are 3 main containers which display the data of the blockchain. One is the container which shows all the transactions of the blockchain, the other section shows the graph for the number of the transactions with respect to time. There is another section at the end which shows the accounts which are trending on the basis of the number of activities in the blockchain.

After applying html and css it was the turn to write the script for the website to make it interactive and working. I developed different functions using Steem API such as tracking the and monitoring the blockchain activities. A synchronized the graph with the blockchain activities. I implemeted a function to show a notification when the large amount of transaction happen on the blockchain. I set a threshold to be counted as a large transaction to 1000 steems. At the end then I implemented the function to display the trending accounts based on the activities.

The graph updates itself after each block completion. Each block is completed after 3 seconds and it updates itself according to the number of transactions recorded within the block.

The website is notifying for each large transaction which is happening beyond the threshold.

This is a simple blockchain monitoring application which does not require any authentication and do not make use of the keys it just uses the Steem API and returns the monitoring of the blockchain activities, high value transactions, and the trending accounts based on the activities associated with the accounts.

All the code is availabel in this Github Repository and anyone can access and use this code. It is very simple to use just download the code and add the HTML, CSS and JS file in your system and the application will start working. If you want to add or remove any functionality in the steem monitoring application then you can do it and make it more appealing as per your own requirements.

This is working very swiftly and smoothly and logging all the activities of the steem blockchain. For the major functionality of monitoring the blockchain I have used streamOperations and it is the reason it is fetching all the real-time data of the blockchain and displaying it in this blockchain activity monitoring application.

---

---

I invite @wilmer1988, @josepha, @wuddi to join this learning challenge.

---

---