DX, what is it?
If you are a frontend developer, you primarily write code with the end user of the application in mind. However, there's a second user that you should always think about when writing code. The developer. We call the experiences that these two groups have User Experience (UX) and Developer Experience (DX), and today I want to talk about DX.
Creating a good experience for the developer is crucial for maintaining both speed and motivation in a product organisation. Yet it's easy to lose sight of DX over time.
Some factors that I classify as important for improving DX are
- Decreasing cognitive load
- Increasing output speed
- Reducing development friction
- Speeding up the feedback loop
With this little project I want to showcase some technology that could improve the Menti DX in several of these areas. I have prepared a github repo with some exercises to get a feel of these DX improvements in action, so that we can all have a sensible baseline when discussing DX.
To continue with the exercises you should go to my github and clone this repo, and then follow the instructions below.
Get started
To get started developing you need to do a couple of things.
- First off, run
yarn installto set the project up. - Disable the flow plugin in VSCode
- Enable the builtin typescript plugin: Go to plugins and search for
@builtin typescriptand make sure both plugins are enabled. This is actually enabled by default in VSCode, but most Mentimeter devs have disabled it globally so they can run Flow instead.
Finally, run yarn dev and then visit http://localhost:1337 to get this page running from your own machine!
There are two sets of exercises
Go to each page to run through the exercises and get a feel for the productivity wins that we could unlock in our codebases!
Now what?
TODO!