Build your First DAO and deploy it to moonbeam network PART 1 : Setup and play around

The acronym DAO stands for Decentralized Autonomous Organization. In general, a DAO is a system of hard-coded rules that define which actions a decentralized organization will take.

This sentence is my favorite short explanation of DAO, I borrowed it from binance academy, you can check more detail here .

DAO is not the new concept, it introduced to everyone since the first age of Defi, It’s treated as a backbone of many DEFI organization, that allow customers to involve and set the direction with core team by vote system. it’s fully decentralized and transparent.

Let’s Build !!

Talk is cheap, it’s time to take some action. The great way to understand what really DAO is, It’s to build it one, let’s build it !

First, we assumed that you have some knowledge about solidity development, if you’re not familiar with it, please check this link first.

Best resources to learn Solidity · useWeb3.xyz

Learn from the existed contract

The best way to learn how to build some smart contract is just learn from existing and famous smart contract. As you already known, Smart contract is open for everyone to check the code and learn from it. so, on this tutorial, I’ve selected this repo to be our guideline. This project based on scaffold-eth, which is the web3 boilerplate and best resource to start some web3 app. This boilerplate included all development workflow with very well commented on each lines, to help you understand more in detail. For more detail about this boilerplate, please check here.

Design the features

Before we deep diving into the smart contract coding, we have to design the features first. So what is the functionalities that particular DAO needed.

Add and Remove Member

Yeah, this one is very basic functionality that every DAO should have, DAO have to be able to add new member and revoke some member.

create some proposal and revoke

Proposal is also the main functionality here, everyone should be able to send some proposal with the detail, and the proposal’s issuer don’t need to be DAO’s member to propose something.

DAO member can vote proposal

This should also be a main functionality, that DAO member should be able to vote or reject proposal which created by everyone, but only DAO member whose be able to vote to accept or reject the proposal.

Create Proposal to add or kick some member

Member management is also important one. DAO is decentralize by design, so it shouldn’t have someone who have authority over others, every organization decision is made by vote, so it the same for this feature. DAO member should be able to create an issue to add or revoke some member, and let others member vote to execute.

payout and withdrawal

After the proposal has accepted by DAO members, issuer should be able to make withdrawal transaction to specific issuer address. and for transparency, DAO member should be able to check all history of payout in order to manage the organization financial.

Getting start !!

First of all, we have clone repo and check the project’s structure first.

git clone https://github.com/scaffold-eth/scaffold-eth-examples/tree/simple-DAO-proposals simpleDAO

Once it finished, cd simpleDAO , you should see the project structure like this

packages
	- hardhat
	- react-app
	- services
	- subgraph
...others config files

This boilerplate use monorepo to manage all dependencies version. let’s check the package one by one.

hardhat

This package included all smart contract code and also smart contract development config. We use hardhat the web3 development framework to help us prepared development environment for developing the app. Hardhat could provide you blockchain node simulator, solidity compiler and deployment script.

react-app

This is the frontend part, it’s a react app that already have web3 connection functionality, as we won’t focus much on frontend develop on this tutorial. We just focus on web3 connection part on frontend, if you not familiar with react much, don’t worried.

services

All dockers config & script for spinoff some web3 service, graph node, arbitrum etc. we don’t use any service here on this tutorial.

subgraph

All subgraph related config, subgraph could help you to store specific blockchain data for general purpose usage on you app. Anyway, we don’t use any subgraph on this tutorial.

Setup development environment

As we have already talking about, Hardhat could help us setup development environment on the machine so let try it. First, install all reps first.

yarn install

Then, you trying to run blockchain node on your local.

yarn chain

The boilerplate already prepared harhat config and script for you, by run this command, it will start ETH node on your a local machine.

yarn run v1.22.10
$ yarn workspace @scaffold-eth/hardhat chain
$ hardhat node --network hardhat --no-deploy
Started HTTP and WebSocket JSON-RPC server at http://127.0.0.1:8545/

eth_blockNumber (3)

You will notice, that there’re some activity here, it keep printing out some log on the terminal. It’s the mining process that hardhat simulate block mining on blockchain, it will generating the new block around 3–4 sec/block (based on boilerplate setup), when the new block generated it will printout eth_blockNumber (X) (X = block number).

Next step, we will trying to deploy the smart contract, and check how hardhat deployment work. So just run this command first

yarn deploy

This command also be prepared by boilerplate, after you run, you should see the result log like.

$ yarn workspace @scaffold-eth/hardhat deploy
$ hardhat deploy --export-all ../react-app/src/contracts/hardhat_contracts.json
Nothing to compile
deploying "PowDAO" (tx: 0xa3065dc6a9f19da468e99c3ecc58d42ae16299a152bb9eb52929fcadc7340be7)...: deployed at 0x5FbDB2315678afecb367f032d93F642f64180aa3 with 2068758 gas
$ hardhat run scripts/publish.js
✅  Published contracts to the subgraph package.
✨  Done in 3.90s.

