My Frontend Development Learning Path - With Resources

My Frontend Development Learning Path - With Resources

It's been about two years since I first wrote my first line of code and about a year since I started coding professionally, it's been a fun-filled experience full of hard work, commitment, rejection, doubts, imposter syndrome, and every other mix of emotions.

One of the common problems people face when starting out and even after being waist-deep in tech is figuring out the right way to go, the right stuff to learn, the right courses to buy, the right people to look up to, and the right path to follow. It never ends.

1. Javascript Full Course For Beginners By Beau Carnes x Freecodecamp

This is where it all started. In January 2020, I decided I must become a programmer. I wasn't sure of what to do or where to start so I did a few google searches and ended up choosing Javascript because I was told it could do everything.

I searched youtube for beginner courses and found this masterpiece by Beau Carnes. This course taught me the basic concepts of programming/javascript, I learned how to declare variables, use functions, and many other basic concepts. The ending parts of the video were a whole lot more confusing but I watched the full thing anyways.

2. The Complete Web Development Bootcamp By Angela Yu

I got this Udemy course from Angel Yu because a friend I met at discord recommended it. The course is well structured but lacks deeper concepts. I learned basic HTML, CSS, and bootstrap and proceeded to build the popular Tindog code along the website using bootstrap. I also learned more about javascript here and how to do basic DOM manipulations. The pandemic started while I was on this course so after I completed it, I did a personal project with bootstrap, a portfolio website- my first ever personal project lmao.

3. Javascript For Kids - An Ebook By Nick Morgan

Stumbling on this pdf was very random. I think I was just doing google searches and ended up with this one. I decided to read & study to learn new stuff.

Halfway through this book, I had to recheck the cover multiple times because if you read the things in here to a kid, that kid will be scarred and depressed for a lifetime. The book should have just been "Javascript", the poor kids don't deserve anything inside it.

I learned more javascript concepts, jQuery, DOM manipulation, etc. After completing this course, I built a web game, I think treasure hunt or something is the name. I don't remember where the link is but it's a game that shows you a treasure map and you have to click till you find the spot where the treasure is.

4. Modern Javascript From The Beginning Okay, enough with the javascript already !!??

So something I noticed among newbies is, at this point, most are already jumping into different frameworks. Well, that's not a completely bad idea but for me, I still felt like I know nothing when it comes to programming with javascript so I decided to search further. While searching, a friend recommended this course by Brad Traversy! and honestly, it is one of the best courses I have ever set my eyes on.

I STRONGLY recommend this course to everyone who's finding it hard to grasp all the aspects of javascript because Traversy went from the very beginning down to advanced concepts and he took time to explain every section one after the other. From learning how to use var, let, and const to advanced DOM manipulation all the way up to exploring javascript architecture patterns, I realized Traversy on Udemy is like Traversy on Youtube but with adrenaline, monster energy drink, Redbull, PowerHorse, and Nitro combined.

After this thriller with Traversy, I knew I was ready without any doubts. I did a number of projects after this course. Ohh, and I also enrolled for my first internship a few days after completing this course.

5. Responsive Web Design Course - FreeCodeCamp

There isn't much to say here. When I was searching for where to understand CSS, Grids, and Flexbox properly, I visited FCC and they didn't disappoint.

Most of the things I know About CSS today are just this course, flexbox froggy, CSS tricks blog (God bless this team massively) and MDN docs, and reading other people's CSS codes to discover new rules.

6. Vue Js Crash Course

So during one of my internships, I got added to a project where Vue JS was required. I had gone so far in the internship even without knowing any frameworks but at this point, I was forced to learn Vue JS. Even though I knew React was what I had on my learning bucket list, I felt I could give Vue JS a chance to see how it goes.

7. React Front To Back - Brad Traversy Yeah, I finally felt ready enough to join the bandwagon.

I found Traversy's videos so appealing so anytime I'm trying to learn something new, I always append "Traversy" to my searches. I got this course on udemy and finally got started with React JS.

I learned to react to a moderate level in this course and also built a few practice projects. I found react easier to understand than Vue JS, honestly don't know why it had to be the opposite for me cus people always say Vue is easier to understand.

8. Introduction To Next Js - Scott Moss x FrontendMasters

I was introduced to this course by Seyi early this year, in January I think. Scott Moss did an awesome job in teaching the basic concepts of how Next Js Works as well as Server side rendering (SSR), Client side rendering, and Static Generation (SSG) and he also explained when to use which. So if you're confused about all these buzzwords, this is the right course for you.

I must mention, that The Next JS docs are one of the most comprehensive I've come across so if you're pretty solid in react, reading the docs alone could make you really good in Next JS.

9. Complete React Developer By Andrei Neagoie

I got this udemy course earlier this year just because I felt there's still a lot I need to learn about in react and one thing that caught my attention in the course outline was "Redux". I never really had a need to learn redux up until the day I wasn't considered for a job interview just because I have zero experience with redux. So I got this course because It promised to teach me redux alongside every other thing I need to know about react.

In the end, it was well worth it, I learned advanced react, PWAs, HOCs, React Architecture patterns, Redux, learned more about firebase and security rules and configs, learned how to set up a Gatsby site, learned how to use redux sagas and redux-thunk middle-wares properly, learned how to optimize for performance in react, how to create custom hooks, and a lot more. In fact, I would say this course is a better option than Traversy's React Front To Back course which I mentioned above.

Even though this course clearly covers more topics than the React Front To back course, I recommend getting both and watching react front to back first then proceeding to this one because this one's a little bit advanced and you'll easily get lost, frustrated, and discouraged if you haven't had moderate experience with react before. Wouldn't recommend this for a complete beginner.

10. CS50

This is Harvard University’s introduction to the intellectual enterprises of computer science and the art of programming, for concentrators and non-concentrators alike, with or without prior programming experience. This course teaches you how to solve problems, both with and without code, with an emphasis on correctness, design, and style. Topics include computational thinking, abstraction, algorithms, data structures, and computer science more generally. Problem sets are inspired by the arts, humanities, social sciences, and sciences. More than teaching you how to program in one language, this course teaches you how to program fundamentally and how to teach yourself new languages ultimately.


Bonus tips: one thing you should know is, that watching so many tutorials doesn't help you get better, what helps you get better is doing stuff/practicing/building with whatever you've learned in these tutorials.

After completing the react course, I didn't just stop there, there are a lot of articles, short videos, googling, and READING DOCUMENTATION in between.

Frankly speaking, getting to this point (I mean having followed through all the courses I mentioned up there), you're now like an 18-year-old Indian High school graduate because you're now almost certainly On your own. Nobody will spoon-feed you with courses for basic stuff anymore, you'll have to figure out what tools you need to use for your next projects and READ THE DOCS! (or maybe watch a crash course on youtube but you get the point, reading documentation is a high-value skill).

Most times, you watch tutorials and the tutors just install a library and start using it like they have some superpowers or they know something you don't. That's not true, most times, it's because they have read the documentation before making the tutorial videos. Nobody stores all the syntax for libraries and tools in their heads, as long as you know the basics and can read and know where to find the docs, you'll be great.

I hope to share more articles like this as time goes on because - Learning never stops! WAGMI 🙏🏽

Did you find this article valuable?

Support Blog | Ritesh Kumar by becoming a sponsor. Any amount is appreciated!