DevTips React JS Tutorial Series

Published on:
Feb. 11, 2018

I’ve spent the last year and a half trying to learn how to turn ideas into real things with code. Along this journey I found a Designer/YouTuber/Web Developer named Travis Neilson. Travis is the host of a great YouTube series called “Dev Tips for Designers” (DevTips, for short). DevTips is a series that focuses on front end web technologies and how to use them to build beautiful web pages.

The most recent mini-series has been a guest-hosted segment on React, a JavaScript framework I’m trying to wrap my head around. The series is hosted by MPJ and David, who each host their own developer-focused YouTube series. I followed this series, and made a little app to display Spotify playlists. Once it’s deployed I’ll add a link to it here.

Tutorial Summary

Unlike the last course I reviewed, the DevTips series focused on building one (relatively) large app rather than several small apps. Over the course of 16 videos, MPJ and David go through the process of building a Spotify playlist client step by step. Each video picks up exactly where the last one left off, and by the end of the series you will have made your own single-page app to display and search your playlists.

MPJ acts as the “teacher” and David as the “student” throughout these videos. I’m not sure if David was actually unfamiliar with React at the start of the series. If he wasn’t, he does a good job of asking questions and challenging techniques presented to him when they aren’t clear. Having a person on screen acting as a proxy student helps keep the lessons on track and gives MPJ an opportunity to repeat or rephrase things when needed.

The Good

The presentation of the material was great. I liked the two-person approach. It helped to break the monotony of listening to a single voice for hours, and I really buy that David was learning React along with me.

The project also had a good level of complexity for a tutorial-level project. The app itself was interactive, and the code architecture showed the core features of the React framework working together really well. In particular, this tutorial series did a good job of demonstrating how to manage an app’s state so that components can work interactively without needing to pass information back and forth directly.

It was great to spend an extended time working on iteratively improving a single app rather than making a bunch of small apps. I feel like I got my hands on more useful parts of the framework in these 3.5 hours than in the course I reviewed previously.

The Bad

Code cleanliness and organization were not a focus in these videos. The purpose was to make a prototype, and MPJ clearly stated he was going to ignore some best practices in order to get the app working quickly. I still think the app could have been organized better.

Every component used in the app was in one long file, which made it difficult to find what I was looking for sometimes. David even commented in one of the videos about it being difficult to find a particular thing he was looking for. Not splitting components into separate files for readability may have been a missed teaching opportunity.

The Bottom Line

The above comment about code cleanliness is honestly the only bad thing I could think of to say about DevTip’s React tutorial. MPJ and David did a really good job here. Each video is a complete unit, and the whole set remains cohesive. If you’ve already done the Official React Tutorial, this DevTips tutorial is a great next step. I feel now like I’m ready to start working on a hobby project of my own.

9/10 — Would highly recommend.