This starter box comes with the basics to create a drizzle connected Vue dapp. It leverages drizzle's Vue plugin
Check out this sweet 3 part video series Create a Vue Dapp on Ethereum with the Drizzle Vue plugin by Julien Klepatch: Part I, Part II and Part III
-
First ensure you've navigated to an empty folder as Truffle will download boxes in the current working directory.
$ mkdir my-sweet-vue-dapp && cd $_
-
Execute the
unbox
command and watch truffle orchestrate devops magic.$ truffle unbox vue-box
-
Test the box. You'll need a browser and two terminal instances: one for truffle's develop console and one for Vue's dev server.
a. Truffle terminal.
- Start the development console
$ truffle develop
- Migrate the sample contracts
truffle(develop)> migrate
- wait for the migration to complete before proceeding
b. Start the Vue dev server, which is located in the
vapp
folder$ cd vapp $ npm run serve
c. Browser: You can test with or without metamask.
- without MetaMask
- Use Chrome's
incognito mode
or Firefox'sprivacy mode
and navigate to: http://localhost:8080/
- Use Chrome's
- with MetaMask
- Make sure you've set up metamask to use port 9545 and then navigate to: http://localhost:8080/