Learning Should Be Fun: ReactJS + Twitch API Tutorial
Renaissance Engineer
Posted on July 18, 2019
How many todo apps and calculators does the world need?
Learning to code is hard, which makes it tough to stay motivated sometimes. It doesn't help that most beginner tutorials are almost always the same rehashed projects that are not only boring to follow but won't help you get a job
IMO the best way to learn is mixing together things you enjoy to create something new. One example would be combining programming with gaming by using the Twitch API
I made this tutorial with beginners in mind. Once you're done with this tutorial you'll have a number of options available to extend the base project to make something unique for your own portfolio. Some examples of features you could add:
- create a real time dashboard of stats using a charting library and making API calls every minute to update the view counts
- create a profile route and embed the stream instead of linking directly to twitch https://dev.twitch.tv/docs/embed/
- change up the styling on the cards used to display our data from the Twitch API
- add some error handling to handle stuff like API limits or outages
- add a loading component to wrap around our lists to show a loading icon until the API call has returned
- break out some of the repeated logic like replacing the URLs and make a List component and Card Component for the repeated UI logic
This tutorial does assume you have some basic knowledge of ReactJS, so make sure you've at least gone through the main Reactjs Getting Started Guide and understand the basic concepts of React like JSX, state management, and how to work with components.
When you're done feel free to leave a link to your project so others can see what you made.
Posted on July 18, 2019
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
September 2, 2024