Front-End
The user interface of a decentralized application that lets people interact with smart contracts.
Last Updated
2026-03-19
Related Concepts
What is Front-End?
The front-end of a decentralized application (dApp) is the visual interface (website or app) that users interact with. It serves as a bridge, translating complex blockchain data into a user-friendly format like buttons, forms, and dashboards.
How does Front-End work?
- The user visits the dApp website, which is built using standard web technologies (React, Vue, etc.).
- The front-end uses a library (like ethers.js or viem) to connect to the user's cryptocurrency wallet.
- It fetches data from the blockchain via an "RPC provider" to display balances and contract states.
- When a user clicks a button (e.g., "Swap"), the front-end prepares a transaction and sends it to the wallet for approval.
- Once signed, the transaction is broadcast to the network, and the front-end monitors for a confirmation to update the UI.
Why does Front-End matter?
Front-ends are critical for Web3 adoption because they make smart contracts accessible to non-technical users. However, they are also a primary "trust" point.
If a front-end is hacked, it can trick users into signing malicious transactions, even if the underlying smart contract is secure.
Key features of Front-End
- Direct integration with crypto wallets (e.g., MetaMask)
- Real-time display of on-chain data
- Communicates with the blockchain via RPC nodes
- Can be hosted centrally (AWS) or decentrally (IPFS)
- Translates bytecode into human-readable actions
Examples of Front-End
Uniswap.org is a famous front-end that allows you to interact with the Uniswap smart contracts. While the contracts are permanent on the blockchain, the front-end is the website you use to select tokens and click "Swap."