Truffle Setup – How Truffle Works Without a Web3 Provider

dapp-developmenttruffleweb3-providers

I have a question about the init project with Truffle.

I can't understand how – in app.js – they use the deployed contract without a web3 provider, like this: 

var provider = new Web3.providers.HttpProvider("http://localhost:8545");
var contract = require("truffle-contract");

var MyContract = contract({
  abi: ...,
  unlinked_binary: ...,
  address: ..., // optional
  // many more
})
MyContract.setProvider(provider);

Best Answer

In Truffle 0.2.x or 0.3.x with the truffle-default-builder, app.js in the ./build folder will include considerable bootstrap code that sets the stage.

This is why the HTML should link to the ./build folder when the source appears to reside in ./app (usually). It's the build output that should be served.

Truffle includes a simple Migrations.sol contract in all projects. It's involved as a sort of name registry when you deploy with $ truffle migrate or interrogate the contract addresses with $ truffle networks.

enter image description here

Every contract gets a JavaScript wrapper - usually contractName.sol.js. That's where a lot of the ABI and promisifying happens.

When you have an app.js front-end and you use the build pipeline, truffle injects code about your code in the ./build folder. You can see Web3 there and also see Migrations is involved.

enter image description here

They have a config file that describes the files to include in the build process, and the network configuration for the blockchain. Truffle uses this during build and migrate.

enter image description here

For example, I found this in one of my app.js output files.

enter image description here

So, in terms of "I can't understand how - in app.js - they use the deployed contract without a web3 provider"

  1. They load a web3 provider. They do it for you.
  2. They know where the contract is deployed. They track it as they do the deployments for you.
  3. They parse your contracts and the ABI and create a JavaScript (ver 2) or JSON (ver 3) abstraction.
  4. The app.js you work on is an input to pipeline that outputs a runnable app.

Hope it helps.

Related Topic