ethereum-hooks
A package containing useful hooks for working with the Ethereum blockchain using crypto APIs. The following resources will be referenced when building these hooks:
React Hooks Client-Server Setup
When working with this package, you will need to implement the typical MERN design pattern. Set up .env variables and set up the server to allow the client hooks to establish communication.
You will need to set the following environment variables in your .env file:
ALCHEMY_API_KEYBLK_API_KEYCLIENT_PORTCOINGECKO_API_KEYMORALIS_API_KEYOPENSEA_API_KEYPORTTRANSPOSE_API_KEY
The following diagram will help you understand the flow of how everything works:
Link to Published NPM Package
Server Setup
For this part, you will need to incorporate the server object exported from the server.ts file inside the server directory.
You will need to build on top of this built-in server any additional routes and configurations as this server contains all the routes needed to effectively use the client hooks.
React Client Hooks
The hooks cover several areas of the Ethereum blockchain and can be used for Layer Two chains as well. You will need to specify the server port number in order to access it for local development API calls.
A list of what chains are supported is provided below in the Types section.
The following table highlights the 30 different client hooks:
| Category | Client Hook Name | Description |
|---|---|---|
| ENS | useFetchAddressENSLookup(address: string, port: number) |
Fetch the equivalent ENS name from a given address |
| ENS | useFetchENSAddressLookup(ensName: string, port: number) |
Fetch the equivalent ETH address from a given ENS name |
| ENS | useFetchENSIDLookup(id: string, port: number) |
Fetch information of a given ENS ID |
| ENS | useFetchENSNameLookup(ensName: string, port: number) |
Fetch information of a given ENS name |
| ERC20 | useFetchERC20CollectionOwners(contractAddress: string, port: number) |
Fetch list of owners of a particular ERC20 collection |
| ERC20 | useFetchERC20CollectionTopCoins(port: number) |
Fetch list of the top ERC20 collections |
| ERC20 | useFetchERC20CollectionTransfers(contractAddress: string, port: number) |
Fetch transfer activity of a particular ERC20 collection |
| ERC20 | useFetchERC20Holdings(contractAddress: string, port: number) |
Track wallet holdings of a particular ERC20 token activity |
| ERC20 | useFetchERC20Transfers(contractAddress: string, port: number) |
Track the transfer activity of a particular ERC20 token in a wallet |
| ERC721 | useFetchERC721CollectionAttributes(contractAddress: string, port: number) |
Fetch attributes of a particular ERC721 collection |
| ERC721 | useFetchERC721CollectionData(contractAddress: string, port: number) |
Fetch data of a particular ERC721 collection |
| ERC721 | useFetchERC721CollectionExtraData(contractAddress: string, port: number) |
Fetch extra data of a particular ERC721 collection |
| ERC721 | useFetchERC721CollectionFloorPrice(contractAddress: string, port: number) |
Fetch floor price data of a particular ERC721 collection |
| ERC721 | useFetchERC721CollectionMarketCap(contractAddress: string, duration: 2 | 14 | 30, port: number) |
Fetch market cap data of a particular ERC721 collection |
| ERC721 | useFetchERC721CollectionSales(contractAddress: string, port: number) |
Fetch sales data of a particular ERC721 collection |
| ERC721 | useFetchERC721CollectionTransfers(contractAddress: string, port: number) |
Fetch transfer activity of a particular ERC721 collection |
| ERC721 | useFetchERC721CollectionTrends(port: number) |
Fetch trending ERC721 collection data |
| ERC721 | useFetchERC721CollectionVolume(port: number) |
Fetch ERC721 collections by volume data |
| ERC721 | useFetchERC721Holdings(walletAddress: string, port: number) |
Fetch ERC721 holdings of a particular wallet |
| ERC721 | useFetchERC721LookupData(contractAddress: string, tokenID: string, port: number) |
Fetch data of a particular ERC721 token |
| ERC721 | useFetchERC721OpenseaData(contractAddress: string, tokenID: string, port: number) |
Fetch Opensea data of a particular ERC721 token |
| ERC721 | useFetchERC721RarityData(contractAddress: string, tokenID: string, port: number) |
Fetch rarity data of a particular ERC721 token |
| ERC721 | useFetchERC721SalesData(contractAddress: string, tokenID: string, port: number) |
Fetch sales data of a particular ERC721 token |
| ERC721 | useFetchERC721TransferLookupData(contractAddress: string, tokenID: string, port: number) |
Fetch transfer data of a particular ERC721 token |
| ERC721 | useFetchERC721TransfersData(walletAddress: string, port: number) |
Fetch ERC721 transfer activity of a particular wallet |
| Gas | useFetchGasLookup(port: number) |
Fetch gas information related to Ethereum or a supported layer two |
| Prices | useFetchERC20Price(contractAddress: string, currentPrice: boolean, duration: 2 | 14 | 30, port: number) |
Fetch pricing data of a particular ERC20 collection |
| Prices | useFetchERC721Price(contractAddress: string, tokenID: string, port: number) |
Fetch pricing data of a particular ERC721 collection |
| Prices | useFetchETHPrice(currentPrice: boolean, duration: 2 | 14 | 30, port: number) |
Fetch Ethereum price data |
| Prices | useFetchLayerTwoPrice(layerTwo: LayerTwoNetworks, currentPrice: boolean, duration: 2 | 14 | 30, port: number) |
Fetch Layer Two price data |
Custom Hooks
Custom hooks were used for development convenience and were fully incorporated into the main client hooks. The following table depicts the custom hooks:
| Custom Hook | Function |
|---|---|
useFetch |
To fetch data readily using a set of defined parameters |
Types
Custom data types were developed for fetch state and defining a set of available layer two networks
| Custom Data Type | Function |
|---|---|
FetchStateType |
To fetch data readily using a set of defined parameters |
LayerTwoType |
Set of defined Layer Two Networks: optimism, arbitrum, matic-network, zksync, immutable-x, starknet, boba-network, sushi, metis-token, hermez-network-token, celer-network, havven, devve, loopring, biconomy, bancor, aave, perpetual-protocol, cartesi, zora
|