https://github.com/mikiw/reactweb3
Ethereum transaction crawler in ReactJs.
https://github.com/mikiw/reactweb3
blockchain crawler ethereum
Last synced: about 1 month ago
JSON representation
Ethereum transaction crawler in ReactJs.
- Host: GitHub
- URL: https://github.com/mikiw/reactweb3
- Owner: mikiw
- Created: 2022-07-04T17:35:55.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2022-07-09T21:03:35.000Z (almost 4 years ago)
- Last Synced: 2025-02-28T03:28:23.086Z (over 1 year ago)
- Topics: blockchain, crawler, ethereum
- Language: JavaScript
- Homepage:
- Size: 6.22 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Ethereum Transactions Crawler
I used [etherscan](https://etherscan.io/) which is a blockchain explorer to avoid indexing by each block.
It would be a struggle to implement it in React App only with an Ethereum node connection.
Pagination from etherscan is not implemented in this version so there is a 10000 limit per transaction data.
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
To run the project we can simply run these 2 commands in the project directory:
```
npm install
npm start
```
All available scripts commands:
`npm start`
`npm test`
`npm run build`
Later open [http://localhost:3000](http://localhost:3000) to view it in your browser.
If an application was built successfully we should see a page like this:

## Getting Started
Application will query etherscan for transactions between `Start block` and `End block`,
later balances for eth and tokens will be calculated based on that data.
So we can calculate the balances in specific block ranges.
When page will load the first API call will get last block number from etherscan so `0` should change to something near `15101234`.
If we want to calculate balance from the beginning we can just simply input `0` as `Start block`.
Button `Update blocks by date` will convert data from `YYYY-MM-DD` format from `End block date` input to timestamp,
later block height will be updated based on corresponding timestamp.
Button `Get balances and transactions` will get transaction data for given constraints like `Ethereum Address`, `Start block` and `End block`.
Based on that data balances of Eth and tokens will be calculated. For balances calculation I used `BN` from `web3-utils`.
## Example usage
Now we can use our app to check `0x5c18d2b7026bcaf3b5017f7056d70069d7a5865f` address balance
which is `0.009395840722894319` Ether (same as etherscan):

Etherscan balance:

If we will set a date to `2022-04-30` and we will click `Update blocks by date` button and later
`Get balances and transactions` button we will have fewer transactions (6 instead of 26)
also the Ether balance and USDC token balance will be different:


## TODO
TODO for future:
- Add paging in while loop for etherscan API call to exceed 10000 row limit.
- Add other Token standards (Erc721 for uniswap v3 and others).
- Improve error handling and add some messages in UI.
- Improve token display to support token migration (0x9f4a83475ef57f70c1a7754c3b381479626900ea nice wallet to tests).