Skip to main content
HashnodeUntitled Publication

Command Palette

Search for a command to run...

Building & Deploying a Web3 Crowdfunding dApp using Solidity, Foundry & wagmi v2

Published
•2 min read
H
Harsh Kumar Rai

I am a software engineer with a strong background in competitive programming and backend focused development.

I graduated in IT from Army Institute of Technology, Pune (2025) and currently work at NxtWave, where I build and review technical content around data structures, algorithms, and problem solving.

My recent work is focused on smart contract and protocol development using Solidity and Foundry. I enjoy building systems where correctness, security, and clear invariants matter such as token vesting, staking mechanisms, and upgradeable protocols.

Earlier, I spent several years in competitive programming (Codeforces Expert, 5★ CodeChef), which shaped how I approach problem solving, edge cases, and testing.

On this blog, I write about the design and implementation of smart contracts, testing strategies, and engineering tradeoffs I encounter while building Web3 protocols.

Introduction

In this article, I’ll walk through how I built and deployed a Web3 Crowdfunding dApp, covering both smart contracts and frontend integration using modern Ethereum tooling.

Tech Stack

  • Solidity – Smart contracts

  • Foundry – Testing & deployment

  • React + Vite – Frontend

  • wagmi v2 + viem – Wallet & contract interactions

  • Vercel – Frontend hosting

  • Sepolia Testnet – Deployment network

Smart Contract Overview

The crowdfunding contract allows users to:

  • Create campaigns

  • Contribute ETH

  • Withdraw funds (creator)

  • Claim refunds (if conditions fail)

Deployed on Sepolia:

0x53da9C3444085D4b3c50Fc38A0a96Cf18413C2D5

Frontend Integration (wagmi v2)

Key points while working with wagmi v2:

  • useAccount() does NOT auto-connect

  • Explicit connect() call is required

  • isConnected should be used instead of checking address

  • WagmiProvider + QueryClientProvider are mandatory

Deployment on Vercel

Since the frontend lived inside a subdirectory, deployment required:

  • Correct Root Directory

  • Build command: npm run build

  • Output directory: dist

  • Environment variables for contract addres

looks like this on deploy

Challenges & Learnings

  • Fixing Git submodule issues properly

  • Handling wagmi v2 breaking changes

  • Deploying nested projects from GitHub

  • Debugging wallet connection issues in production

Live Demo

🔗 Frontend: <https://crowdfunding-pink-nine.vercel.app/\>
📂 Source Code:https://github.com/harshkumarrai/ethereum-solidity-projects-/tree/master/Projects/crowdfunding%20project

Conclusion

This project helped me understand how real Web3 dApps are structured end-to-end.
Next steps: improving UI, adding better error handling, and writing more tests.

Comments

Join the discussion

No comments yet. Be the first to comment.

More from this blog

Untitled Publication

17 posts