what-is-web3js-blockchain-decentralized-web.png

Introduction to Web3.js

BlockChain Expert 24/August/2018

Web3.js - Introduction

    Web3.js is a collection of inbuilt libraries that help to communicate with local or remote ethereum nodes by using HTTP or Interprocess communication (IPC).Web3 is designed to work from both client and server side. We can consider a web3.js as a gateway between Ethereum blockchain and a smart contract. This can be considered as the most advanced js library available.

If we want to call a function we need 3 things mainly-

>Address of the smart contract we use
>The function which we want to call
>The variable we want to pass

In Ethereum it only reads a language called JSON-RPC, which is not a user readable format. It almost looks line the beneath line:

{"jsonrpc":"2.0","method":"eth_sendTransaction","params":[{"from":"0xb60e8dd61c5d32be8058bb8eb970870f07233155","to":"0xd46e8dd67c5d32be8058bb8eb970870f07223567","gas":"0x76c0","gasPrice":"0x9184a67a000","value":"0x9124e72a","data":"0xd46e8dd67c5d36be8d46e8dd67c5d32be8058bb8eb970870f072445675058bb8eb970870f072445675"}],"id":1}
Note: JSON RPC is light weighted  RPC(Remote Procedure Call) protocol. Which specifies certain rules and data structures around their processing. By using the web3, it will become easy to understand. We are only needed to interact with an easy, readable and convenient JS interface.

From the above-constructed query, calling a function in our code will look something like this:
CryptoTranscation.methods.createSomethingGreat("WEB3.JS…..")
.send({ from: "0xb60e8dd61c5d32be8058bb8eb24aod07233155", gas: "1000" })

what-is-web3js-blockchain-decentralized-web-1-blockchain-expert

Getting started with web3.js.
For connecting a smart solidity contract in ethereum blockchain we need to install web3.js into our project. For this we can use one of the below methods:
 
// Using NPM
npm install web3

// Using Yarn
yarn add web3

// Using Bower 
bower install web3

// pure js: link the  
dist/web3.min.js
// ...etc.

    After installing npm, node js , we need to create a web3 instance and set a provider. Ethereum supported browser like Meta Mask, infura are properly installed, then we can connect to a local or remote node.

    In blockchain, especially the ethereum is made of nodes that share the same copy of data. By setting a web3 provider in a web3.js will helps the code to understand which node we are going to handle our functions. We can host our own node as a provider.

Mostly we use some third-party services that help to maintain nodes in order to provide Dapp services. Some of the main providers include- Infura , MetaMask.
Infura is a way to access the ethereum node over Jason-RPC which we can access through their API.With infura we can maintain our ethereum blockchain without setting up and maintaining our own nodes.

MetaMask is a web browser add-on which acts as a bridge between and helps to run the Ethereum DApps without running the Ethereum full node. Metamask allows you to manage your Ethereum accounts and private keys, and use these accounts to interact with contracts that are using Web3.js. Metamask uses the infura.io servers as the web3 provider, other than that it also gives their users to choose their own web3 provider.

Web3.js API Reference

Different library collection that is used to interact with ethereum ecosystem are:

> web3-eth- is for the ethereum blockchain and smart contract.

Contains the ethereum blockchain related methods.
Example 
var eth = web3.eth;

>  web3-eth-contract - is for creating a new contract instance with all its methods and events.
web3.eth.contract(abiArray)
Makes an easy interact with smart contract on ethereum blockchain.This utility will allow one to interact with smart contracts as if they were JavaScript objects.

var myPersonalContract = new web3.eth.Contract([...], '0xde0B295669a9FD93d5F281xs7c85E40f4cb697BAe',
{
                                   from: '0x1234567890123456789012345678901234567891', // default from address
                                     gasPrice: '2000000' // default gas price in wei, 20 gwei in this case
});
>  web3-eth-accounts -contains functions to generate sign transactions and data for Ethereum accounts 
web3.eth.accounts
// or async
web3.eth.getAccounts(callback(error, result){ ... })
This property is read-only and returns a list of accounts the node controls.
Example:
var accounts = web3.eth.accounts;
console.log(accounts); // ["0x407d73d8a49eeb85d32cf465507dd71d507100c1"]

>  web3-shh -is for whisper protocol to communicate with peer to peer and broadcast.
 var Shh = require('web3-shh');
// "Shh.providers.givenProvider" will be set if in an Ethereum supported browser.
var shh = new Shh(Shh.givenProvider || 'ws://some.local-or-remote.node:8546');

>  web3-utils-it mainly contains some helper function (utility functions) for Dapp developers.
fromWei (One of the utility package from  web3)
web3.fromWei(number, unit)
Converts any wei value into a ether value.
Example:
var value = web3.fromWei('2100000000000', 'finney');
console.log(value); // "0.0021"
>  web3.toWei

web3.toWei(number, unit)
Example:
var value = web3.toWei('1', 'ether');
console.log(value); // "1000000000000000000"

> web3.currentProvider

 This api will contain the current provider.
Example:
// Check if mist etc. already set a provider
if(!web3.currentProvider)
   web3.setProvider(new web3.providers.HttpProvider("http://localhost:8545"));