Testing vue + web3 and smart contract on localhost: Part1

Simple Smart Contract

I will use the Storage Example in the documentation

// SPDX-License-Identifier: GPL-3.0
pragma solidity >=0.4.16 <0.9.0;

contract SimpleStorage {
uint storedData;

function set(uint x) public {
storedData = x;

function get() public view returns (uint) {
return storedData;

Remix IDE

Remix IDE is an easy-to-use tool for developing and deploy smart contracts.


Ganache is a personal blockchain for rapid Ethereum and Corda distributed application development.


MetaMask is a crypto wallet and is provided as a browser extension.

MetaMask & Localhost

If you click the network at the top, several will appear, but what we need is a localhost environment.

Smart Contract Deploy



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store