With the recent rise of decentralized applications, or DApps, frameworks created specifically to ease DApp development have become more common.
Like frameworks for frontend developers, DApp frameworks are pieces of code written to build software, which helps make building applications for blockchain easier. While using a framework is not necessary, it does help develop software better and faster.
In this article, we will compare a few popular frameworks that are generally used by blockchain engineers and look at their benefits, disadvantages, and networks, including:
But, before we get into this, let’s discuss the types of DApps are available.
Decentralized applications (DApps) provide a new way to interact with web applications.
You may have heard that “blockchain is the future” or “the future is decentralized;” this mentality permeates through the quick releases of new blockchain-based technologies, meaning developers can access reliable frameworks.
The DApps that are based on blockchain technology run on a peer-to-peer (P2P) network of several computers or servers, rather than a traditional central server. These applications are built on the concept of smart contracts and the consensus process or mechanism.
This means when an application is decentralized, it is first created with underlying blockchain technology pushed to a preferred blockchain network.
Remember that a blockchain network is a collection of several thousands of computers identified as nodes or servers, each owned by a person. Each node, server, and computer then becomes a distributed database, meaning every other server has a copy of the same data.
With all this in mind, a few benefits of building a DApp is that they do not have any downtime because they do not have a central server.
They are also not prone to cyber-attacks and cannot be shut down because there is no central server and all the servers are distributed. If one distributed server is attacked, others become aware.
It is also open source, making it transparent and open to developers.
In summary, a DApp does not bank on a traditional central server or service provider like Google Cloud, Heroku, or Digital Ocean. Rather, its deployment to the blockchain makes it transparent with no central location to store data and no third-party control.
The different types of DApps available are often seen through the different sectors of blockchain technology solutions a DApp is built to solve. For example, the first-ever DApp built was on the Ethereum blockchain.
Similarly, the main reason Bitcoin was built was to remove the financial middleman (that is, the bank) from the process of currency transfers. With Bitcoin, money transfers can be P2P without using a bank.
Like Bitcoin, there are many other sectors where DApps play a deliberate role.
Decentralized finance, or DeFi, is a term given to financial services that use decentralized money like Bitcoin or Ethereum to perform operations.
Traditionally, we have financial services that operate using a central authority, like banks and governments, including financial services such as providing loans, savings plans, and insurance.
However, many saw having a central authority perform these financial operations as risky because of fraud, corruption, and mismanagement. This gave birth to DeFi.
Building a DeFi application requires choosing the platform (this includes Ethereum, Solana, Binance Smart contracts, and many more). DeFi’s main focus is to remove the middleman while offering transparency and decentralization.
DeFi apps are used in decentralized exchange, insurance, and loan services, with apps like Pancackeswap and 1inch.
A decentralized autonomous organization, or DAO, is an organization that operates fully through code/smart contracts. These organizations operate on the rules given to them and then operate solely on those terms.
So, a DAO can run a company without the help of human activity, with the decentralized board creating rules for the DAO to run on, meaning there is no need for repetitive board meetings.
A possible example of a DAO is a driverless taxi company. In this example, we could have a DAO Lyft or DAO Uber that operates entirely on a collection of smart contracts deployed on any blockchain.
This would streamline operations like where to send profits, like how MakerDao operates, when and where to send the taxis, when to refuel the cars, and more.
A merchandise management DApp is most often associated with supply chain processes and systems. The traditional supply chain does not provide insight or transparency to products, meaning we don’t always know what a product is truly made of or where it comes from.
With blockchain in the supply chain, however, product traceability is available; you can trace where products come from because data stored in the blockchain is decentralized. An example of this is GX Blocks.
Let’s now look at the most common frameworks for building DApps.
Hardhat is a framework for building smart contracts that offers a development environment for professionals. This development environment lets users compile, run tests, check smart contracts for mistakes or debugging, and deploy decentralized applications.
To install Hardhat, ensure you have Node.js installed on your computer. Then, initialize a project with npm init -y
and run the following command below:
$ npm install -D hardhat
If installed properly, execute Hardhat with this command:
$ npx hardhat 888 888 888 888 888 888 888 888 888 888 888 888 888 888 888 8888888888 8888b. 888d888 .d88888 88888b. 8888b. 888888 888 888 "88b 888P" d88" 888 888 "88b "88b 888 888 888 .d888888 888 888 888 888 888 .d888888 888 888 888 888 888 888 Y88b 888 888 888 888 888 Y88b. 888 888 "Y888888 888 "Y88888 888 888 "Y888888 "Y888 Welcome to Hardhat v2.0.8 ? What do you want to do? … ❯ Create a sample project Create an empty hardhat.config.js Quit
npx
comes with Node.js when installed and helps execute executables installed on your local environment.
To ensure Hardhat executes in your project, run the command again:
$ npx hardhat Hardhat version 2.0.8 Usage: hardhat [GLOBAL OPTIONS] <TASK> [TASK OPTIONS] GLOBAL OPTIONS: --config A Hardhat config file. --emoji Use emoji in messages. --help Shows this message, or a task's help if its name is provided --max-memory The maximum amount of memory that Hardhat can use. --network The network to connect to. --show-stack-traces Show stack traces. --tsconfig A TypeScript config file. --verbose Enables Hardhat verbose logging --version Shows hardhat's version. AVAILABLE TASKS: accounts Prints the list of accounts check Check whatever you need clean Clears the cache and deletes all artifacts compile Compiles the entire project, building all artifacts console Opens a hardhat console flatten Flattens and prints contracts and their dependencies help Prints this message node Starts a JSON-RPC server on top of Hardhat Network run Runs a user-defined script after compiling the project test Runs mocha tests To get help for a specific task run: npx hardhat help [task] This same command also checks the available tasks Hardhart offers. Hardhat also offers an ecosystem of plugins, meaning there are more libraries you must install when working with Hardhat, including the following:
npm install --save-dev @nomiclabs/hardhat-waffle ethereum-waffle chai @nomiclabs/hardhat-ethers ethers
This includes:
hardhat-waffle
, a plugin to test your smart contractshardhat-ethers
, which allows you interact with your smart contract from the frontendchai
, a Node.js testing libraryRemember that smart contracts cannot deploy to a central server like a traditional application; rather, they must deploy to the Ethereum blockchain network that requires spending ETH currency.
Because the Ethereum network is the server, ensure you test your smart contract before deploying to the Ethereum network, also called the mainnet. To test, we need a local blockchain, which Hardhat offers to us with Hardhat Network.
To begin this network, run the following command:
$ npx hardhat node Started HTTP and WebSocket JSON-RPC server at http://127.0.0.1:8545/ Accounts ======== Account #0: 0xf39fd6e51aad88f6f4ce6ab8827279cfffb92266 (10000 ETH) Private Key: 0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80 Account #1: 0x70997970c51812dc3a010c7d01b50e0d17dc79c8 (10000 ETH) Private Key: 0x59c6995e998f97a5a0044966f0945389dc9e86dae88c7a8412f4603b6b78690d ...
In your project folder, you should see Greeter.sol
in the contracts folder:
//SPDX-License-Identifier: Unlicense pragma solidity ^0.8.0; import "hardhat/console.sol"; contract Greeter { string private greeting; constructor(string memory _greeting) { console.log("Deploying a Greeter with greeting:", _greeting); greeting = _greeting; } function greet() public view returns (string memory) { return greeting; } function setGreeting(string memory _greeting) public { console.log("Changing greeting from '%s' to '%s'", greeting, _greeting); greeting = _greeting; } }
To compile this, run the following:
npx hardhat compile
A few of the most common benefits of using Hardhat as your DApp framework include the following. Remember, these are the most common, you might have a personalized benefit, too:
First, Hardhat is under active maintenance because it is one of the most used frameworks for building decentralized applications.
This can be attributed to its open source format with large community support thanks to over 17k users on GitHub and an active Discord community with 4.6k members at the time of posting this article. It is continuously under development and growing quickly.
And, with its technology based in JavaScript and TypeScript, it’s easy for JavaScript developers to pick up.
One main disadvantage of Hardhat is that it is clearly for professionals and not beginners since its documentation is fairly brief on how to get started. Beginners building DApps might need to try other frameworks like Truffle before looking into Hardhat.
Truffle is another framework for building decentralized applications on the Ethereum blockchain. It is the most popular and one of the pioneer frameworks. It offers the aid of compilation, deployment, and testing.
Most other frameworks followed Truffle’s path, and if you are someone new in DApp development, you will most likely encounter Truffle due to its beginner-friendly setup.
It can also be used for other earned value management-compatible (EVM) blockchains like Binance Smart Chain, Hyperledger, Polygon, and more. It also supports the Solidity and Vyper languages.
And, if you are familiar with Node.js, it is an edge because Truffle is written in JavaScript.
You must have Node.js installed on your PC to begin. Installation is easy, you just run this command in your project:
$ npm install -g truffle
Next, initialize Truffle in your project:
$ truffle init
If successful, this is what you should see below:
Starting init... ================ > Copying project files to /Users/macbookpro/Desktop/Projects/dapp-truffle Init successful, sweet! Try our scaffold commands to get started: $ truffle create contract YourContractName # scaffold a contract $ truffle create test YourTestName # scaffold a testDocumentation
Guides to using Truffle, Ganache and Drizzle including quickstart guides, testing instructions, platform commands, deployment and more.
The project structure is as follows:
$ dapp-truffle ls -1 contracts migrations test truffle-config.js
Truffle offers a development network to run and test DApps without needing to deploy to the mainnet and serves as a local development blockchain for testing.
In the truffle-config.js
file, the network object comes with development and advance network configurations:
networks: { development: { host: "127.0.0.1", port: 8545, network_id: "*", // match any network websockets: true }, live: { host: "178.25.19.88", // Random IP for example purposes (do not use) port: 80, network_id: 1, // Ethereum public network } }
The development configuration is the default network where you run the following command:
$ truffle migrate --network
To compile your smart contracts, use the command below:
truffle compile
Due to its popularity and widespread usage, Truffle has wide support from its users, with over 35k GitHub users at the time of posting.
And, like Hardhat, maintenance is continuous to provide active support, and Truffle supports local blockchain, testnet, and deploys to the mainnet easily.
Debugging in Truffle is not as easy as Hardhat because Truffle requires you to create events and throw them into a log, making you look for that event. Whereas in Hardhat, you have a console.log
prompting messages on the terminal, making you debug faster.
Embark is another framework for the EVM blockchain that is regarded as a full-stack framework. This means the framework offers the solution of building an entire decentralized application’s frontend and backend simultaneously.
Embark watches for changes in your Solidity smart contracts and frontend (HTML and JavaScript) code, and redeploys them to the blockchain network.
Before installing Embark, ensure you have Node.js installed on your computer. Also, Embark requires you to have the following installed as well:
While these are optional, it is still recommended to install them.
Installing Embark is pretty straightforward:
$ npm -g install embark
To begin working with Embark, we must first run the following command:
$ embark demo $ cd embark_demo
This creates a scaffold application with all required folders to work with. With that in sight, you run the application to spin up the Ethereum and IPFS nodes. Remember, Embark watches for changes in your code so it redeploys:
$ embark run
Remember we must still connect to a blockchain network so we can test it through interacting; Embark can work with clients such as Geth or Parity.
In the config/blockchain.js
file, you can configure the blockchain you want. The below code is a sample from Embark’s documentation:
module.exports = { default: { enabled: true, client: "geth" }, development: { clientConfig: { miningMode: 'dev' } }, testnet: { endpoint: "https://external-node.com", accounts: [ { mnemonic: "12 word mnemonic" } ] } }
Embark has slightly more stars from the GitHub community than Hardhat, coming in at about 3.4k stars. It also comes with a UI dashboard that gives a survey of the processes Embark is working on for those interested in deploying to the web rather than a console.
And, as stated previously, it’s a framework that helps build full-stack solutions, which other frameworks mentioned in this article cannot do.
From my observation when trying to run Embark, I ran into some errors while installing. After that, there were warnings on my terminal when I checked the currently installed version.
Also, the project looks stale because there have been no contributions to it for 14 months at the time of writing this article.
Brownie is a framework that builds applications for the EVM but is Python-based, meaning it supports the programming language Vyper, a Python smart contract language. Brownie also supports Solidity.
Unlike other frameworks mentioned in this article, Brownie’s test language is Python using hypothesis.
Overall, Brownie handles deployment, testing, and debugging. Deployment is easy when deploying to the local or testnet blockchain.
Brownie also supports a mainnet fork, which takes a live snapshot of the current blockchain if you want to communicate with certain smart contracts that are not available on the local or testnet blockchain.
Installation can be done via pipx
or pip
, but pipx
is the recommended way by Brownie.
Install pipx
if you don’t have it:
python3 -m pip install --user pipx python3 -m pipx ensurepath
Then, install Brownie:
pipx install eth-brownie
Brownie offers development and live environments that allow testing. These environments can be configured on the terminal using a few commands.
To view existing networks, use the following:
$ brownie networks list Brownie - Python development framework for Ethereum The following networks are declared: Ethereum ├─Mainnet (Infura): mainnet ├─Ropsten (Infura): ropsten ├─Rinkeby (Infura): rinkeby ├─Goerli (Infura): goerli └─Kovan (Infura): kovan Ethereum Classic ├─Mainnet: etc └─Kotti: kotti Development ├─Ganache-CLI: development └─Ganache-CLI (Mainnet Fork): mainnet-fork
To add a new network, add the following command:
$ brownie networks add \[environment\] [id] host=\[host\] [KEY=VALUE, ...]
Brownie has a built-in console for project interaction, which other frameworks do not offer. For example, adding a network through the console lets you run a command to add a network quickly rather than writing it in your codebase.
It is also superior to others since it fully supports Solidity and Vyper, which are two different smart contract languages.
And, with its interactive mode when running tests, if a test fails, it stops and shows in the console, alerting the user.
Because Brownie is a Python-based framework, JavaScript devs will not be able to easily use the framework.
OpenZepplin is a toolkit with plugins that help build smart contracts faster. For example, it has major standard tokens like ERC-20 and ERC-721 implementations and more.
To use any of the smart contracts in OpenZeppelin, you must import them into your own smart contract. Note that OpenZeppelin is actually distributed as an npm package, meaning you must install Node.js first.
To install OpenZeppelin, use the following command:
$ npm install @openzeppelin/cli
To set up an OpenZeppelin project, use the following:
$ npx openzeppelin init
With an example smart contract from OpenZeppelin’s documentation written below, we must compile the following code:
// contracts/Counter.sol pragma solidity ^0.5.0; contract Counter { uint256 public value; function increase() public { value++; } }
To compile, run the following:
$ oz compile
You can use openzeppelin compile
or oz compile
, but oz
is just a short command to pick.
Deploying our smart contract is just as easy as compiling them; OpenZeppelin uses Ganache as a network for development where you can have a local blockchain. You should install Ganache if you do not have it yet:
$ npm install ganache-cli
To start a new process, run the following:
$ npx ganache-cli --deterministic
Then, deploy the smart contracts:
$ npx oz deploy âś“ Compiled contracts with solc 0.5.9 (commit.e560f70d) ? Choose the kind of deployment: upgradeable ? Pick a network: development ? Pick a contract to instantiate: Counter âś“ Added contract Counter âś“ Contract Counter deployed ? Call a function to initialize the instance after creating it?: No âś“ Setting everything up to create contract instances âś“ Instance created at 0xCfEB869F69431e42cdB54A4F4f105C19C080A601
OpenZeppelin has many implemented functionalities, like creating an ERC-20. Because this is already available within OpenZeppelin, you do not need to reinvent the wheel, saving time when developing.
It also has thorough documentation, helping you understand what OpenZeppelin offers. Most of its contract functionalities are upgradeable, meaning you can modify the plugins yourself.
OpenZeppelin provides upgradeable contracts, but the downside is that there’s an admin role to handle implementation, which can impose security risks.
The best way to choose the right framework for a project is to understand what you want to build and what necessary toolkit you need. Perhaps you want something that is Python-based, which definitely points to the Brownie framework as your only option.
Another aspect to consider when choosing a framework is understanding its community and support for that selected framework. What if there is a major bug? Could you and your team fix it? Or is the community strong enough to help fix it?
With the recent rise in the development of DApps, more tools have spun up to help build applications faster. The most common and most used are Hardhat and Truffle, but this is not limited to all developers.
If you have a project in mind, skim through each framework’s documentation to see which suits you best. Note that these frameworks are constantly undergoing maintenance and might need your support as well since they are open source in Web3.
LogRocket is like a DVR for web and mobile apps, recording everything that happens in your web app or site. Instead of guessing why problems happen, you can aggregate and report on key frontend performance metrics, replay user sessions along with application state, log network requests, and automatically surface all errors.
Modernize how you debug web and mobile apps — Start monitoring for free.
Would you be interested in joining LogRocket's developer community?
Join LogRocket’s Content Advisory Board. You’ll help inform the type of content we create and get access to exclusive meetups, social accreditation, and swag.
Sign up nowBuild scalable admin dashboards with Filament and Laravel using Form Builder, Notifications, and Actions for clean, interactive panels.
Break down the parts of a URL and explore APIs for working with them in JavaScript, parsing them, building query strings, checking their validity, etc.
In this guide, explore lazy loading and error loading as two techniques for fetching data in React apps.
Deno is a popular JavaScript runtime, and it recently launched version 2.0 with several new features, bug fixes, and improvements […]