Frontend for an On-chain DAO

Interact with the Governor Contract via Frontend

Comment 1

Inspiration

I'm still new in the Blockchain field. I've heard about DAOs before, but I didn't understand how they work. So I decided to explore the topic. The best way of learning that I know is to build something. So I found a tutorial on creating an on-chain DAO with Openzeppelin's governor Contracts.

What it does

It allows users to interact with the Governor Contract. If they hold Governance Tokens, they can create new Proposals, vote, queue, and execute.

After most votes are "For," you can Queue and Execute changes.

After Execution, you can see changes on the Box Contract, governed by the Governor.

How I built it

I followed Patrick Collins' tutorial on how to build an on-chain DAO. The code from there was the base for my further explorations.

The base was built with TypeScript, Hardhat, and Solidity. EthersJS and Hardhat Deploy packages allow contract deployments.

I added the React Frontend written in TypeScript to interact with the deployed contracts. I used the Web3JS library for contract interactions and the wallet connection.

Challenges I ran into

Since I am a beginner, almost every part of the project was a challenge. However, the biggest ones were:

  • How to split Governance Tokens into multiple accounts,
  • How to create a new proposal with a form that I prepared for it,
  • How to hide Voting options for people who already voted or don't own any tokens,
  • How to show Voting results,
  • How to connect a Browser wallet,
  • How to interact with contracts on Rinkeby,
  • How to add Chainlink Keepers to the Project,

Accomplishments that I'm proud of

In the project part, my accomplishments are:

  • I can create a new proposal from the Proposal Form,
  • All functions work as they should. Besides
  • I shared my journey on LinkedIn,
  • This is my first Hackathon ever. I am proud I am submitting

What I learned

I learned how to build a frontend that interacts with Smart Contracts using the Web3JS library. In particular, I learned:

  • How to create a contract's instance,
  • How to read past events and how to subscribe to events,
  • How to make contract calls and transactions,

In the Hardhat part, I learned:

  • How to use a local node,
  • How to deploy contracts

What's next for On-chain DAO with Chainlink Keepers

Things that need improvement:

  • Hiding Proposal Form for users without tokens,
  • Keeping Connected user logged after refresh

Things that need implementation:

  • I didn't figure out how to spread Governance Tokens across multiple wallets. At this point, only the deployer of the contracts can create proposals and vote,
  • update proposals on State Change,
  • Chainlink Keepers to queue and execute contracts :(

Yes, I'm afraid my project isn't eligible for any prize. However, this was my first Hackathon ever. I spent many hours on this project. It was important to me to submit here.

Built With

Share this project:

Updates