How I escaped tutorial hell

When you are first learning to code, you discover a place in your journey that is referred to as tutorial hell. You may not realize you are in this place until you get out of it.

What is tutorial hell?

Tutorial hell is referred to as a time in your new developer journey where you are watching tutorials, able to follow along, and replicate what the instructor is doing and it works. Sweet, so now I want to make my own variation of this so I break out a fresh project npm create-react-app awesome-app and try to pull from an API just like in the tutorial and it just won’t work.

The reason why is because the instructor planned their lesson, tested it ahead of time, knew which libraries to use, knew which functions needed to be made, new which abstractions would be used, and they tested it before they built it again and recorded it. The catch here is that the instructor went through the debugging and troubleshooting Part that you are stuck in right now the first time and they figured it out, but they only show you the working version.

This is similar to taking a driving test in the US, you’ve at least driven the car before and know how to operate it before you have to do it with someone watching who will determine if you performed well enough to be a licensed citizen.

The Escape

To escape Tutorial Hell, one must first realize they seem to be stuck in a loop.
If (editedTutotialCode !== success) return “watch another tutorial”
For your escape to be successful, you have to realize one thing, you have to realize what you don’t know. You watch the tutorial and it works, but if you think deeper you’ll realize you don’t know the libraries being used or aren’t familiar with a specific function or hook that was used. For example, if you followed a tutorial on fetching data from an API and the tutorial used a new library called Axios And this is your first time working with it. You then branch off from this tutorial and try to fetch data from another API Using Axios and your not getting the desired result. The problem is either in your knowledge of the library or the API being used and you must accept knowing that you don’t know how to use this library.

The solution

It’s important to understand that reading the documentation is actually really important. Take a moment and read that line again. The problem you are having is not unique to you, almost every developer goes through this at some point in their young developer career. The issue you are experiencing is simply not understanding the language, library, or feature before trying to use it. You must dedicate time to learn why a piece of code works before you can attempt to use it in your own product. The same would be if you copied code from StackOverflow and it worked, but why would you put that into production code if you don’t understand what it’s doing or why it’s working.

In the above example regarding Axios, let’s imagine you have never used this library before. You have two choices, watch another tutorial where the instructor uses Axios to fetch data from another API or reading the library documentation. If you read the library documentation your amplitude for success just increased exponentially because you are now learning how to properly use this library and can apply this knowledge to any future project where you have to pull information from an API.

One example from personal experience. I was trying to understand React Hooks after seeing it in a tutorial. I tried to use what I learned from a tutorial on the useEffect() hook. The problem I ran into was that it wouldn’t function how I wanted or though it would. I figured I must have understood this hook wrong and watched more tutorials on useEffect hooks and I still couldn’t make it work in my application. I did this several times and still was running into issues trying to apply what I saw in the tutorial in my own application.

What worked?
Going to [https://react.org/learn](React Learn) and reading their documentation on hooks, and the useEffect hook itself and then I began to understand how to use the hook properly. There are three different uses of the useEffect hook and they have major differences on their affect in your code. I can now effectively use the useEffect() hook in any project confidently. This was a growth moment for me where I learned to read documentation and stop watching Tutorials and escaped tutorial hell.

You can have all the tools in your garage for building a house but that doesn’t mean you know how to build a house -Chris Benjamin

This is to say that anyone can possess the tools but this doesn’t mean you possess the knowledge. Take the time to educate yourself and level up your own skills, your future self will thank you!

Takeways

• Stop watching tutorials and following along
• Start reading official documentation
• Start understanding why it works and how it works
• Know how to use the tools in your toolbox