Introduction to Test Driven Development with React

In this video we learn how to apply Test Driven Development(TDD) to a react application. TDD is a test first approach. That means you write a failing test first. After the test is written you write the code to make it pass.

We will create an application using TDD and the amazing part is that we will only run the application at the end of the video. We will rely on our unit tests to build a working application!

GitHub

[mj]

for someone like me that haven't thought much about tests before, it just blew my mind when the first thing you did after project creation is to run the test command.

[moraisgabas]

Awesome content here. Finally, a case for understanding the utility and power of TDD in clear way. Thanks, Adam.

[joumanax]

Great tutorial! I just recently found out about TDD but haven't looked into it until you posted this. Thank you for this intro! :)

[keifer]

This was great. I'd love to see more of this. Maybe a slightly more complex set of react tests to mimic a professional working environment

[HarshSingh-llsq]

god bless you man never got so much clearity

[midclock]

This is an awesome explanation! Other than TDD applied to a real world example, it made me understand a little more about how React works (I used to work with Vue.js before)

[OtisDeLarge]

I found this very helpful. Thank you.

[LunaSmithArt]

A lovely introduction to TDD with React. Nicely done and simple to follow. Can you make a video with TDD/React and Typescript? Happy Halloween 🍭🎃🍬🐈‍⬛

[lezboy]

Really nice tutorial, helped me a lot! Keep up the nice content, you earned a sub :)

[manishamuskan]

Awesome video... One request though - Please make a video where we can test advanced features like mocking a server request, routing etc with the same TDD approach...

[desajustecreativo]

Writing the list of tests ahead of time breaks the second rule of TDD: “You are not allowed to write any more of a unit test than is sufficient to fail”

[stamatispsarras]

I am not familiar with React but this video made me understand it better, since you were building it in small steps. TDD FTW. BTW I do not understand why you had to test if you clicked twice? You never proved that this test was failing (other than when it was simply throwing an exception). In my understanding of TDD, you need to write a test completely, prove that it fails. You did that in most scenarios, but not on the ones you were checking for multiple clicks.

[ElderESG]

What happens if you have more of the same text on the screen. Maybe make a tutorial on a more complex project. Thanks!!!

[Ricardoromero]

I mean, this shows the workflow of TDD very well... but that's kind of obvious. When you get a feature request, how do you decide what tests to write? How do you write good tests? How do you avoid writing a bunch of useless tests?

[damindadineshimaduwagamage]

in TDD, how do we know if the tests are correct?