What is this?
This is a fun project that I’m working on to ramp up on Web3 development. It’s essentially a website where people can “wave” at me and have these waves recorded on the blockchain (specifically the Rinkeby Eth testnet). This is based on a project from Buildspace.
As this was my first Web3 project, there were a lot of learnings along the way — here’s a rough order of how things got to the way they are:
- Set up Ethereum development environment with Hardhat and then ran a contract to make sure it worked.
- Created a smart contract that will store who has waved at me, and how many times they’ve done so — this information is pulled directly from the blockchain and displayed on the site.
- Afterwards, the contract was deployed to the Rinkeby testnet here.
- Then, I made the frontend in React which uses some libraries to connect to Metamask (s/o
window.ethereum) and call the deployed contract.
- Hosting is done on Replit for ease of development and so that we can spin up a web server on the fly that points to the output, which is done with the lightweight
Replitfor webserver & hosting
Web3.jsfor connecting webapp to blockchain
Alchemyfor deploying the smart contract
Solidityfor smart contract development
Hardhatfor eth dev environment
How it Works
Well, a video would probably explain that pretty well wouldn’t it?
If you want to interact with the live site, you can do the following:
- Set up Metamask (plenty of online tutorials)
- Switch to the Rinkeby testnet
- Get some Rinkeby ETH (not real $) from a faucet
- Wave at me!
I’ve still got a few more things I want to add before I finish up this project:
- Fund a contract to randomly send a waver some Eth
- Explore defensive mechanisms to prevent spam