Ad

Friday, October 5, 2018

web3.js library, the Ethereum JavaScript API

This video explains what the purpose is of the web3.js library and how to use it.
The web3.js library is also known as the Ethereum JavaScript API.

To communicate with an Ethereum node or transact with a smart contract deployed on the blockchain from inside a JavaScript or web application you can use the web3.js library.
Under the hood the web3.js library communicates with an Ethereum node through JSON RPC calls.
The Ethereum node must expose its a RPC layer.

The MetaMask extension exposes the web3 API by an injected web3 object which you can access via JavaScript.
The MetaMask extension does not support most synchronous web3 API methods. Make your method calls asynchronous!

To use the web3.js library in your web application:
- Download the web3.js library from: https://github.com/ethereum/web3.js
- In the dist folder you will find the files web3-light.min.js and web3.min.js
- The file web3.min.js contains the Bignumber module and the file web3-light.min.js does not.
If you do not know which one to choose, then use file web3.min.js.

Web3.js API code examples can be found at: http://www.mobilefish.com/down....load/ethereum/web3ap
In the examples asynchronous methods were used if they are available.

The demonstration Ethereum Dapp is made for educational purpose.
The web interface can be found at: http://www.mobilefish.com/down....load/ethereum/DemoDa
The associated Solidity contract can be found at: http://www.mobilefish.com/down....load/ethereum/DemoCo
The main purpose of this Dapp is to learn how to use web3.js api (v0.x.x) and how interact with a deployed smart contract.

To setup the demonstration Ethereum Dapp (DemoApp.html):
- Download and deploy the DemoContract.sol smart contract on any test network (testrpc, ropsten, rinkeby, or your own private ethereum node, etc).
Save the contract address you will need it later.
- Download and install the DemoApp.html on your web server.
- Download and install the web3.min.js (v0.19.0) on your web server.
- Modify the path to web3.min.js in the DemoApp.html file.
- Modify the contract address in the DemoApp.html file.

How to use the demonstration Ethereum Dapp (DemoApp.html):
- Use a test network.
- Have a test account with enough ethers to experiment with.
- The demonstration Dapp (DemoApp.html) also works well with MetaMask.

Notes:
Two versions of DemoApp.html has been created.
- A version using callbacks which is not very readable because of using callback trees!
For educational purpose you can find this version at (but do not use it!):
http://www.mobilefish.com/down....load/ethereum/DemoDa
- The original code has been refactored by using JavaScript Promises.
http://www.mobilefish.com/down....load/ethereum/DemoDa
- The DemoApp.html uses only vanilla JavaScript an uses the web3.js library.
All code meaning: JavaScript, HTML and CSS can be found in this single web page.

Warnings:
- The DemoApp.html does not work with the web3.js v1.0.0.
- The web3.js library v1.0.0 has many changes.
The DemoApp.html will soon be obsolete.
- Use the Demonstration Ethereum Dapp on a test environment.

Check out all my other Ethereum related tutorial videos:
https://goo.gl/eNJVXe

Subscribe to my YouTube channel:
https://goo.gl/61NFzK

The presentation used in this video tutorial can be found at:
http://www.mobilefish.com/deve....loper/blockchain/blo


The DemoContract.sol used in the video:
http://www.mobilefish.com/down....load/ethereum/DemoCo

To interact with the DemoContract.sol use the demonstration Ethereum Dapp (using Javascript Promises):
http://www.mobilefish.com/down....load/ethereum/DemoDa

An older version of the demonstration Ethereum Dapp (do not use this):
http://www.mobilefish.com/down....load/ethereum/DemoDa

More information about RPC layer can be found at:
https://youtu.be/oOfDzXBXoOg

The web3.js library can be found at:
https://github.com/ethereum/web3.js

The web3.js API v0.x.x can be found at:
https://github.com/ethereum/wi....ki/wiki/JavaScript-A

The web3.js API v1.0 can be found at:
http://web3js.readthedocs.io/en/1.0/

MetaMask web3 API can be found at:
https://github.com/MetaMask/fa....q/blob/master/DEVELO

#mobilefish #howto #ethereum
by via MiniTube - The Ultimate Video Sharing Platform http://bit.ly/2wuS2WH October 04, 2018 at 09:05AM http://bit.ly/2yh9Swz

No comments:

Post a Comment