Skip to content

React Web3 Redux Todo Truffle Box

This box comes with everything you need to start using smart contracts from a react app. This is as barebones as it gets, so nothing stands in your way.

Installation

  1. Install Truffle and an Ethereum client. For local development, try EthereumJS TestRPC.

    npm install -g truffle // Version 3.0.5+ required.
    npm install -g ethereumjs-testrpc
    

  2. Unbox in the project directory. This will also install the dependencies.

    truffle unbox shanejonas/react-box-web3-todo.git
    

  3. Compile and migrate the contracts.

    truffle compile
    truffle migrate
    

  4. Run the webpack server for front-end hot reloading. For now, smart contract changes must be manually recompiled and migrated.

    npm run start
    

  5. Jest is included for testing React components and Truffle's own suite is included for smart contracts. Be sure you've compile your contracts before running jest, or you'll receive some file not found errors.

    // Runs Jest for component tests.
    npm run test
    
    // Runs Truffle's test suite for smart contract tests.
    truffle test
    

  6. To build the application for production, use the build command. A production build will be in the build_webpack folder.

    npm run build
    

FAQ

  • Why is there both a truffle.js file and a truffle-config.js file?

    Truffle requires the truffle.js file be named truffle-config on Windows machines. Feel free to delete the file that doesn't correspond 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 Truffle Box is a marriage of Truffle and a React setup created with create-react-app. Either one would be a great place to start!