The other day, I wanted to help a friend to start his Ethereum development Environment on MacOS and I didn’t remember how much little stuff you need to install to make it work. So here is my small Cheat Sheet to start his Ethereum development Environment on MacOS It’s missing few things for now, but I’ll add them soon. Don’t hesitate to tell me what to improve!

Homebrew

Homebrew is a packages manager for MacOS. It installs the stuff you need that Apple (or your Linux system) didn’t.

$ /bin/bash -c “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"

NodeJS

NodeJS is a server-side JavaScript plateform (that will execute JavaScript code outside a web browser) to create apps taht will communicate with your ethereum node.

brew install node

npm

npm is a package manager for the JavaScript programming language. It’s also the default package manager for the JavaScript runtime environment Node.js

Normally npm comes directly when you install NodeJS, but you can force it this way:

$ brew install npm

Truffle

Truffle is a development environment, testing framework and asset pipeline for Ethereum. %[github.com/trufflesuite/truffle]

$ mkdir test
$ cd test/
$ npm init -y
$ npm install truffle
$ npx truffle init
$ npx truffle console --network mainet|rinkeby|devlopment|matic

React

React is an open-source, front end, JavaScript library for building user interfaces or UI components. It is maintained by Facebook and a community of individual developers and companies.

$ npx truffle unbox react

Ganache

Ganache is a personal blockchain for rapid Ethereum and Corda distributed application development. It can be used across the entire development cycle; enabling you to develop, deploy, and test your dApps in a safe and deterministic environment.

Ganache UI

Ganache UI is desktop application supporting both Ethereum and Corda technology. In addition, an Ethereum version of ganache is available as a command-line tool: ganache-cli (formerly known as the TestRPC). All versions of Ganache are available for Windows, Mac, and Linux.

Ganache-cli

Please reming that ganache-cli will run on the port 8545

$ mkdir test
$ cd test/
$ npm init -y
$ npm install ganache-cli
$ npm run ganache

Hd-Wallet-Provider

$ npm -i — save-dev truffle-hdwallet-provider

Yarn

Yarn is an open-source package manager, alternative to npm released by Facebook in 2016 for installing modular JavaScript. For more information, you can refer to https://engineering.fb.com/2016/10/11/web/yarn-a-new-package-manager-for-javascript

$ brew install yarn
$ yarn bootstrap
$ yarn start //in the front-end folder

Lite-server

Lite-server is a development only node for web app. It opens in the browser and will refresh automatically when the HTML or Javascript changes.

Installation

$ npm install lite-server — save-dev
$ yarn add lite-server — dev

Usage

Add a script entry in package.json

## Inside package.json…
“scripts”: {
 “dev”: “lite-server”
},
$ npx lite-server //using on the fly
or
$ npm run dev
or
$ lite-server //if installed globaly

Ethereum Smart Contract Development Process on Ganache

$ mkdir myProject //create a folder for the project
$ cd myProject/ //go inside the folder
$ truffle init //initialize a new truffle
$ truffle create test myProject //test cases creation
$ npm run ganache //launch ganache-cli local blockchain
$ truffle comple -all — network development //deploy code on ganache blockchain
$ truffle console //grab info after manual testing
$ truffle test //automated test cases

Web3.js

Web3.js is a popular JavaScript library that allows you to interact with a local ou remote Ehtereum node, it offers an easy way to use the API of Ethereum, for example to access its smart-contracts and related encryption/decryption functions.

3 ways of adding web3.js

$ npm install web3//npm installation
$ yarn add web3 //yarn installation
- download and link the dist /web3.min.js //pure js

Setting the provider

If you’d like to use Web3 to communicate with the blockchain, you’ll need to connect it to an Ethereum node, by using a Web3 provider. The easiest way to interact with the blockchain is to set up MetaMask on your browser and use this code in your development.

window.onload = function() {
updateETHBlocks();
};
async function updateETHBlocks() {
let web3 = new Web3(Web3.givenProvider);
let latest = await web3.eth.getBlockNumber();
console.log(latest);
for (var i=0; i < 10; i++) {
let block = await web3.eth.getBlock(latest-i);
printBlock(block);
}
}

If you’d like to connect Web3 to Ganache, it’s pretty easy : just create a new network using the option “Custom RPC”.

If you’d like to access directly from your app, you can create an account on infura.io and use this code:

async function updateBlocks() {
let web3 = new Web3(“https://<network>.infura.io/v3/YOUR-PROJECT-ID”);
let latest = await web3.eth.getBlockNumber();
console.log(latest);
for (var i = 0; i < 10; i++) {
let block = await web3.eth.getBlock(latest — i);
printBlock(block);
}
}

Please replace by the network you choose to work with and off course “YOUR-PROJECT-ID” by the infura’s project ID you’ll work with.