Confident User Interface Programming

Unit tests are a pretty powerful technique. They allow us to take a small portion of our code and exercise it in a vast array of different scenarios in fractions of a second, validating that our beliefs assumptions hold true. When done well they can act as guard rails that give immediate feedback on changes.

When we build and modify user-interfaces, how do we achieve the same sense of confidence when making changes? In some cases it's possible to write unit tests, but coming up with sensible assertions for visuals or interactivity is extremely difficult. Its likely that most UI tests in the wild are slow and brittle because they exercise the whole system end-to-end.

When building UI code around components some capabilities in this area begin to emerge. By combining this with hot reloading techniques and a DSL for expressing the variety of states a component may find itself in, we can build up a powerful feedback tool that assists us in building and making changes to components while remaining confident that things continue to behave as expected.

Talk objectives:

- Thinking more about the effectiveness automated and semi-automated testing of UI code
- An appreciation for fast feedback cycles
- Understanding what hot-reloading means in a browser context
- Demonstrate building user-interface components *outside* the main application before integrating them
- Familiarity with [Devboard] and its inspiration [Devcards]

Target audience:

User Interface programmers, especially those on the Web and those using React (or any other declarative component-based UI system).