A Web3 front-end developer builds the user interfaces of dApps, connecting wallets, reading and writing contracts, showing balances and transaction status, and making complex flows simple for users. The role combines React or Next.js skills with ethers.js, viem and wagmi, careful handling of decimals, networks and errors, and onboarding features such as embedded wallets and gasless transactions. Strong TypeScript and testing skills are a big advantage here.
React and Next.js wagmi and viem Wallet integration Event handling UX for transactions
Solved for this roleStart practicing
3 QUESTIONS FREESign up to unlock the full question bank and track your progress.Unlock every question and answer, then continue practising company-wise and package-wise.
IPFS, the InterPlanetary File System, is a peer-to-peer network for storing and sharing files. Instead of locating files by server address, it identifies them by a content identifier (CID) derived from the file's hash, which is content addressing. The same content always has the same CID, and any change gives a new CID, so data cannot be swapped silently. Files must be pinned by a node or pinning service, otherwise they may disappear.
02
After a transaction is confirmed, your front-end still shows old data. How do you fix it?
The UI is probably reading cached results or a lagging RPC node. After tx.wait() resolves, explicitly refetch or invalidate the relevant queries, for example with wagmi or TanStack Query invalidation. Show optimistic updates while pending. If you use an indexer, it may lag by a few blocks, so poll until it reaches the receipt's block number. Use the same RPC endpoint for writes and immediate reads, and avoid long caching for balances.
The EVM is the sandboxed, deterministic runtime that executes smart contract bytecode on every Ethereum node. It is a stack-based machine with 256-bit words, and each opcode has a gas cost, so every computation is metered and infinite loops are impossible. Because every node must get the same result, contracts cannot access the internet or randomness directly. Many chains and rollups are EVM-compatible, so the same Solidity contracts and tools work across them.
04
How do you handle a user on the wrong network in your dApp?
A digital signature is a value produced by signing a message hash with a private key. Anyone with the public key can verify it. It guarantees authentication (the holder of the key signed it), integrity (the message was not changed, since any change breaks verification) and non-repudiation (the signer cannot later deny it). In blockchain, every transaction is signed, so nodes accept a transfer only if the signature matches the sending account.
06
What is a hash collision and why does it matter for blockchains?
A collision is when two different inputs produce the same hash. If attackers could find collisions, they could swap one transaction or block for another with the same hash and break integrity, Merkle proofs and address uniqueness. For SHA-256 and Keccak-256, finding a collision needs about 2^128 work, which is infeasible. This is why older broken hashes such as MD5 and SHA-1 must never be used in blockchain systems.
07
How do you compute a keccak256 hash in Solidity and in ethers.js?
Solidity:
bytes32 h1 = keccak256(abi.encodePacked('hello'));
bytes32 h2 = keccak256(abi.encode(addr, amount));
ethers v6:
import { keccak256, toUtf8Bytes, solidityPackedKeccak256 } from 'ethers';
const h = keccak256(toUtf8Bytes('hello'));
const p = solidityPackedKeccak256(['address','uint256'], [addr, amount]);
Prefer abi.encode over abi.encodePacked when hashing several dynamic values, because packed encoding can cause collisions.
// script/Deploy.s.sol
pragma solidity ^0.8.24;
import {Script, console} from 'forge-std/Script.sol';
import {Counter} from '../src/Counter.sol';
contract Deploy is Script {
function run() external returns (Counter c) {
vm.startBroadcast();
c = new Counter();
vm.stopBroadcast();
console.log('Counter deployed at', address(c));
}
}
# Run it with an encrypted keystore account
forge script script/Deploy.s.sol --rpc-url $RPC_URL \
--account deployer --broadcast --verify
Broadcast output in the broadcast folder records addresses for later scripts.
09
How is a blockchain different from a traditional database?
A traditional database is controlled by one administrator who can create, update and delete rows, and trust comes from that owner. A blockchain is shared by many parties, is append-only, and trust comes from cryptography and consensus. The trade-off is performance: a database handles thousands of writes per second with low latency, while a public chain is slower and costlier. Use a blockchain only when several parties who do not fully trust each other must share one record.
The ABI (Application Binary Interface) is the JSON description of a contract's functions, events and errors, and it defines how arguments are encoded. A function selector is the first four bytes of the Keccak-256 hash of the function signature, for example transfer(address,uint256) gives 0xa9059cbb. Calldata is the selector followed by ABI-encoded arguments in 32-byte words. Wallets, ethers.js and explorers use the ABI to encode calls and decode results and events.
Testnets are public networks that run the same software as mainnet but with valueless ETH, so developers can test deployments and dApps safely. Sepolia is the main testnet for application developers, and Hoodi replaced Holesky for validator and staking testing in 2025. Test ETH comes from faucets, which often require a small mainnet balance or a login to stop abuse. Many Layer 2s run their own Sepolia-based testnets bridged from Ethereum Sepolia.
12
How do you approve and transfer ERC-20 tokens from a script with ethers.js?
The Merge, completed in September 2022, switched Ethereum from Proof of Work to Proof of Stake by joining the original execution chain with the Beacon Chain, which had been running PoS since December 2020. Mining ended, energy use fell by more than 99.9 percent, and new ETH issuance dropped sharply. Block times became a fixed 12 seconds. Staked ETH withdrawals were enabled later in the Shapella upgrade of April 2023.
14
Your target users in India have never used crypto wallets. How do you design onboarding?
Hide crypto complexity. Offer login with phone or email using embedded or smart contract wallets, so no seed phrase is needed at first. Sponsor gas with a paymaster so users need no tokens. Show amounts in rupees and plain language, support regional languages, and explain actions in simple terms. Provide account recovery via passkeys or guardians, and let advanced users export to self-custody later. Ensure KYC and tax requirements are clear where money is involved.
15
How do you call read and write functions of a contract with ethers v6?
cast handles ABI work from the command line.
# Function selector
cast sig 'transfer(address,uint256)'
# 0xa9059cbb
# Encode calldata
cast calldata 'transfer(address,uint256)' 0xAbc... 1000000
# Decode calldata from a transaction
cast 4byte-decode 0xa9059cbb000000...
# Decode with a known signature
cast decode-calldata 'transfer(address,uint256)' 0xa9059cbb...
This is useful when checking what a wallet is really asking you to sign.
17
What is the difference between an externally owned account and a contract account?
An externally owned account (EOA) is controlled by a private key, has a balance and nonce but no code, and is the only type that can start a transaction. A contract account has code and storage, is controlled by its code, and acts only when called. Since the Pectra upgrade's EIP-7702, an EOA can also delegate to contract code, so the line is blurring as smart accounts become common.
Gas measures the computational work an operation needs; for example a simple ETH transfer uses 21,000 gas, and writing a new storage slot costs about 20,000. The gas limit is the maximum gas the sender allows a transaction to consume. The gas price, per unit, is what the sender pays. The fee equals gas used times the effective gas price. If execution exceeds the limit, it reverts but the used gas is still charged.
19
How do you get current fee data and send an EIP-1559 transaction with ethers.js?
Pick one project and explain it with STAR. Situation: in my final year I wanted to learn Solidity end to end. Task: build a crowdfunding dApp. Action: I wrote the contract with goal and deadline logic and refunds, tested it with Foundry including fuzz tests, built a Next.js front-end with wagmi, and deployed to Sepolia. Result: 30 friends tested it, I fixed a refund bug they found, and the repo now has docs and a demo video.
21
What are the basic Foundry commands to create, build, test and work with a project?
curl -L https://foundry.paradigm.xyz | bash && foundryup
forge init my-dapp # new project with src, test, script
forge install OpenZeppelin/openzeppelin-contracts
forge build # compile
forge test -vvv # run tests with traces
forge coverage # coverage report
forge snapshot # gas snapshot
anvil # local node
cast call ADDR 'count()(uint256)' --rpc-url $RPC
Foundry tests are written in Solidity and run fast; Hardhat is the JavaScript or TypeScript alternative with a large plugin ecosystem.
22
Your RPC provider starts rate-limiting and the dApp breaks during peak traffic. What do you do?
Short term, add a fallback transport with multiple providers so requests fail over automatically, and use retries with backoff. Reduce load: batch calls with multicall, cache read results, use WebSockets instead of tight polling, and move history queries to an indexer. Long term, upgrade the plan, spread traffic across providers or run your own node for critical paths, and monitor error rates and latency with alerts so you learn of issues before users do.
23
Tell me about a time you learnt a new technology quickly to meet a deadline.
Situation: in my internship I was asked to add NFT minting to a demo in ten days, and I had never written Solidity. Task: deliver a working, tested contract. Action: I spent two days on Solidity basics and OpenZeppelin docs, built the ERC-721 contract, asked a senior to review my approach early, and wrote Foundry tests for every function. Result: the demo shipped on time on Sepolia, and the review caught only minor issues.
24
How do you verify a deployed contract's source code on a block explorer?
Verification uploads source and compiler settings so the explorer can recompile and match the bytecode, letting users read the code.
# Foundry, using an explorer API key
forge verify-contract 0xDeployedAddr src/Counter.sol:Counter \
--chain sepolia --etherscan-api-key $KEY --watch
# With constructor arguments
--constructor-args $(cast abi-encode 'constructor(address)' 0xOwner)
# Hardhat
npx hardhat verify --network sepolia 0xDeployedAddr 0xOwner
Compiler version, optimiser runs and via-IR settings must match exactly.
25
Users report their USDC balance shows as a tiny fraction in your dApp. What is wrong?
USDC uses 6 decimals, but the front-end probably formats every token with 18 decimals, so 100 USDC (100,000,000 base units) displays as 0.0000000001. Read decimals() from each token contract, or from a trusted token list, and use formatUnits and parseUnits with that value. Use bigint for amounts, never JavaScript floats, to avoid precision errors. Add tests with tokens of 6, 8 and 18 decimals.
26
How do you store an NFT image on IPFS and use it in your contract?
Upload the image to IPFS using a node or a pinning service, which returns a CID. Create a metadata JSON file whose image field is ipfs://<imageCID>, then upload the metadata folder to get a folder CID. Set the contract's base URI to ipfs://<folderCID>/ so tokenURI(5) resolves to the file for token 5. Pin the content with more than one provider, and use a gateway URL only for display in the front-end.
A revert undoes all state changes made during that transaction, including nested calls, as if it never ran. However, the transaction is still included in a block, the nonce is consumed, and the sender pays for the gas used up to the revert. Contracts revert with require, revert or custom errors, which return a reason the wallet can show. Since the Byzantium upgrade, unused gas is refunded on revert, unlike the old invalid opcode which consumed everything.
I see myself as a senior smart contract engineer, owning the design and security of production protocols and mentoring juniors. In the next two years I want to master Solidity, testing and audit techniques, and contribute to open source. Later I would like to specialise in security or Layer 2 infrastructure. I hope to grow inside a team like this one, where the work is real and the standards are high.
29
How did integer overflow bugs happen before Solidity 0.8?
Before 0.8, arithmetic wrapped silently: a uint8 at 255 plus 1 became 0, and 0 minus 1 became the maximum value. Attackers exploited this, for example by making a balance underflow to a huge number or an overflowed multiplication pass a check, as in the 2018 batchOverflow token bug. Developers used the SafeMath library to revert on overflow. Since 0.8 the compiler checks automatically, except inside unchecked blocks and in inline assembly.
EIP-1559 splits the fee into a base fee and a priority fee. The protocol sets the base fee per block from demand: if the previous block was more than half full, it rises up to 12.5 percent, otherwise it falls. The base fee is burned. Users add a priority fee (tip) for the proposer and set maxFeePerGas as their cap. They pay base fee plus tip, never more than the cap, which makes fees more predictable.
31
Explain storage, memory, stack and calldata in the EVM.
Storage is persistent key-value data of 32-byte slots per contract; it is the most expensive, and writes to new slots cost about 20,000 gas. Memory is a temporary byte array cleared after each call, cheap but growing in cost quadratically. The stack holds up to 1024 words for opcode operands. Calldata is the read-only input data of the transaction, the cheapest place to read external function arguments from. Choosing the right location is a key gas optimisation.
32
How does a constant product automated market maker work, and what is impermanent loss?
A constant product AMM holds two tokens with reserves x and y and keeps x times y equal to k. A trader adds one token and removes the other so that k stays constant after fees, which makes price equal to the reserve ratio and rise with trade size. Liquidity providers earn fees, but when prices move, arbitrage rebalances the pool, leaving them worse off than simply holding; that gap is impermanent loss.
33
A user lost their private key and seed phrase. Can you recover their funds?
No. In a self-custody wallet, nobody, including the developer, can recover a lost private key; deriving it from the address is computationally impossible. If they still have the seed phrase, the wallet can be restored on any compatible app. To reduce future risk, suggest a hardware wallet, a written seed phrase stored in two safe locations, or a smart contract wallet with social recovery or passkeys, where trusted guardians can rotate the signing key.
34
A transaction keeps failing with an out of gas error. How do you fix it?
First see whether the gas limit was too low or the function is genuinely unbounded. Run eth_estimateGas or simulate with cast run or Tenderly to see actual gas used and where it fails. If estimation is fine, raise the limit with a buffer of 10 to 20 percent. If the function loops over a growing array, redesign it with pagination or pull-based patterns, because the block gas limit will eventually make it impossible to call.
A dApp usually has smart contracts on a chain holding core logic and assets; a front-end, often React or Next.js, that connects to the user's wallet; a library such as ethers.js, viem or wagmi to read and write contracts through an RPC provider; an indexer or subgraph for fast queries of history; decentralised storage such as IPFS for files and metadata; and optional back-end services for notifications, relaying or off-chain computation, with oracles bringing external data on-chain.
36
Users complain they must pay gas to approve tokens before every trade. How can signatures help?
Use off-chain signed approvals. With EIP-2612 permit, the user signs a typed EIP-712 message granting an allowance, and the dApp submits it with the trade in one transaction, so no separate approve call is needed. For tokens without permit, Permit2-style contracts give the same experience after one approval. EIP-712 shows readable fields in the wallet, reducing phishing risk. Always include a nonce, deadline, chain ID and verifying contract to prevent replays.
Events are declared in Solidity and emitted with emit; the EVM writes them as logs in the transaction receipt. Each log has the contract address, up to three indexed topics plus the event signature hash, and non-indexed data. Logs are much cheaper than storage but contracts cannot read them. Front-ends and indexers subscribe to events to update the UI, track token transfers and build history, so emitting clear events for every state change is good practice.
38
What is the difference between require, revert, assert and custom errors?
require(condition, message) validates inputs and conditions, reverting with a message if false. revert stops execution explicitly and is often used with custom errors, such as error InsufficientBalance(uint256 need, uint256 have); revert InsufficientBalance(x, y); which are cheaper than strings and carry data. assert checks invariants that should never fail; a failure signals a bug and raises a Panic. Since Solidity 0.8.26 you can also pass custom errors to require.
39
How did you handle a time you received critical code review feedback?
Situation: a senior reviewer rejected my pull request for a staking feature, saying the storage layout would break future upgrades. Task: fix it and learn. Action: I thanked him, asked him to explain the risk, read about EIP-1967 and storage gaps, rewrote the contract with namespaced storage, and added a storage-layout check to CI. Result: the PR merged, and that check later caught a teammate's layout change before an upgrade.
40
How should NFT metadata and tokenURI be structured?
tokenURI(id) returns a URI, usually ipfs://<CID>/<id>.json, pointing to JSON that marketplaces read:
{
"name": "Course Certificate #12",
"description": "Completed Blockchain Developer course",
"image": "ipfs://bafy.../12.png",
"attributes": [
{ "trait_type": "Grade", "value": "A" },
{ "trait_type": "Year", "value": 2026 }
]
}
Store images and JSON on IPFS or Arweave rather than a normal server, so metadata cannot silently change or disappear.
Frequently asked questions
What does a Web3 Front-end Developer do?
A Web3 front-end developer builds the user interfaces of dApps, connecting wallets, reading and writing contracts, showing balances and transaction status, and making complex flows simple for users. The role combines React or Next.js skills with ethers.js, viem and wagmi, careful handling of decimals, networks and errors, and onboarding features such as embedded wallets and gasless transactions. Strong TypeScript and testing skills are a big advantage here.
Which skills are tested in a Web3 Front-end Developer interview?
Expect questions on React and Next.js, wagmi and viem, Wallet integration, Event handling, UX for transactions. Most rounds also ask you to explain a project and solve one practical problem live.
How do I prepare for a Web3 Front-end Developer interview?
Revise dApp Development, Ethereum and the EVM first using the topic sheets, practise the questions on this page aloud, then do one full mock interview to practise timing.