reach vue3 starter

Template/Scaffold for a Reach Lang + Vue3 DApp

MrJackdaw
4
0
Vue

reach-vue3x Application Scaffold

What is it?

Based on the Reach-Reach starter. This is a quick scaffold/template for building a Vue3 and Reach Lang DApp. Excluding a few (mainly DApp-specific) additions, this is a standard Vue3 Typescript application.

What does it contain?

  • Vue3 with Typescript support: A popular front-end framework for building web applications
  • Reach Language: A compiled language for building multi-chain smart contracts. This template includes the JS dependency, and not the CLI.
  • Google’s Material Icons for quick UI sugar
  • SASS (no pre-defined style libraries: you can npm install any additional dependencies.)
  • 🦆 raphsducks: an unopinonated state manager.
  • 🦆 reachduck: a simple API for interacting with the blockchain and/or a reach stdlib instance

How do I use it?

  1. Clone the project
  2. cd path/to/my-project
  3. rm -rf .git && git init (create a fresh git repository for your project)
  4. npm install
  5. npm run start (launches at localhost:3000)

Take a look at Available Scripts for additional CLI commands.

Reach Helpers

This project includes some helpful bits, including

  • A self-contained state instance. You can subscribe to it like any other state.
  • A connect button that will automatically trigger a wallet connection.
    Default network is Algorand, but if your stdlib instance is using ETH, it will trigger MetaMask.
  • A stub Reach application to get you started on your multichain smart contracts. I personally use the directory to store my compiled contracts.
  • A light API for interacting with your @reach/stdlib instance.

Available scripts

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your unit tests

npm run test:unit

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.