https://github.com/blockchainsllc/in3-react-truffle-box

Incubed React Truffle Box
https://github.com/blockchainsllc/in3-react-truffle-box

Last synced: 2 months ago
JSON representation

Incubed React Truffle Box

• Host: GitHub
• URL: https://github.com/blockchainsllc/in3-react-truffle-box
• Owner: blockchainsllc
• License: mit
• Created: 2020-01-22T08:29:03.000Z (almost 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-24T01:13:43.000Z (almost 2 years ago)
• Last Synced: 2023-03-02T12:01:06.510Z (almost 2 years ago)
• Language: JavaScript
• Size: 11.7 MB
• Stars: 3
• Watchers: 2
• Forks: 2
• Open Issues: 22
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Incubed React Truffle Box

This box comes with everything you need to start using Incubed Client (IN3) from a react app. This is as barebones as it gets, so nothing stands in your way.

## Installation

First ensure you are in a new and empty directory.

1. Run the `unbox` command via `npx` and skip to step 3. This will install all necessary dependencies. A Create-React-App is generated in the `client` directory.

   ```js

   npx truffle unbox in3-react

   ```

2. Alternatively, you can install Truffle globally and run the `unbox` command.

    ```javascript

    npm install -g truffle

    truffle unbox in3-react

    ```

3. For simplification, this truffle box initially does not have any Smart Contract. Because, in most cases, an IoT device will just read something from the Blockchain.

    So you can skip this step and the one after and go directly to step 5, except if you added later some Smart Contracts to your project.

    

    Run the development console.

    ```javascript

    truffle develop

    ```

4. Compile and migrate the smart contracts. Note inside the development console we don't preface commands with `truffle`.

    ```javascript

    compile

    migrate

    ```

5. In the `client` directory, we run the React app.

    ```javascript

    // in another terminal (i.e. not in the truffle develop prompt)

    cd client

    npm run start

    ```

6. 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.

    ```javascript

    // inside the development console.

    test

    // outside the development console..

    truffle test

    ```

7. Jest is included for testing React components. 

    ```javascript

    // ensure you are inside the client directory when running this

    // If you added some contracts, compile them before running Jest, or you may receive some file not found errors.

    npm run test

    ```

8. To build the application for production, use the build script. A production build will be in the `client/build` folder.

    ```javascript

    // ensure you are inside the client directory when running this

    npm run build

    ```

## FAQ

* __How do I use this with the Ganache-CLI?__

    It's as easy as modifying the config file! [Check out our documentation on adding network configurations](http://truffleframework.com/docs/advanced/configuration#networks). Depending on the port you're using, you'll also need to update line 29 of `client/src/utils/getWeb3.js`.

* __Where is my production build?__

    The production build will be in the `client/build` folder after running `npm run build` in the `client` folder.

* __Where can I find more documentation?__

    This box is a marriage of [Truffle](http://truffleframework.com/), Incubed Client [IN3](https://github.com/slockit/in3) 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!