ERC4337 Application Demo
This repository serves as a living demonstration of the ERC4337 standard for account abstraction in Ethereum. Account abstraction is a paradigm shift in user account management, offering enhanced user experiences by abstracting away the complexities typically associated with Ethereum accounts.
This is the Demo-Repository for the Video Walkthrough:
Account Abstraction Benefits
- Simplified User Experience: Account abstraction enables a more intuitive user experience, removing the friction associated with managing private keys and gas fees.
- Enhanced Security: By decoupling the execution of transactions from the requirement for ETH and private keys, account abstraction allows for more secure and flexible user account protection measures.
- Innovation in UX/UI: Designers and developers are empowered to create novel user interfaces and user experiences, smoothing out the onboarding process for new users and improving the interaction with dApps.
Impact on Blockchain Usability
The implementation of account abstraction can have a substantial impact on the mainstream appeal and usability of blockchain technology. It paves the way for Ethereum to be accessible to a broader audience by aligning user experiences closer to traditional web2 services while preserving the decentralized ethos of blockchain.
Repository Contents
/chatter-app
A fully-featured Next.js application utilizing RainbowKit, showcasing the integration with StackUp, Candide, and Alchemy for account abstraction. This subproject focuses on demonstrating how on-chain wallets, such as those provided by StackUp and Alchemy, can be managed in a simplified chat application context. Additionally, Candide's implementation leverages the Safe wallet as a representation of how account abstraction can function within user-friendly applications. Demo here Repo here
/erc4337-candide
A trim-down Next.js application that presents an updated ERC4337 example utilizing the Candide framework with SafeL2 version 1.4.1. This submodule makes dedicated use of the updated Candide framework. Demo here Repo here
/smart-contracts
The smart contracts that underpin the demo applications are composed in Solidity (version 0.8.20) and utilize the Foundry framework for robust development, testing, and deployment. It contains the Chat-Contract, as well as a simple Paymaster that basically pays for everything. Repo here
Configuration & Setup
Codesandbox
There is a fully featured Codesandbox Devbox setup, in case you want to directly dive in.
Cloning The Repository
First clone the repository including its submodules:
git clone --recurse-submodules https://github.com/tomw1808/erc4337-chatter-application.git
Contracts
Written in Solidity with Foundry. To get them to build, install Foundry.
Then you can build the contracts:
cd chatter-contracts
forge build
Chatter ERC4337 Application
⚠️ Version Updates: There are new versions from Viem and Wagmi, which rainbowkit do not support as of writing these lines. Be careful that the installation might differ in the near future when rainbowkit supports viem and wagmi versions 2.x.
The application written in NextJS:
cd chatter-app
npm install
npm run dev
Have a Browser-Wallet like MetaMask ready then open http://localhost:3000 with your browser to see the result.
ERC4337-Candide Example
As I mention a few times in the video, the candide team was working hard to bring a new version with the new audited safe-wallet out. This happened and I tried to make a demo for that specifically, since a lot of the syntax changed. I still think its worth to go that route, because with safe you just get a nice UI on top of the smart contracts at https://app.safe.global/
To get it to run:
cd erc4337-candide
npm i
npm run dev
Note: If it runs slow with the chat-messages, try adding an Infura-ID to .env. If there is no infura id, it will automatically use a public provider which might be slow.
Open http://localhost:3000 with your browser to see the result.
Learn More
To learn more about ERC4337 Account Abstraction, take a look at the following resources:
- Candide Documentation - The library I used here
- Eth Infinitism Repo - The core team around erc4337 developing the entrypoint
- Abstractionkit Github Repo - The official repo for Candide Abstractionkit
- Stackup/Alchemy/Candide Video Walkthrough - My lengthy end-2-end video walkthrough of the Stackup/Candide/Alchemy Walkthrough
- ERC4337 App using Candide
- Chatter ERC4337 App using Stackup/Alchemy/Candide
- Ethereum-Blockchain-Developer - Learn Solidity and Ethereum Development from me 🤗