Sample Dapp - How to run a Dapp after deployment?

maxxflyermaxxflyer Member Posts: 30
edited April 2016 in Mix
Sample Dapp - How to run a Dapp after deployment?

I run geth on a private test chain and I unlock my account

geth --identity "Qbert" --genesis Mychain/MychainGenesys.json --rpc --rpcport "8000" --rpccorsdomain "*" --datadir "Mychain" --port "30303" --nodiscover --ipcapi "admin,db,eth,debug,miner,net,shh,txpool,personal,web3" --rpcapi "db,eth,net,web3" --autodag --networkid 666666666 --nat "any" --unlock 0 console

I deploy the Sample contract and everything goes well

Then I go to the package with the browser at index.html, but the dapp isn't working.

How can it find the web3 javascript libraries? they aren't declared anywhere in the html

The file deployment.js created my Mix calls web3.eth.contract(contracts[""].interface);

I get from browser js console : web3 is not defined

Mix contains all needed libraries, but what happens once we are outside Mix? any simple example/tutorial? Or.. am I missing something?

Is the node expected to make those libs available for the browser?

Thanks in advance
Post edited by maxxflyer on

Comments

  • maxxflyermaxxflyer Member Posts: 30
    The contract:

    //Sample contract
    contract Sample
    {
    uint value;
    function Sample(uint v) {
    value = v;
    }
    function set(uint v) {
    value = v;
    }
    function get() constant returns (uint) {
    return value;
    }
    }
  • maxxflyermaxxflyer Member Posts: 30
    edited April 2016
    The index.html

    !doctype
    html
    head

    script type='text/javascript'


    function get() {
    var param = document.getElementById('query').value;
    var res = contracts['Sample'].contract.get();
    document.getElementById('queryres').innerText = res;
    }

    function set() {
    var key = document.getElementById('key').value;
    var res = contracts['Sample'].contract.set(key);
    }

    /script
    /head

    body bgcolor='#E6E6FA'
    h3 Sample Ratings /h3
    div
    Store:
    input type='number' id='key'
    button onclick='set()'Save/button
    /div
    div
    Query:
    input value='get' type='button' id='query' onclick='get()' /
    div id='queryres' /div
    /div
    /body
    /html
  • maxxflyermaxxflyer Member Posts: 30
    The deployment.js

    // Autogenerated by Mix
    contracts = {};
    ctrAddresses = {};
    contracts["Sample"] = {
    interface: [{"constant":false,"inputs":[{"name":"v","type":"uint256"}],"name":"set","outputs":[],"type":"function"},{"constant":true,"inputs":[],"name":"get","outputs":[{"name":"","type":"uint256"}],"type":"function"},{"inputs":[{"name":"v","type":"uint256"}],"type":"constructor"}],
    address: "0xf4ce3093759deb93e087d7462237b08b1b9a6502"
    };
    contracts["Sample"].contractClass = web3.eth.contract(contracts["Sample"].interface);
    contracts["Sample"].contract = contracts["Sample"].contractClass.at(contracts["Sample"].address);
    contracts[""] = {
    interface: [{"constant":false,"inputs":[{"name":"v","type":"uint256"}],"name":"set","outputs":[],"type":"function"},{"constant":true,"inputs":[],"name":"get","outputs":[{"name":"","type":"uint256"}],"type":"function"},{"inputs":[{"name":"v","type":"uint256"}],"type":"constructor"}],
    address: "0xf4ce3093759deb93e087d7462237b08b1b9a6502"
    };
    contracts[""].contractClass = web3.eth.contract(contracts[""].interface);
    contracts[""].contract = contracts[""].contractClass.at(contracts[""].address);
    if (!ctrAddresses["Sample"]){ ctrAddresses["Sample"] = [] }ctrAddresses["Sample"].push("0xf4ce3093759deb93e087d7462237b08b1b9a6502")
  • YannYann Member Posts: 40
    edited April 2016
    Hi,

    You should browse index.html using Mist
  • maxxflyermaxxflyer Member Posts: 30
    I try to access the dapp via browser. My visitors won't use Mix
  • YannYann Member Posts: 40
    hm ok for now the official ethereum html/web browser is mist https://gitter.im/ethereum/mist
    If you really want to use a "normal" browser. You'll have to ship web3.js library in the packag, Instanciate a new web3 object and then set the api provider like : web3.setProvider(new web3.providers.HttpProvider('http://localhost:8545'));
  • maxxflyermaxxflyer Member Posts: 30
    I love you Yann. Yes, that's what I expected,simple html + js not sure why I got lost with Mix and Mist and Alethzero and meteor and truffle. This is perfect for a noob like me. It works! Thanks. So easy!
  • NicoC25NicoC25 Member Posts: 1
    edited September 2016
    Hi,
    I'm developping an Sample Dapp with Mix and I'm in the same case of maxxflyer at the begining of this post. I would like to use my dapp with a "normal" browser and I don't know how to ship web3.js library in the package produced by Mix and where instanciate the new web3 object.

    Thanks for advance for your reply !

    ps : Sorry for my poor english ^^
Sign In or Register to comment.