How I made a Web3 app to reward my community with tokens
Romain @devvnomad
Posted on February 15, 2022
When I started my web3 journey I got a freelance contract: Add web3 features to an existing app and reward the users with our token.
The point of rewarding the community was:
- To motivate the community to do something to earn a token.
- The brand wanted to have its own token to improve branding.
- Rewarding the user with tokens is becoming more and more common these days.
Our users should get 5 tokens when completing their profile (bio, curriculum, social media links, etc.).
But we could imagine rewarding users for many other kinds of actions, such as: commenting on a post or sharing a post on social media.
Create a token ⚒️
The first major task was to create a token.
After some research and discussions with other DEV, I decided to use an ERC-20 token.
I made one million token supplies and decided to lock half of it using a time lock contract.
Locking tokens is for purpose to give trust to your tokens to your users.
Get the wallet public ID of the user 🆔
Then, I had to connect my front-end to Metamask API (or to wallet connect)
The goal is to get the wallet public ID of my users.
With this wallet public ID I will be able to transfer to theses users my reward’s tokens.
I also needed to add our token to their Metamask wallet. Which was something I could handle with the Metamask API.
I then simply saved the wallet public ID on the user table. I will use this public ID later.
Reward the users when they complete their profile 👏
When a user completes his profile on the app we need to send him 5 tokens.
Firstly I made a « reward » table on the back-end. I want to know whether that specific type of reward was already given to this user.
Then on my back-end, I needed to make an endpoint that would trigger a function to make a token transaction.
To make a transaction I used etherJs on my NodeJs app. When the conditions are met, I make a new transaction from my wallet ID to the user walletID.
I also pay the gas fee using my wallet automatically. My server can access my wallet using my wallet’s private key.
When a transaction is successful, the user will get a notification and the token will appear in his wallet.
Deploy our token to the Polygon network 🕸
Using Ethereum network is expensive when it comes to pay gas fee. That’s one of the reasons we decided to go for Polygon Matic.
Polygon is also a part of the blockchain network. However, the cost to operate is well cheaper than on Ethereum.
On localhost I was using a Testnet network. A fake network, that I set up with HardhatJs.
I now needed to push my ERC-20 token to Polygon network.
I used again HardhatJs in order to deal with this.
Security concerns 🔒
When it comes to Web3 and Blockchain, I had to make sure that my setup was safe 😀
By safe I mean:
- I don’t want bots to be able to make thousands of transactions.
- I don’t want people to use my wallet ;)
This is what I did for this app:
- I stored the wallet private key on the environment global variables of my server.
- That wallet contains only a few Ethers. Enough to pay a few months of gas fee
- That wallet contains only 1% of the tokens we created.
- A user cannot get multiple reward tokens for the same type of reward. For example, the type of reward was « set-up-profile-reward ».
- Only logged users will get a reward.
- We verify that the user is the right one by signing the bearer token. We stored the signature of that bearer token on the server.
This is how that process looks:
What’s Next?
I’m planning in the future, to release Saas App using Web3 and to accept more freelance contract using that technology.
👉 You can follow me there on Twitter, as I continue to document my journey.
Posted on February 15, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.