JavaScript
Article

Watch: Adding a Lap Logger to a React Stopwatch

By Michael Chan

Building a Stopwatch in React

Adding a lap-timer is no walk in the park, but what good is a stopwatch that only tracks one lap? We’ll take all we’ve learned about state, lists, and conditional rendering to add this new feature. When we’re done you’ll be running laps of joy around your computer and timing them accurately.

This is part 3 of the Building a Stopwatch in React series.

Loading the player…

  • http://www.soulmachine.me/ soulmachine

    Very helpful video!

  • matthew .d

    hi, why did you use concat() to add a lap in the array? I think you could simply have used push() ?

    • chantastic

      @disqus_Ikv0RbKw4d:disqus the difference is probably not important in this particular demonstration. i tend to favor non-mutative methods. push() adds a new item to the same array. concat(), returns a new array, constructed from the two arrays. in React I use map(), filter(), and reduce() constantly. all of those return a new array. using concat helps me think about Array concatenation the same way.

Recommended

Learn Coding Online
Learn Web Development

Start learning web development and design for free with SitePoint Premium!

Get the latest in JavaScript, once a week, for free.