kellygilliam / vuetron

An electron desktop app for testing and debugging your Vue + Vuex projects

Vuetron *NOT READY FOR DEPLOYMENT

A Vue testing and debugging desktop app built on top of Electron.

Key Features

Eventstream with Time Travel Debugging:

Variable Subscription:

Component Tree Visualization:

• View your Vuex store's state
  • Instantly time travel between previous application states
• Subscribe to parts of your application's state
  • While you type, LivePreview will automatically scroll to the current location you're editing.
• GitHub Flavored Markdown
• Dark/Light mode
• Emoji support in preview 🎉
• App will keep alive in tray for quick usage
• Cross platform
  • Windows, Mac, and Linux ready.

Getting Started

To use Vuetron, you will need both the desktop application and install the library in your Vue project

Installing Vuetron desktop app

To clone and run this application, you'll need Git and Node.js (which comes with npm) installed on your computer. From your command line:

# Clone this repository
$ git clone https://github.com/talls-and-smalls/vuetron.git

# Go into the repository
$ cd vuetron

# Install dependencies
$ npm install

# Run the app
$ npm start

A step by step series of examples that tell you have to get a development env running

Adding Vuetron plugins in your application

In order for Vuetron to access the application, the vuetron library must be included

Installing the Vuetron npm module

$ npm install vuetron

In Vue:

import Vue from 'vue'
import App from './App.vue'

import { VuetronVue } from 'vuetron';

Vue.use(VuetronVue);

In Vuex Store:

import Vue from 'vue';
import Vuex from 'vuex';
import { VuetronVuex } from 'vuetron';

Vue.use(Vuex);

const store = new Vuex.Store({
  // ...
  plugins: [VuetronVuex]
})

Running the tests

Explain how to run the automated tests for this system

Break down into end to end tests

Explain what these tests test and why

Give an example

And coding style tests

Explain what these tests test and why

Give an example

Built With

• Vue.js - The web framework used
• Vuex - State Management
• Electron - Used to build desktop app
• Socket.io - Used communicate between Vuetron and client's application

Contributing

Found a bug? Have a suggestion? Feel free to submit issues!

Please read CONTRIBUTING.md for details on our code of conduct and the process for submitting pull requests if you're interesting in contributing to this project!

Authors

• Samantha Salley - https://github.com/samanthasalley

• Louis Rouaze - https://github.com/louisrouaze

• Kelly Gilliam - https://github.com/KellyGilliam

• Brandon Danh - https://github.com/brandondanh

See also the list of contributors who participated in this project.

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Acknowledgments

• the Vue team for a great framework
• vued3tree library
• Support from other open source developers
• And the entire Vue developer community