Hi everyone! Like OP I'm new here and after having a look around I stumbled upon this thread. You guys really seem like a welcoming and helping community. As a new member and self-taught web dev I would like to contribute my 2 cents to the discussion. This might end up being lengthy, so I'll provide a TL;DR at the end.
Disclaimer: I stared learning web dev at the beginning of 2021 with no prior programming knowledge. I'm currently doing interviews for a junior web dev position. By no means am I an expert and my words should not be taken as gospel. With that out of the way, here's what I did, what I should've done, and what helped me:
Colt Steele's Web Dev Bootcamp on Udemy - my first foray into the world of web development. I have nothing but good things to say about the course, save for the abrupt ending, but that might've been fixed. Colt explains the concepts in a very well structured and entertaining manner. They are also easily digestible - every video is no more than 10 minutes. It is a good and meaty tutorial that will take through HTML, CSS, JS, as well as some basic backend tech like Node, Express, and even MongoDB. Can't go wrong with this course, especially for 10 euros.
Jonas Schmedtmann's Complete JS Course Udemy - also a good one. While his delivery is more dry, the concepts he teaches are very in-depth. Going in I thought I had JS more or less nailed down, however this course showed that I still had more to learn. It is entirely JS focused and it teaches you the ins and outs of the language. I've also had personal correspondence with Jonas regarding a project of mine and the guy has been very helpful. Recommended.
CodeWars - website where you can practice and master JS (among other languages) by completing small challenges. Has a quasi-competitive nature and is gamified. For a while I got addicted to solving problems there. Best part is after you finally figure out a solution you get to see how other people solved the same problem. Some of the solutions are truly ingenious and I've learned a lot from seeing them. Definitely recommend as I've improved my problem solving skills and learned the JS methods by heart. Some might say that you don't need to memorise a language's methods, however if it's your first language I believe you need to learn them and have them in mind. Helps knowing what's in your toolbox when you're solving a problem.
FCC - I've done a lot of the courses there - HTML, CSS, JS, and partly React. However in my experience it is more of an auxiliary resource as it only provides a very condensed and summarised explanation for the majority of the concepts. It's good practice and the final exams are a good call to action, however I wouldn't rely on it alone. I did it when I already had Colt's course under my belt so I had prior knowledge. The React course was taught with classes, which some consider outdated. IMHO functional React with hooks is more comprehensible. Don't bother with the certificate. If only for personal satisfaction, otherwise it's useless. Recruiters don't care about it and it's not recognised anywhere.
Youtube - Traversy Media and my favorite, Fireship. Both of them do a marvelous job explaining things and have very hands-on courses. Traversy for longer, more involved projects, Fireship for new tools, concepts, and memes. Really, the guy is an amazing teacher and deserves every subscriber and then some. Several of my personal projects were build upon the foundations that I learned from them. Shoutout to Jomatech as well - fun quality videos with a programmer theme.
Odin Project - like some have already mentioned it's a very good and hands-on approach to learning. Almost every lesson has some kind of interactive hands-on section and to my knowledge they update it frequently.
Books - Think Like a Programmer by V. Anton Spraul and JavaScript: the Definitive Guide by David Flanagan. Think like a programmer is a good book if you want to learn basic and advanced programming pattens. After all programming is about patterns and with time you learn to recognise and apply patterns. Be warned that the book uses C++ for the examples, but it's a good resource nonetheless. You will also get to see how easy we have with JS. JS the definitive guide speaks for itself - it's a solid book that goes in-depth and provides ample examples. Haven't finished it yet so I can't give a proper opinion, but so far it's been useful.
What I should've done - working on my own projects earlier. A cliche, but I should've gotten my hands dirty much sooner. Tutorial hell is a real thing and it is not easy to get out of that comfort zone. But I can say with certainty that I did not learn proper web dev until I applied my knowledge. For example I learned React by making my own project. Going in I had vague idea of what React is. But by actually building something I gained a much more in-depth knowledge of the framework and also realised that my initial idea of React was wrong.
Working by yourself and escaping tutorial hell - It's going to be hard. You'll get frustrated, you'll feel stuck, you'll lose time. You might even be tempted to give up. But you'll need to plow forward and overcome those hills and valleys - the Dunning-Kruger effect is a thing and you will experience it. Often you'll have problems with an element or a particular piece of JS in the evening, but then in the morning you'll figure it out. That's the magical thing about our brains - even when we're not actively working on something our brain still does in the background.
If it's any solace (it was for me, regrettably), there are a lot of "seasoned" programmers out there that don't know basic stuff. I've met them, I've seen their tutorials online. A number of times when I'm looking for an article on how to use a feature or how to implement something I will stumble upon a confidently written post that is flat out wrong. I don't mean the implementation is inefficient or it does not follow DRY principles. Flat out "React does not allow that" wrong. So you don't need to know everything and not every programmer out there is a genius whiz.
It's tricky to figure out what project to make, yes. But I'm sure you already have some small projects that you created by following a tutorial. These are a good start. You can use them as a foundation and add features. Another tip is to ask friends and relatives if they need a website. Chances are you will get some clients that way. Everybody needs a website these days. My advice would be to not do it entirely for free, but to have some symbolic sum. This way both you and the client will be held accountable and you will be invested into completing it.
Creating your website is daunting. If you're building one from scratch, make sure to learn some basics of UI & UX. Kevin Powell on Youtube has some nice tutorials that can teach you the basics of white space, hierarchy, colour palettes, etc. in a short amount of time. Prototyping the website and creating a mock-up is an immense help and I wish I learned that sooner. Having the design done before even a single line of code has been written is a huge relief. Figma is the way to go - it's free, it's intuitive, and it's not made by Adobe.
Don't linger and tinker with your projects, you'll waste too much time polishing a turd. Your first website will likely suck and that's ok. You'll return to it after some months or even years and will get a kick out of how far you've come. MVP (Minimum Viable Product) - as soon as it works put it on the web. It doesn't need to be perfect, it needs to work. Netlify is a good option for free hosting. It also has continuous Github integration. Meaning you can update the already live website instantaneously.
Github - get in the habit of the git routine. Upload your projects and do regular commits. It will allow you to have an easy to reference library of your projects and will show recruiters that you are active. Anytime you added a new feature or are done with developing for the day, push it to Github. Also serves as backup for your work in case something happens to your machine.
Frameworks - they're cool, they're useful and they can make your life easier. But before jumping into one make sure you have a firm grasp on JS. JS is the foundation and it needs to be solid. Same goes for CSS - Bootstrap, Tailwind, Stitches are good, but you need to know the basics first. Without a solid foundation you will be hampered down the road and will have to re-learn how to walk.
Choice of framework matters, but as long as you have one of the big three (or two, depending who you ask) you should be fine. Advice I heard many times is to look at the job postings in the geographical area you want to work in, see which one is the dominant one and go for that. Don't be afraid to explore and play around with other frameworks and languages. Be curious. It's not a marriage, it's a polygamy. For example, if you enjoy music you can try Sonic Pi - it's a tool that allows to write music using code. It's Ruby-based so the syntax is very easy to grasp.
Guess that's it. Hope this helps you and anybody else who stumbles in here.
P.S. I wasn't sure if we're allowed links so I omitted them. I will add them if necessary but all of the referenced resources are easily searchable anyways.
TL;DR There is a ton of quality resources out there and you need them, but make sure to get your hands dirty. Use Github, start your own projects, make a website for a friend, put it online, move on to the next. Practice your JS, be curious about new technologies. It's going to be hard, but rewarding.
![[Ebook] Largeapps Dev - Building Large Scale Web Apps | A React Field Guide](https://i.imgur.com/CKxZPRy.png)
