This boilerplate uses Webpack and React, along with react-router, redux and redux-auth-wrapper for authentication powered by a smart contract.
-
Install Truffle globally.
npm install -g truffle
-
Download or clone this repo box.
-
Install dependencies
npm install
-
Run the webpack server for front-end hot reloading (outside the development console). Smart contract changes must be manually recompiled and migrated.
// Serves the front-end on http://localhost:3000 npm start
Note: To connect the frontend app to your local RPC server or Ethereum network, use the Metamask browser extension or the Mist wallet/browser.
Download Metamask for Chrome, Firefox or Brave.
Use Ganache (formerly testrpc, included with Truffle) which simulates the Ethereum blockchain in a way that faciitates easy, fast smart contract development
-
Download the Ganache app, or use the command line tool:
npm install -g ganache-cli
-
Compile and deploy the smart contracts to your local Ganache server
truffle deploy --network development
-
Truffle can run tests written in Solidity or JavaScript against your smart contracts. Note the command varies slightly if you're in or outside of the development console.
// If inside the development console. test
// If outside the development console.. truffle test
-
Jest is included for testing React components. Compile your contracts before running Jest, or you may receive some file not found errors.
// Run Jest outside of the development console for front-end component tests. npm run test
-
To build the application for production, use the build command. A production build will be in the build_webpack folder.
npm run build
-
Install geth
-
Using the genesis.json, start new blockchain, connect to peers
-
Run the development console.
truffle develop
-
Compile and migrate the smart contracts. Note inside the development console we don't preface commands with
truffle
.compile migrate
If you have trouble connecting truffle to ganache, or the frontend/Metamask to ganache, make sure your ganache host/port and Metamask host/port are the same
-
I'm unable to migrate contracts on my local ganache server* You have to unlock the account you use to upload smart contracts. Pick an address out of the list of accounts Ganache started with. Then add the account to your truffle.js file:
from: "0x627306090abaB3A6e1400e9345bC60c78a8BEf57"
-
Why is there both a truffle.js file and a truffle-config.js file?
truffle-config.js
is a copy oftruffle.js
for compatibility with Windows development environments. Feel free to it if it's irrelevant to your platform. -
Where is my production build?
The production build will be in the build_webpack folder. This is because Truffle outputs contract compilations to the build folder.
-
Where can I find more documentation?
This box is a marriage of Truffle and a React setup created with create-react-app. Either one would be a great place to start!