Introduction
Decentralized applications (DApps) have gained significant attention for their transparency, security, and accessibility. In this guide, we'll walk you through the process of creating a basic voting DApp on the XDC Network using XDCRPC, React, and Truffle. This application demonstrates the capabilities of XDC RPC and its high-speed interaction with the XDC Blockchain network. By the end of this guide, you'll have a functional DApp that enables users to connect their wallets, vote for candidates, and permanently record votes on the XDC Blockchain.
Prerequisites
Operating System: Windows
Node.js: v18.12.1
Truffle: v5.11.2
Wallet Extension: BlocksPay
XDC RPC, known for its speed and reliability, provides developers with a powerful means of interacting with the XDC Network. As a crucial interface, XDC RPC facilitates essential tasks like querying blockchain data, executing transactions, and deploying smart contracts. This bridge between decentralized applications and the blockchain ensures seamless integration, enabling diverse functionalities ranging from DApp creation to real-time blockchain information retrieval. Detailed RPC setup instructions and chain IDs can be found in this article: Medium Article Link.
When venturing into contract deployment or transactions on the XDC network, possessing a certain amount of XDC in your account is vital. Acquiring these funds has been streamlined through the BlocksScan faucet. By engaging in simple tasks like tweeting about the faucet, users can obtain a substantial testnet allocation of up to 10 million XDC. This resourceful platform allows swift access to funds upon submitting the corresponding link, offering a default allocation of '1000' XDC (with no tweet required), accessible through both the 'xdc' and '0x' prefixes. Funds can be accessed on both Devnet and Apothem networks. Access the faucet here: BlocksScan Faucet.
Getting Started
Step 1: Set Up Project and Install Truffle
Create a directory named "voting-app."
Install Truffle globally with the following command:
Npm install -g truffle
Check if you have successfully installed truffle
“truffle-v”
Step2: Setup truffle
Run “truffle init”
This command will create three folder
( contracts(in which you will save your contract file),
migrate(you will write deploy script in it),
truffle.config.js (to store configuration like Chain id, RPC URL).
test(where you can write code for testing))
Step 3: install Dotenv
Dotenv loads environment variables into applications, enhancing security and simplifying configuration management.
Npm install dotenv –save
Create .env file in your root directory and store your private key in it
Private_key=” “
Api_url:=” “
Step 4: Write your code in contracts/Voting.sol
Step 5: run "truffle compile".
This will generate a build folder from where you will get the abi code .
Step 6: Define configuration for your network in truffle-config.js (like API URL, Chain id, Solidity version).
Step 7: Write deploy script /migrate/1_deploy_contract.js(change the array values if you want).
Step 8: Run "truffle migrate --network apothem" to deploy your contract.
Step 9: Make a UI that will interact with your code.
Running the Application
- Connect Wallet: Click on the "Login BlocksPay" button on the UI.
Your BlocksPay account address will be displayed.
- Vote for Candidates: Enter the voting symbol of your preferred candidate and click on the "Vote" button.
For example, you might type "1" to vote for the first candidate.
Conclusion
Congratulations! You have successfully created a basic voting decentralized application on the XDC Network using XDC RPC, React, and Truffle. This guide has demonstrated how to set up the development environment, write a smart contract, deploy it using Truffle, and create a user interface for interacting with the contract. This project showcases the capabilities of XDC RPC in enabling seamless integration between DApps and the blockchain. Feel free to further enhance the application's features and functionalities to explore the full potential of decentralized applications on the XDC Network.
Additional Resources:
- YouTube Tutorial: https://youtu.be/q_bD0DtVghs?si=MxgepZ94KvlKt08I
- GitHub Repository: https://github.com/Mitali-88/Voting-dapp-on-xdcNetwork
Discussion (0)