Improving NextJS Ethereum Explorer: Contract UI Improvements
We continued to work on Ethereum Contract Explorer, a comprehensive tool for exploring Ethereum contracts and their associated data. With this project, I aim to provide users with an easy to use interface for exploring Ethereum contracts.
During the last week we focused on building a better UI for a contract page of explorer. In particular, we built a comprehensive modal for functions, current state, events, constructor, views, fallbacks and payables.
What is a modal?
A modal is a graphical user interface element that appears on top of the rest of the content on a screen and requires the user to interact with it before they can proceed with other actions. It typically serves to get the user's attention and prompt them to make a decision or provide information before continuing with a task. Modals can vary in size and content, from simple alerts or confirmation messages to more complex forms for data entry.
New NextJS Explorer Interface
The contract interface was also improved to provide more detailed information about the contract such as the code, current states, events, contract balance and functions.
Additionally, we added 10 latest transactions for the contract and improved the UI to display the correct amount of ethereum and number of tokens in the contract.
.webp&w=3840&q=75)
Further Resources and Related Posts
- NextJs Ethereum Explorer
- Exploring and Refactoring Contraktor - Ethereum Explorer
- Exploring Ethereum Network with Etherscan and BlockScout
- Blockchain Data Indexer with TrueBlocks
- Advanced Realized Volatility and Quarticity
- Machine Learning with Sklearn
- How to illustrate log returns vs simple returns
- A How to EfficientNet Classification