Code Monkey home page Code Monkey logo

react-uport-box's Introduction

โš ๏ธ No new changes will be made to this box! There's good news though: ๐Ÿค˜ the uPort team maintains an official uPort Connect Truffle Box!. We recommend using that instead.

React, Redux and UPort Authentication Truffle Box

In addition to Webpack and React, this box adds: react-router, redux and redux-auth-wrapper for authentication powered by UPort. The easiest way to get started with UPort.

Installation

  1. Install Truffle globally.

    npm install -g truffle
  2. Download the box. This also takes care of installing the necessary dependencies.

    truffle unbox react-uport
  3. Run the development console.

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

    compile
    migrate
  5. 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 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.

    // If inside the development console.
    test
    
    // If outside the development console..
    truffle test
  7. 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
  8. To build the application for production, use the build command. A production build will be in the build_webpack folder.

    npm run build

FAQ

  • How do I use this with the EthereumJS TestRPC?

    It's as easy as modifying the config file! Check out our documentation on adding network configurations.

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

    truffle-config.js is a copy of truffle.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!

react-uport-box's People

Contributors

benjamincburns avatar bmmpxf avatar cgcardona avatar cruzmolina avatar dconroy avatar gnidan avatar mikeseese avatar onlyonejmjq avatar tranquilitho avatar zoyescreative avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

react-uport-box's Issues

Error: JWT has expired

Was part of a hackathon a few months ago and we used the uport box to bootstrap the project. It was working then but not now. Trying to get this to work but continue receiving this error: Error: JWT has expired.

Code we had working 2 months ago was: export let uport = new Connect('TruffleBox');.

Project is at - https://github.com/micksabox/ethwaterloo2017

Any idea why this may be happening and how I can fix?

SimpleStorage.sol ParserError: Expected token LBrace got 'View' function get() public view returns (uint)

Following instructions: http://truffleframework.com/boxes/react-uport

npm update -g truffle
truffle unbox react-uport
Downloading...
Unpacking...
Setting up...
Unbox successful. Sweet!

Commands:

  Compile:              truffle compile
  Migrate:              truffle migrate
  Test contracts:       truffle test
  Test dapp:            npm test
  Run dev server:       npm run start
  Build for production: npm run build

truffle develop

Compiling ./contracts/Migrations.sol...
Compiling ./contracts/SimpleStorage.sol...

