In this box you'll find a basic starter pack. It includes Truffle, React and Webpack. The app was created with create-react-app and it can be customized with customize-cra.
This starter contains two main elements
- Truffle framework
- React App (located at
app/
folder)
Install node or update
Install node -> https://nodejs.org/en/download/
Update node -> npm update
Run the unbox command
truffle unbox rsksmart/rsk-react-webpack-box
For simplicity, there is hook that is going to setup the environment and install all it's dependencies.
This box comes with two environments
- Truffle environment (located at root folder)
- React environment (located at
/app
)
Each environment comes with a specific package.json
, if you want to manage truffle package.json
you simply run npm commands at root folder. For app/package.json
you'll need to install and manage it with yarn
package manager (because it's a create-react-app)
If you don't have yarn
installed you can install it running
npm install -g yarn
First ensure you are at the root folder and have truffle installed.
If you don't have truffle installed you'll need to run this in order to install it.
npm install -g truffle
To install truffle dependencies
# At project root folder (I.E '../resk-react-webpack-box/')
npm install
Now, the only thing you'll need to do it's to create in the root directory a .env file and write your nemonic there
A_MNEMONIC="Write your seed words here"
In your truffle-config.json
file import env variables
// truffle-config.json
const HDWalletProvider = require('@truffle/hdwallet-provider');
// Require dotenv
require('dotenv').config();
//You should never deploy your mnemonic into production or you will lost your crypto!
const mnemonic = process.env.A_MNEMONIC;
//4) Make sure you add togitignore the file .env
//Put your mnemonic here, take care of this and don't deploy your mnemonic into production!
const mnemonic = 'A_MNEMONIC';
You can start a truffle console for any RSK network
# Console for Mainnet
truffle console --network mainnet
# Console forn Testnet
truffle console --network testnet
In order to migrate contracts to a specific network
# Migrate for Mainnet
truffle migrate --network mainnet
# Migrate for Testnet
truffle migrate --network testnet
First install it's dependenices. Remember that you'll need to manage it with yarn
package manager.
# At app folder (I.E '../resk-react-webpack-box/app')
yarn
Then you can run the app/
with
# At app folder (I.E '../resk-react-webpack-box/app')
yarn start
The page will automatically reload if you make changes to the code.
To build the app/
run
# At app folder (I.E '../resk-react-webpack-box/app')
yarn build
Web3 JS and ethereumjs-tx have been bundled for comunicating with RSK network.
This app/ uses customize-cra in order to customize webpack, babel and all default create-react-app
options.
You can customize it at app/config-overrides.js
.
This project is integrated with Prettier for handling code format. You can format the app/
runing
# At app folder (I.E '../resk-react-webpack-box/app')
yarn lint
To define new rules or edit exsting ones, just edit .prettierrc
You can ignore files at .prettierignore