ETH — Cheat Sheet for MacOS Ethereum development
Tags: howto, development, blockchain, javascript
Published: 2020-11-04 21:19:43

---
title: ETH — Cheat Sheet for MacOS Ethereum development
published: true
date: 2020-11-02 22:53:58 UTC
tags: howto,development,blockchain,javascript
canonical_url: https://medium.com/coinmonks/eth-cheat-sheet-for-macos-ethereum-development-804f1f77b09b
---

### ETH — Cheat Sheet for MacOS Ethereum development

![](https://cdn-images-1.medium.com/max/1024/1*ysBX0iqwZogyaBuJOXV4bw.jpeg)<figcaption>A quick and dirty cheat sheet for Ethereum development on MacOS to win your deployments</figcaption>

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](https://formulae.brew.sh/formula/) that Apple (or your Linux system) didn’t.

[Homebrew](https://brew.sh)

> $ /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.

[nodejs/node](https://github.com/nodejs/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_

[npm/cli](https://github.com/npm/cli)

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.

[trufflesuite/truffle](https://github.com/trufflesuite/truffle)

> $ mkdir test  
> $ cd test/  
> $ npm init -y  
> $ npm install truffle  
> $ npx truffle init

### 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.

[React - A JavaScript library for building user interfaces](https://reactjs.org/)

> $ 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](https://github.com/trufflesuite/ganache-cli) (formerly known as the TestRPC). All versions of Ganache are available for Windows, Mac, and Linux.

[Ganache | Truffle Suite](https://www.trufflesuite.com/ganache)

#### 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-javascrip](https://engineering.fb.com/2016/10/11/web/yarn-a-new-package-manager-for-javascript)t

> $ 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.

[johnpapa/lite-server](https://github.com/johnpapa/lite-server)

#### 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.

[web3.js - Ethereum JavaScript API - web3.js 1.0.0 documentation](https://web3js.readthedocs.io/en/v1.3.0/)

#### 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”.

![](https://cdn-images-1.medium.com/max/366/1*CBMehVTTtHXI1X3k9rFMUA.png)<figcaption>To create a new network just choose Custom RPC</figcaption>

![](https://cdn-images-1.medium.com/max/365/1*L0LMIBm5Vzbp5kDavbvjXQ.png)<figcaption>Note that if you’re using Ganache UI, the default port is 7545, if you’re using Ganache-cli it’ll be 8545</figcaption>

If you’d like to access directly from your app, you can create an account on [infura.io](https://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 <network> by the network you choose to work with and off course “YOUR-PROJECT-ID” by the infura’s project ID you’ll work with.

* * *