It printout result your smart contract’s address and also deployment transaction and gas consumed to help you estimate deployment gas used.

Let deep dive a bit on how the deployment process work

Let’s check on package.json file,

"scripts": {
	...
    "chain": "hardhat node --network hardhat --no-deploy",
    "deploy": "hardhat deploy --export-all ../react-app/src/contracts/hardhat_contracts.json",
	...
 }

Yarn deploy is just an alias of hardhat deploy , this process will deploy smart contract with attribute that define on packages/hardhat/deploy/00_deploy_your_contract.js and export result as and json abi of contract to react-app frontend package, then our frontend can call abi directly with reference from this generated file.

Let’s check more detail on deployment script

// packages/hardhat/deploy/00_deploy_your_contract.js

module.exports = async ({ getNamedAccounts, deployments }) => {
  const { deploy } = deployments;
  const { deployer } = await getNamedAccounts();
  const members = [
    "<member-address>",
    "<member2-address>",
  ]; // browser burner wallet and powvt.eth addresses.
  PowDAO = await deploy("PowDAO", {
    // Learn more about args here: https://www.npmjs.com/package/hardhat-deploy#deploymentsdeploy
    from: deployer,
    args: [members],
    log: true,
  });
};
module.exports.tags = ["<your-contract-name>"];

This function will be called by hardhat deployment mechanism, that send deployments variable on the argument, so we can use deploy function to deploy smart contract with initial parameter which will be parameter of smart contract contractor (will elaborate more detail later). This smart contract initial parameter is array of initial member address, this addresses will be the first member of DAO, whose have authority to invite others into the DAO by voting mechanism.

After your first contract is deployed, we’re ready now for try out something on Frontend, let run frontend

yarn start

waiting a min, It will automatically show react application, then you should see the template UI from boilerplate.

Let’s play around

Let play boilerplate to get more understand on DAO functionality first. before try any feature, please make sure that you’re currently select the same address that you provided on deployment file above, if not you’ll not be available to using any feature here.

You can simply check your member status on DAO by paste your address here, if you’re DAO member it’ll show the result like this.

Let try other functionality, the first feature that your DAO should have is add/remove member, it’s entrance to add other member into your DAO. let try by adding other address, then click “Add” (please make sure, you’re currently logged in with the authorized address one before take action)

As we already talking about previously, every action on DAO need voting mechanism, so after you confirm the transaction, the new vote will be created on the list below.

Then, click on vote “Yes”, then confirm the vote will already submitted. Then we have to wait until the voting period is ended, the voting period is configured as 1 min by default on boilerplate.

After 1 minute, try to execute the proposal here, by type the proposal id, which is ‘0’ then click process, the proposal will check the voting consensus and execute the action. so right now, we have 1 “Yes” vote and 0 “No”, so the consensus is “Yes”. After execution let check member by placing address on the proposal, now the new member has been added. 🎉

Next, we’ll try another main feature, Create proposal for fund, Let’s go !

Add some detail about your proposal on first input, and add the money you need to request. As I already explain previously, anyone could create this proposal. To prove the this functionality, I’ll switch to another address that not DAO’s member first.

Great !!, the proposal is already submitted from non-member address. Let’s approve it, switch back to DAO’s member wallet, then repeat the same step as we do with add member proposal.

Oh !, it show some error when trying to execute the proposal. the boilerplate didn’t show all error yet, so you need to check on your terminal that your EVM is running (terminal window that you run yarn chain).

Error: VM Exception while processing transaction: reverted with reason string 'DAO balance too low to accept the proposal.'

Hmm, What does it mean ??? 🤨
yeah it’s mean your contract don’t have any balance to give anyone 🤣. Let put some money to the DAO first. fortunately, we playing on localhost, so could faucet any balance to any wallet address, we’re a god 🧖

Let find contract address first, click on contact tab above, this page is like dev console UI for debug and execute smart contract directly, then click on copy icon. It’ll copied to your clipboard.

Then click wallet icon on bottom left, we gonna use god power to faucet some money to DAO contract.

Place you address on the first field , and add number of balance you needed. Then “send”., you contract will show balance that you send to.

Next, trying to create the new proposal, then vote “yes” and trying to execute the proposal again. It should successfully this time

Let check balance payout we got from proposal, switch back to wallet address that submitted the proposal and click “check payout” to check. Then click “Get Paid”, Hooray !! 🎉 now you got the money now from DAO.

Now we already tried all main functionality of DAO and that so awesome. unfortunately, this article is too long, so I have to cut it off first.

In the next part, we will take a look deeply on smart contact code for all functionality that we have tried in this article.

see you in the next article, and many thanks for you interesting. 😃