/Users/zen/Dropbox/Musafa/dev/truffle-uport-react/contracts/SimpleStorage.sol:10:25: ParserError: Expected token LBrace got 'View'
  function get() public view returns (uint) {
                        ^
Compiliation failed. See above.

Test suite failed to run

I got the following issue (likely a noob one ;)

 FAIL  src/App.test.js
  Test suite failed to run

    ENOENT: no such file or directory, stat '/home/m/dmc/truffle-box-uport/\config\polyfills.js'
        at Error (native)
      
      at Object.fs.statSync (fs.js:987:18)
      at Object.statSync (node_modules/graceful-fs/polyfills.js:297:22)


Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        0.007s
Ran all test suites.

at the same time, truffle test works just fine.
What am I doing wrong? Thanks for the heads-up.

Error while running command "npm install"

After unboxing project i ran command "npm intsall" and got this error
Unexpected end of input at 1:77191
"esprima-fb":"^10001.1.0-dev-harmony-fb","gh-got":"^1.0.3","istanbul"

I don't know why i am facing this issue.

Error starting up box

I am trying to create a new app from this truffle box, but upon installation when I run the npm run start command, an empty page opens in the browser. I get this error from the console: Network configuration not available for 'rinkeby or ropsten or kovan'.

I am connected to a local testrpc network and have metamask connected to that network.

My truffle config looks like this:

`require('babel-register')

module.exports = {
networks: {
ropsten: {
provider: function() {
return new HDWalletProvider(mnemonic, "https://ropsten.infura.io/");
},
network_id: '3',
},
test: {
provider: function() {
return new HDWalletProvider(mnemonic, "http://127.0.0.1:8545/");
},
network_id: '*',
},
}
}`

What is the proper way to set up this truffle box to get the app running on a local server?

I am using truffle v4.1.12 on macOS

Problem with routing

Just by running this out of the box, the uport login seems to work. However the problem comes with trying to access any of the other page routes like /dashboard or /profile. They all seem to redirect to "http://localhost:3000/?redirect=%2Fdashboard" and all you can view is the homepage again. Once I login through uport in the console I get this error: Unhandled rejection Error: Failed to get value uportlib.js:59140

I'm wondering if this has to do with the new library connect that uport uses, or is this somehow related to how proptypes is handled?

Unable to resolve DID document for did:uport

Hi thanks for making uport. I am trying to use the react-uport-box and have set up with the app manager for my application which I am working on developing locally in development mode. I placed the code for uport connect and the SimpleSigner in the connectors file which is where it makes sense to place it but when I try to log in with the uport mobile app I get this error:

Unable to resolve DID document for did:uport

Any direction as to how to correct this would be a big help! Thanks!

Pragma Syntax

I was following the README on getting setup and ran into the following truffle compile errors:

ryan$ truffle compile
Compiling ./contracts/Migrations.sol...
Compiling ./contracts/SimpleStorage.sol...

/Users/ryan/Development/react-uport/contracts/Migrations.sol:1:1: SyntaxError: Source file requires different compiler version (current compiler is 0.5.0+commit.1d4f565a.Emscripten.clang - note that nightly builds are considered to be strictly less than the released version
pragma solidity ^0.4.24;
^----------------------^
,/Users/ryan/Development/react-uport/contracts/SimpleStorage.sol:1:1: SyntaxError: Source file requires different compiler version (current compiler is 0.5.0+commit.1d4f565a.Emscripten.clang - note that nightly builds are considered to be strictly less than the released version
pragma solidity ^0.4.17;
^----------------------^
Compilation failed. See above.
Truffle v5.0.4 (core: 5.0.4)
Node v9.11.1

I found this stackoverflow article that pointed me in the direction of how to get around this with my version of Truffle and Node.
tl;dr: pragma solidity ^0.4.24 โ†’ pragma solidity >=0.4.24 in those two files.

This obviously depends on the versions people are running. But, it may be worth making the change or documenting that if people run into similar issues, how to immediately resolve it without having to duplicate research.

Initializing Repo Instrucitons - Geth & Truffle

I tried to get this repo up and running. I could get npm to install and run on my local machine but was given these errors when I tried to run the truffle compile / truffle migrate commands:

Error: Using 'babel-preset-react-app' requires that you specify 'NODE_ENV' or 'BABEL_ENV' environment variables. Valid values are "development", "test", and "production". Instead, received: undefined. (While processing preset: "/Users/john/Dev/projects/temp/truffle-box/node_modules/babel-preset-react-app/index.js")

I fixed this by adding the variable in front of my command:

NODE_ENV=test truffle compile
NODE_ENV=test truffle migrate

Then I got this error:

Error: Invalid JSON RPC response: "Error: connect ECONNREFUSED 127.0.0.1:8545\n    at Object.exports._errnoException (util.js:1022:11)\n    at exports._exceptionWithHostPort (util.js:1045:20)\n    at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1090:14)"

So I opened up another terminal, opened a geth console, and executed this command to get it working:

geth console
admin.startRPC("127.0.0.1", 8545, "*", "web3,db,net,eth")

After that, the compile worked just fine but the migration did not. I got this error:

                 ^
ReferenceError: artifacts is not defined```

This however, I'm not sure what the intention is.  I can re-map it to ./contracts/Migrations.sol and the same for the SimpleStore.sol file, but not sure what artifacts is, and the metacoin file also includes a missing a wrong "./MetaCoin.sol" when I believe you're really trying to reach the ./TestMetacoin.sol file.  Not sure if the intention is to use https://github.com/trufflesuite/truffle-artifactor... just looking for some clarification.  I've included a pull request here (https://github.com/truffle-box/truffle-box-uport/pull/4) to fix some of these issues, but not exactly sure where to go in order to resolve all the artifact stuff.  

Truffle test did't see Assert.sol

Hi, I have latest version of truffle installed globally but when I run truffle test this was the output:

File not supplied initially. import "truffle/Assert.sol";

I think that the boilerplate try to read from node_modules and not globally.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.