×
🌊 stream ✍🏽 writing 🌎 travel βš’οΈ projects πŸ“¬ email me πŸ“ my resume

Chain of Waves

2 min read β€” #Tinker #Blockchain #Crypto

An exploration of Web3 development β€” stitching together a smart contract to 'wave' at me, stored on the blockchain and connected to a nice React.js front-end.

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:

  1. Set up Ethereum development environment with Hardhat and then ran a contract to make sure it worked.
  2. 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.
  3. Afterwards, the contract was deployed to the Rinkeby testnet here.
  4. Then, I made the frontend in React which uses some libraries to connect to Metamask (s/o window.ethereum) and call the deployed contract.
  5. 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 vite library.

Technology

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:

  1. Set up Metamask (plenty of online tutorials)
  2. Switch to the Rinkeby testnet
  3. Get some Rinkeby ETH (not real $) from a faucet
  4. Wave at me!

TODO

I’ve still got a few more things I want to add before I finish up this project: