Index
b"# Truffle Box for React using Hooks\r\n\r\nThis Truffle Box is a base for working with the Truffle framework and React. \r\nIt provides a working example of a simple counter contract with corresponding react components.\r\n\r\n## Prerequisites\r\n\r\nIn order to run the Truffle box, you will need [Node.js](https://nodejs.org). Version 10.x.y works best and \r\nI've found it helpful to install nvm (https://github.com/nvm-sh/nvm). In order install these dependencies, you will also need [Python](https://www.python.org) (version 2.7.x) and\r\n[git](https://git-scm.com/downloads). You will also need the [MetaMask](https://metamask.io/) plugin for Chrome.\r\n\r\n## Building\r\n\r\n1. Install truffle and an Ethereum client. If you don't have a test environment, I recommend ganache-cli\r\n ```bash\r\n npm install -g truffle\r\n npm install -g ganache-cli\r\n ```\r\n2. Run your Ethereum client. For Ganache CLI:\r\n ```bash\r\n ganache-cli\r\n ```\r\n Note the mnemonic 12-word phrase printed on startup, you will need it later.\r\n \r\n3. Download the box.\r\n ```bash\r\n truffle unbox BrannanC/react_hooks_box\r\n ```\r\n4. Make sure `truffle-config.js` is configured to use your test environment.\r\n\r\n5. This box is configured to automatically compile and migrate, but you may need to run the command again or\r\n `truffle migrate --reset` if there were any snags in the unboxing process.\r\n```\r\ntruffle compile && truffle migrate\r\n```\r\n\r\n\r\n## Configuration\r\n1. In order to connect with the Ethereum network, you will need to configure MetaMask\r\n2. Log into the `ganache-cli` test accounts in MetaMask, using the 12-word phrase printed earlier. \r\nA detailed explaination of how to do this can be found [here](https://truffleframework.com/docs/truffle/getting-started/truffle-with-metamask)\r\n3. Point MetaMask to `ganache-cli` by connecting to the network `localhost:7545` \r\n\r\n\r\n## Running\r\n\r\n1. Dependencies are automatically installed with Yarn. Run the app using Yarn:\r\n```bash\r\nyarn start\r\n```\r\nThe app is now served on localhost:3000\r\n\r\n2. Making sure you have configured MetaMask, visit http://localhost:3000 in your browser.\r\n\r\n## Testing\r\n\r\n1. Truffle can run tests written in Solidity or JavaScript against your smart contracts.\r\n ```javascript\r\n truffle test\r\n ```\r\n\r\n2. Jest is included for testing React components. Compile your contracts before running Jest, or you may receive some file not found errors.\r\n ```javascript\r\n // ensure you are inside the app directory when running this\r\n yarn run test\r\n ```\r\n\r\n## Production\r\n1. To build the application for production, use the build script. A production build will be in the `app/build` folder.\r\n ```javascript\r\n // ensure you are inside the app directory when running this\r\n yarn run build\r\n ```\r\n## FAQ\r\n\r\n* __Where can I find more documentation?__\r\n\r\n This box is a marriage of [Truffle](http://truffleframework.com/) and a React setup created with [create-react-app](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md). Either one would be a great place to start!\r\n"