idmytro / XState-Vue-Workshop

State Modeling in Vue with XState

Welcome to the port of the Frontend Masters React + XState workshop written in Vue!

You can check out

• original React repo
• the Svelte port

XState

• GitHub repo: https://github.com/statelyai/xstate
• Documentation: http://xstate.js.org/docs
• Visualizer: http://xstate.js.org/viz

Getting Started

To run this workshop:

• Clone this repo
• Run npm install or yarn
• Run npm run dev or yarn dev
• Navigate to http://localhost:3000/00 to get to the first exercise.

Exercises

Exercises are separated by directory in exercises/##/. Each directory will contain a README.md describing the goal of the exercise, as well as tips and comments in the Exercise.vue and timerMachine.js files.

Your objective is to accomplish the goals in README.md. If you get stuck, refer to the timerMachine.final.js file and/or import Exercise.final.vue in components/ExerciseView.vue.