Binance smart chain in the present time is emerging as an extremely powerful force with BTC, ETH, Polkadot, …
In this article, I will introduce to you what Binance smart chain (BSC) is and how to build apps on it.
General introduction
Before I introduce BSC, I will go through a bit about Binance chain. So what was the Binance chain before it became smart ?
First we will talk about Binance Chain:
Binance chain is proposed and built with the main goal of creating a decentralized asset for Binance (Binnace DEX): https://www.binance.org/en
The original goal was to facilitate transactions so there was a trade-off in being able to build DApps for the primary goal of exchange between tokens. Users can issue tokens on Binance Chain themselves, access transaction information through the BC SDKs, but cannot build Dapps on it.
And to handle the problem of not being able to build Dapps, Binance smart chain was born.
Binance smart chain
The first difference that the binance smart chain brings is that it has an EVM virtual machine, so it can run the same smart contracts above, besides, BSC also changed a bit about the consensus, increasing the number of validators. BSC is a chain running parallel to the Binance chain and does not generate any more native tokens, the native token will still be the BNB that is mine from Binace Chain.
Below will be the comparison parameters between these 2 chains:
Projects on Binance smart chain , because they are latecomers but with strong potential in both community and finance, BSC is like a hungry tiger coming to the party table late, spending heavily financially to reclaim defi market share, and also There have been some outstanding results as tokens are pegged to:
And there are also Dapps similar to the Ethereum side appeared on Binance:
Building applications on BSC
This will be a very simple part for anyone who has ever dev smart contracts on Ethereum will be very familiar with the steps below.
Build a contract
First we will use MathWallet to faucet a bit of binance which supports testing:
Switch network to Binance Smart Chain – testnet and then take a little bit of test at the following website:
https://testnet.binance.org/faiffon-smart
Okei is ready, we will use directly on remix to deploy a test contract:
Try the following Owner.sol deploy contract:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 | pragma solidity <span class="token operator">>=</span> <span class="token number">0.4</span> <span class="token number">.22</span> <span class="token operator"><</span> <span class="token number">0.7</span> <span class="token number">.0</span> <span class="token punctuation">;</span> <span class="token comment">/** * @title Owner * @dev Set & change owner */</span> contract Owner <span class="token punctuation">{</span> address <span class="token keyword">private</span> owner <span class="token punctuation">;</span> <span class="token comment">// event for EVM logging</span> event <span class="token function">OwnerSet</span> <span class="token punctuation">(</span> address indexed oldOwner <span class="token punctuation">,</span> address indexed newOwner <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token comment">// modifier to check if caller is owner</span> modifier <span class="token function">isOwner</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// If the first argument of 'require' evaluates to 'false', execution terminates and all</span> <span class="token comment">// changes to the state and to Ether balances are reverted.</span> <span class="token comment">// This used to consume all gas in old EVM versions, but not anymore.</span> <span class="token comment">// It is often a good idea to use 'require' to check if functions are called correctly.</span> <span class="token comment">// As a second argument, you can also provide an explanation about what went wrong.</span> <span class="token function">require</span> <span class="token punctuation">(</span> msg <span class="token punctuation">.</span> sender <span class="token operator">==</span> owner <span class="token punctuation">,</span> <span class="token string">"Caller is not owner"</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> _ <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token comment">/** * @dev Set contract deployer as owner */</span> <span class="token function">constructor</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token keyword">public</span> <span class="token punctuation">{</span> owner <span class="token operator">=</span> msg <span class="token punctuation">.</span> sender <span class="token punctuation">;</span> <span class="token comment">// 'msg.sender' is sender of current call, contract deployer for a constructor</span> emit <span class="token function">OwnerSet</span> <span class="token punctuation">(</span> <span class="token function">address</span> <span class="token punctuation">(</span> <span class="token number">0</span> <span class="token punctuation">)</span> <span class="token punctuation">,</span> owner <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token comment">/** * @dev Change owner * @param newOwner address of new owner */</span> <span class="token keyword">function</span> <span class="token function">changeOwner</span> <span class="token punctuation">(</span> <span class="token parameter">address newOwner</span> <span class="token punctuation">)</span> <span class="token keyword">public</span> isOwner <span class="token punctuation">{</span> emit <span class="token function">OwnerSet</span> <span class="token punctuation">(</span> owner <span class="token punctuation">,</span> newOwner <span class="token punctuation">)</span> <span class="token punctuation">;</span> owner <span class="token operator">=</span> newOwner <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token comment">/** * @dev Return owner address * @return address of owner */</span> <span class="token keyword">function</span> <span class="token function">getOwner</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> external view <span class="token function">returns</span> <span class="token punctuation">(</span> <span class="token parameter">address</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">return</span> owner <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> |
Connect MathWallet wallet with remix:
Then deploy directly using remix and we have an instance that can be directly interacted:
Interaction with the contract
Interacting with DApps through MathWallet, in this article I will introduce a way to interact with Dapps on BSC, in addition you can also learn how to use with TrustWallet or Metamask by configuring web3
To be able to interact with the contract, we will use the following package:
1 2 | <span class="token function">npm</span> i @binance-chain/bsc-use-wallet |
and simply use the useWallet hook provided by that package to interact with the wallet:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 | <span class="token comment">// App.js</span> <span class="token keyword">import</span> React <span class="token keyword">from</span> <span class="token string">'react'</span> <span class="token keyword">import</span> <span class="token punctuation">{</span> render <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'react-dom'</span> <span class="token keyword">import</span> bsc <span class="token keyword">from</span> <span class="token string">'@binance-chain/bsc-use-wallet'</span> <span class="token keyword">import</span> <span class="token punctuation">{</span> UseWalletProvider <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'use-wallet'</span> <span class="token keyword">function</span> <span class="token function">App</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">const</span> wallet <span class="token operator">=</span> <span class="token function">useWallet</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token keyword">const</span> blockNumber <span class="token operator">=</span> wallet <span class="token punctuation">.</span> <span class="token function">getBlockNumber</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token keyword">return</span> <span class="token punctuation">(</span> <span class="token operator"><</span> <span class="token operator">></span> <span class="token operator"><</span> h1 <span class="token operator">></span> Wallet <span class="token operator"><</span> <span class="token operator">/</span> h1 <span class="token operator">></span> <span class="token punctuation">{</span> wallet <span class="token punctuation">.</span> status <span class="token operator">===</span> <span class="token string">'connected'</span> <span class="token operator">?</span> <span class="token punctuation">(</span> <span class="token operator"><</span> div <span class="token operator">></span> <span class="token operator"><</span> div <span class="token operator">></span> Account <span class="token operator">:</span> <span class="token punctuation">{</span> wallet <span class="token punctuation">.</span> account <span class="token punctuation">}</span> <span class="token operator"><</span> <span class="token operator">/</span> div <span class="token operator">></span> <span class="token operator"><</span> div <span class="token operator">></span> Balance <span class="token operator">:</span> <span class="token punctuation">{</span> wallet <span class="token punctuation">.</span> balance <span class="token punctuation">}</span> <span class="token operator"><</span> <span class="token operator">/</span> div <span class="token operator">></span> <span class="token operator"><</span> button onClick <span class="token operator">=</span> <span class="token punctuation">{</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token operator">=></span> wallet <span class="token punctuation">.</span> <span class="token function">reset</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token operator">></span> disconnect <span class="token operator"><</span> <span class="token operator">/</span> button <span class="token operator">></span> <span class="token operator"><</span> <span class="token operator">/</span> div <span class="token operator">></span> <span class="token punctuation">)</span> <span class="token operator">:</span> <span class="token punctuation">(</span> <span class="token operator"><</span> div <span class="token operator">></span> Connect <span class="token operator">:</span> <span class="token operator"><</span> button onClick <span class="token operator">=</span> <span class="token punctuation">{</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token operator">=></span> wallet <span class="token punctuation">.</span> <span class="token function">connect</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token operator">></span> MetaMask <span class="token operator"><</span> <span class="token operator">/</span> button <span class="token operator">></span> <span class="token operator"><</span> <span class="token operator">/</span> div <span class="token operator">></span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token operator"><</span> <span class="token operator">/</span> <span class="token operator">></span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token comment">// Wrap everything in <UseWalletProvider /></span> <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">(</span> <span class="token punctuation">(</span> <span class="token operator"><</span> UseWalletProvider connectors <span class="token operator">=</span> <span class="token punctuation">{</span> <span class="token punctuation">{</span> bsc <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token operator">></span> <span class="token operator"><</span> App <span class="token operator">/</span> <span class="token operator">></span> <span class="token operator"><</span> <span class="token operator">/</span> UseWalletProvider <span class="token operator">></span> <span class="token punctuation">)</span> <span class="token punctuation">,</span> document <span class="token punctuation">.</span> <span class="token function">getElementById</span> <span class="token punctuation">(</span> <span class="token string">'root'</span> <span class="token punctuation">)</span> <span class="token punctuation">)</span> |
Lastly, thank you for watching my post
Source:
- Binance academy: https://academy.binance.com/en