The problem AbstraX solves

AbstraX is a novel platform designed to simplify the creation, storage, and management of abstract account extensions, including stealth accounts (EIP-5564), on the Ethereum network. Our platform fosters an innovative, social, and collaborative environment for users, developers, and enthusiasts alike to share, build, and evolve Ethereum's account abstraction capabilities.

The platform bridges the technical gap, allowing both experienced developers and those new to the blockchain space to easily create and interact with abstract accounts. By democratizing access to the stealth accounts functionality, EtherExtensions enhances privacy, security, and user control in Ethereum transactions.

Moreover, AbstraX solves the pain point of managing and interacting with these abstract accounts by providing a user-friendly interface and social platform where users can store, manage, and even share their extensions with the community.

In essence, EtherExtensions is creating a new layer of interaction and social engagement on top of Ethereum's complex yet powerful infrastructure, making existing tasks more straightforward, efficient, and approachable. The result is a safer, more decentralized, and community-oriented blockchain ecosystem.

Challenges we ran into

During the development, we faced a number of challenges that tested our problem-solving skills and our understanding of decentralized application (dApp) development. Here are some of the key hurdles and how we overcame them:

Managing State: Our application needed to maintain the state of the user's selected contract and input parameters across multiple components. We decided to use the React useState and useContext hooks to manage the state across the application. This allowed us to keep the state of the selected contract and parameters synchronized across different components.

Mocking Blockchain Interactions: Our initial goal was to allow users to deploy their chosen contract on the Ethereum blockchain. However, we encountered complexities related to integrating Web3.js within our application and dealing with real-time interactions with the Ethereum blockchain. To keep our focus on the UI/UX part of the dApp, we decided to simulate these interactions by logging user actions to the console. This allowed us to build a mock setup that can be replaced with real blockchain interactions at a later stage.

Next.js Server-Side Rendering (SSR): We initially faced an issue related to the localStorage object being undefined. This was due to the server-side rendering (SSR) feature of Next.js, which runs the code on the server where the localStorage object does not exist. We solved this issue by using the useEffect hook, which runs the code only on the client side after the component is rendered.

Handling Solidity Code: We wanted to allow users to view and select from a list of Solidity smart contracts. This was challenging due to the need to display multi-line strings (the contract code) in a user-friendly manner. We handled this by storing the contract code as a string within our state and using the <pre> and <code> HTML tags to format the displayed code.

These challenges provided valuable learning experiences and helped us improve our skills in dApp development.