TDD - Test Driven Development in Vue

I've become a big fan of TDD over the last 12 months or so and sometimes find it hard to explain to other developers in more detail how it works as it's actually very simple, but can create a lot of confusion.

In my opinion, TDD lets you create superior tests and better quality code overall. After having done TDD for a while, creating tests after creating the code now feels fake and inefficient

So instead of explaining it myself I have found 2 useful videos that do a great job of both explaining TDD as well as give an overview of my favorite frontend testing tools Jest and Cypress (tip: both are included in the VUE-CLI).

First video: Test Driven Development in Vue with Cypress by Josh Justice

In this video Josh gives a nice run through of TDD with Cypress doing both E2E tests as well as unit tests:

Second video: Test driven development with Vue.js by Sarah Dayan

In this video Sarah talks a bit more about the TDD philosophy and answers some typical questions that arise when first starting with TDD. This video uses Jest only though (I prefer to focus on Cypress test).