๐Ÿ“ˆ How I built my own decentralized exchange (DEX)

๐Ÿ“ˆ How I built my own decentralized exchange (DEX)


3 min read

One of the best ways to learn new things is by practically applying the concepts.

I started studying blockchain concepts and technologies used for blockchain development, but I wanted to enhance my understanding and master new skills.

I decided to build a decentralized application.

๐Ÿš€ What have I learned after finishing the project

I built this decentralized application mainly to learn smart contract development.

But I ended up with a more significant result because even if I was developing just a personal project, I worked on it with the responsibility to learn as many things as possible.

Smart contract development

I understood how Solidity works, how to use existing audited smart contracts and how to protect against several attacks (Authorization through tx.origin, Reentrancy, Assert Violation).

Test-driven development

That was the first time I applied the test-driven methodology. It is hard at the beginning, but it pays off the effort.

After I wrote the test suite, the smart contract development was an easily accomplished task ๐Ÿฐ. I knew exactly what I had to implement in the smart contract.

Liquidity pools

I understood what happens with a pair of tokens inside a liquidity pool when tokens are swapped. More details are available here: Uniswap protocol overview

GitHub Actions

I wanted a way to deploy my application automatically. I discovered that GitHub allows me to host my frontend application free, using GitHub Pages. This is a handy feature from GitHub!

I learnt how to use GitHub Actions and settled the following jobs that are triggered for each commit:

  • Run tests for the smart contract
  • Deploy the React application to GitHub Pages

๐Ÿš€ Description of the project

The application is a decentralized application with similar functionality to a DEX, running on the Ethereum blockchain (Rinkeby testnet), and it provides the following functionalities:

  • Metamask wallet connection
  • users can mint tokens to use on the platform
  • create a pool if it does not exist
  • add/remove liquidity pool
  • swap tokens
  • check token balances

The developed smart contract will keep a 0.01% fee from each swap, and the contract owner can withdraw all the accumulated fees.

๐Ÿš€ What technologies have I used

Smart contract development

I developed the smart contract using Solidity using the hardhat framework:

  • Waffle is a hardhat plugin to test the smart contracts
  • TypeChain is hardhat plugin that generates types. I was excited to find this plugin because I wanted to have the application fully written in typescript.
  • Uniswap Router is a smart contract that provides functions to add/remove liquidity and swap tokens.
  • OpenZeppelin is a collection of trusted and audited smart contracts ready to be used. I used it for the Ownable pattern and to deploy the ERC20 tokens used in the application.

Client application

I built the client application using React, and here I can mention two libraries:

  • ethers.js to interact with the deployed smart contract on the blockchain
  • jotai comes with a super cool way to manage the application state

Short application walkthrough

You will need the Metamask extension installed on your browser to interact with the application.

  1. Click on your address -> manage tokens -> mint tokens3.png
  2. You should own 1000 DT0 and 1000 DT14.png
  3. Swap tokens5.png
  4. Swap completed6.png

๐Ÿ‘‰ Check the application by yourself ๐Ÿ‘ˆ