Getting Out of Tutorial Hell
Tags: webdev, programming, tips, beginners
Published: 2021-02-16 14:35:28

_Disclaimer: Most of this article is based from my personal experience, so I don't guarantee it will work for everyone_



Tutorial Hell can be, well... Hell. And many of us have been there following along many courses, YouTube videos and such, and thought "Wait, what am I doing? Is this enough?" because you've realized you have your computer's dev folder filled with "X tech crash course" or "Flexbox Landing page" and you keep doing it because you're not confident enough to start something from scratch, it's easier to follow and code along the tutorials or something else.

Until about a year ago I was in that position, and it sucked. And thanks to (mostly) Twitter's and YouTube's algorithm, and DuckDuckGo and Google, I got out of this Hell and arrived the where I am today. Of course, I'll keep going forward and look some tutorials of I'm hard-stuck somewhere. 

Now, to the juicy part of this (already big) wall of text, what I did to get out (**Note:** These are in no particular order of priority/importance):

_Disclaimer 2: I'm not trying to say it's easy, but I think this will help to take the first steps._
<br>
<br>

## Coding Challenge sites.
This one's pretty direct. These sites provide you with intructions and the challenges are rated bt difficulty, that way you can try your skills in various levels. Some sites like these are:
* [HackerRank](https://www.hackerrank.com/)
* [Codewars](https://www.codewars.com/)
* [devChallenges.io](https://devchallenges.io/)
* [Frontend Mentor](https://www.frontendmentor.io)

Of course, there are more out there (and maybe I'll talk about them in the future), but these are the ones I've known and used (specially devChallenges and Frontend Mentor).
**Note 2:** If you're going to put the challenges don't put them separately, make sure you have a mini portfolio of those. That way you have a nice way to show them instead of having them scattered all over the place.




## Copying/cloning existing sites.
A few times you've arrived to a site and thought _"Woah, this site's nice/well done"_, right? Well, what better way to practice your skills and take another step out of that Hell than to copy that site?.
_"But it has a lot of components, animations, transitions, etc."_ Alright, stop, look through the whole site, make a list of the parts it has (kinda like a dissection of it), and begin to code one part at time from top to bottom. If you're stuck you can always google it, just take yout time and code at your own pace.
It's not about making a 1:1 copy of the site per se. It's more something like "Alright, what can I do here?" type of situation. It's also a nice way to start compartmentalizing you process for future projects.


## Use the tutorials as templates.
Alright, before you frown at me, hear me out. What I'm trying to say here is that you can use what you did in the tutorial/course as a base to a bigger or another project. That grid you did following that Youtube video and you liked the result? Use it! But add your own personal touch to it (this are the small letters in this part), same process with any other part you did in another tutorial (or even the same). Here the trick is adding your personal touch to the final product.







---
Aaand, done. I think this is a fairly good start and most of the stuff you make with the challenges or clones of those sites can work for your portfolio if you have nothing to add there yet.