Git Product home page Git Product logo

ethereum-vuejs-dapp's Introduction

Ethereum and VueJS DApp

This is a simple decentralized application built using Ethereum blockchain and Vue JS for the front-end. This DApp example let the users store their profile (name and status) on the blockchain.

N|Solid

Brief description

The DApp allow users to register their name and status on the blockchain. The user's profile is associated with an account address (or wallet addres).

The owner of the profile is the only person who can modify his own data. This will give you a technical explanation of what it means when the user is in control of his own data (just like Facebook… sarcasm!). The smart contract is designed to give the user the control of his own information and not even the creator of the smart contract can control any data.

Prerequisite

  • NPM version 5.8.0
  • TRUFFLE verson 4.1.5
  • Ganache or your private network
  • Metamask: not mandatory but better if you want to register more users

Quick Installation

  1. Download the project and decompress it into the folder ~/ethereum-vuejs-dapp (or wherever you want).
  2. Start ganache (or your private blockchain).
  3. Open the terminal (if you are using Windows you must use the Power Shell) in the folder ~/ethereum-vuejs-dapp and run the command:
$ truffle console --network ganache
  1. If ganache is running you should be inside the truffle console; now run the following command in the truffle console:
> migrate --reset --compile-all
  1. If the migration was successful, copy the file ~/ethereum-vuejs-dapp/build/contracts/Users.json into the folder ~/ethereum-vuejs-dapp/app-users/src/assets/
  2. Open another terminal in the folder ~/ethereum-vuejs-dapp/app-users and run the command:
$ npm install
  1. Once all the dependencies are installed run the command:
$ npm run dev

If everything went fine, the terminal will display a message similar to:

DONE  Compiled successfully in 5166ms           15:54:53

Your application is running here: http://localhost:8080
  1. Open the browser, go to the URL shown by your terminal and play with the DApp!

NOTE: if you want to try to add more user profiles you have to install metamask in your browser, then import the accounts into metamask and finally change account on metamask in order to register a new user.

Visit DanieleFavi.com for more info.

ethereum-vuejs-dapp's People

Contributors

danielefavi avatar

Watchers

 avatar

Forkers

daerxi

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.