Twitch Viewer Retrospective


The Twitch TV project was my first project that required multiple API requests on a single page. Twitch has since changed their API, so this page no longer works. I thought this project was really fun because I could search for a stream of a particular game and click through directly to start watching someone streaming one of my favorite games.

Though I'm not sure why I went with the eggplant and neon green color scheme!

Code Review

The HTML of this project shows that I started getting a firmer grasp on the grid system of Bootstrap to lay things out. Lots more rows and columns and some more complex nesting of grids and columns. I didn't do much with different sizes of columns, so that was a step back, but the page is quasi-responsive in a web browser.

The JavaScript is a little bit of a mess. The user stories required that the 8 channels in the left columns be populated with info on page load, so as soon as the document is ready, my JavaScript makes 8 different requests to the Twitch API. The portion that handles the search in the right column is very similar to the function I wrote for the Wikipedia Viewer. I'm using jQuery here just for making AJAX calls and grabbing HTML elements.

Future Improvements

Since Twitch has broken their API, and it looks like they plan on having another version released in early 2018, I doubt I do much with this app. It was a great learning experience, but keeping a learning application up to date in the face of constant API changes isn't worth the time.

  • Though it might be a little more of a challenge, I'd remove Bootstrap and try to layout this page with flexbox
  • Using jQuery here isn't necessary. I'd remove that dependency and use basic xhrs to make my API calls
  • I might try to find a way to make fewer individual API requests and group them
  • It might be nice to give this a little subtler color scheme