One area of Blockchain technology is about migrating technology from the hands of few, to the hands of many. Trying to give people a fairer set of benefits and opportunities.
With visions like these, though with an unclear path, the blockchain technologies and applications are always pushed and pivoted in different directions.
Getting started and iterating over projects fast is essential in this space. Thought the path is unclear, we need more people with us to stake out directions.
This boilerplate should give you a fast start in developing smart contracts and visualizing them in a web-frontend.
You will need some prerequisites installed
- Node
- NPM
- Truffle. ´´´npm install -g truffle´´´
- BootstrapVue ´´´npm i -g vue-cli´´´ Then clone the repository ´´´git clone https://github.com/blockchangers/eth-truffle-vue.git MyDapp´´´
CD into "MyDapp" and run ´´´npm run init´´´. This will install all NPM packages for backend and frontend.
After installation is done, you should be able to start the project. Run ´´´npm run eth´´´ to start a local Ethereum development node. Run "migrate" in the Truffle console to deploy the contracts to your local Ethereum network. Then in another terminal run ´´´npm run frontend´´´ to start frontend application in development mode (with watchers, hot reloading ... ).
Smart contracts are created and maintained under backend/eth/contracts. Run "migrate --reset --compile-all" to make changes and redeploy them to your local Ethereum network.
If you would need a centralizes server to serve the frontend application or do some other centralized stuff there is also an Express server that you can run up with running npm run backend
. You see all the code for this backend under backend/src.
The web frontend comes packed with Vue, VueX (state), VueRouter, BootstrapVue and web3 for connection to our Ethereum node. When running up the development server, it will first try and connect to a MetaMask extension if you have that, else it will connect to your local Ethereum node.
We have added some example functions to get a feel for how it works.
Please use, copy and share :) Thank you for reading