Deploy a DApp

Overview
Let's use 5-10 minutes to deploy a complete game through ThunderCore that is easily accessible to your own friends and family -- accessible to anyone with internet access. We will release a simple coin toss game where players will receive twice as many bets if the coin is facing up. In the case of coins facing down, players will lose their bets, but still have a chance to double the bet.
Exploring the Game
To begin, we will obtain a wallet and gain access to the Thunder network. With either Metamask or TrustWallet pointed to the Thunder RPC, navigate HERE to play the game we will build in this tutorial!
To make your own version of the page, just check out the repo and follow the instructions in the readme.
At the end of those instructions, you should be able to access the game with either your mobile device through Metamask or any ThunderCore compatible mobile DApp browsers.
Deploying Your Own Contract
Now, let's get your game running on your own copy of the contract, so you can get started developing your own killer DApp!
First we will install all the dependencies.
1
node -v
2
# Let's make sure our node is v8 or v10
Copied!
If you haven't downloaded node.js, go to node.js download the version 8 or version 10. If you have downloaded it before but your version is incompatible, install it with nvm, and follow the instructions below.
1
nvm install [v8 or v10]
2
nvm use [v8 or v10]
3
​
4
node -v  #Make double check our node is v8 or v10 (recommend node version:10.24.1)
Copied!
​references---how to change to an old version of node.js​
1
cd ./smart-contracts
2
yarn install
3
​
4
# or
5
npm install
Copied!
Next grab your mnemonic or import your private key from metamask and create a file called .private-keys under “./smart-contracts ” or Trust Wallet and add it to the HDWallet in truffle-config.js
1
testnet
2
yarn migrate --network thunder-testnet --reset
3
# or
4
npm run migrate -- --network thunder-testnet --reset
Copied!
1
mainnet
2
yarn migrate --network thunder-mainnet --reset
3
# or
4
npm run migrate -- --network thunder-mainnet --reset
Copied!
In the console, you will see the price you've paid for its deployment, the contract address, and additional stats. Well done! Your contract is now up and running ready to be used by anyone. If the contract address of DoubleOrNothing didn’t show up in the console after the migration ,you can check the contract address by typing the command below.
1
mainnet
2
$ Truffle console --network thunder-mainnet
3
testnet
4
$ Truffle console --network thunder-mainnet
5
​
6
let contract = await DoubleOrNothing.deployed()
7
DoubleOrNothing.address
Copied!
To make sure you've deployed doubleOrNothing smart contract successfully,you can double check the contract address and contract block number you've deployed lately.
Testnet
1
truffle(thunder-testnet)>let contract = await DoubleOrNothing.deployed()
2
truffle(thunder-testnet)> DoubleOrNothing.address
3
'0x48caD7fe30Fd1CA52EcBda9C82E398B0FFd321eE'
4
truffle(thunder-testnet)> n = web3.eth.getBlockNumber();
5
62591612
Copied!
Mainnet
1
truffle(thunder-mainnet)>let contract = await DoubleOrNothing.deployed()
2
truffle(thunder-mainnet)> DoubleOrNothing.address
3
'0x8693A164EBC4429fCFF4461B481FCD4E60690fD3'
4
truffle(thunder-mainnet)> n = web3.eth.getBlockNumber();
5
83540251
Copied!
We must now update our UI to use this contract address.
1
cd ./frontend
Copied!
1
yarn install
2
# or
3
npm install
Copied!
Find the .env file and change the REACT_APP_CONTRACT_ADDRESS to your new address which you got by the command DoubleOrNothing.address above.
Meanwhile, you can start by deploying on testnet , change 'REACT_APP_TT_USDT_CONTRACT(testnet)' to 0xB1Fb0b14Ffea209ABa1e62ff3F2F3DFD2eaa9FE0, and comment out another REACT_APP_TT_USDT_CONTRACT address. If you’re not sure of the REACT_APP_TT_USDT_CONTRACT testnet or mainet address, check out on thundercore bridge.
Below are the specific steps we mentioned above.
First of all, click on the option above.Next, click the info symbol below.
You can see the TT-USDT ADDRESS ,which is REACT_APP_TT_USDT_CONTRACT=0xB1Fb0b14Ffea209ABa1e62ff3F2F3DFD2eaa9FE0
1
yarn start
2
# or
3
npm run start
Copied!
This will start a local server with your changes. If you want to deploy this to your webpage run:
1
yarn build
2
# or
3
npm run build
Copied!
1
git add -u
2
​
3
*Remember to not check in your mnemonic!!!!
Copied!
1
git commit -m 'add my own contract address'
Copied!
1
git push
Copied!
Voila! In 5-10 seconds, your webpage will be running on your contract.Congratulations!
Debugging
Add a Console to display an Error Message in the DApp's UI when running in the ThunderCore Hub Wallet’s Browser Tab to display any error messages for problems/errors encountered while interacting with the chain.
Example 1: TT20 Transactions​
Example 2: DoubleOrNothing​
Deploy TT20
Develop on ThunderCore Hub
Last modified 1mo ago
Copy link
Contents
Overview