/frontend-masters-xstate-workshop

Frontend Masters State Machines & XState Workshop

Primary LanguageJavaScriptMIT LicenseMIT

Frontend Masters XState Workshop

Welcome to the Frontend Masters workshop on JavaScript State Machines and Statecharts with XState. In this workshop, you will:

  • Learn fundamental computer science principles
  • Represent complex logic clearly
  • Prevent impossible states and detect edge-cases
  • Identify and eliminate edge cases
  • Visualize your logic as state machine diagrams

XState

Getting Started

To run this workshop:

  • Clone this repo
  • You need to have parcel installed. To do this, run npm install -g parcel-bundler.
  • In the repo's directory, run npm install
  • Run npm start. You should see this:
Server running at http://localhost:1234

Exercises

Exercises are separated by directory. The first lesson is at 01/index.js. Each directory will contain a README.md describing the goal of the exercise, as well as tips and comments in the index.js file.

If you get lost, refer to the index.final.js file in each directory.

To navigate to a rendered exercise in the browser, change the directory in the URL (http://localhost:1234/[dir]/index.html). The first lesson is located at http://localhost:1234/00/index.html.