EVERYTHING you need to start your WEB DEV journey !
The guide for the ones who love to learn by reading and for the ones who love to learn by watching tutorials !
Table of contents
Have you been procrastinating to start to your web development journey as a beginner or someone who's looking for the right resources out there to learn from ? Well, congratulations ! You have come to the right place.
The world of web development has a ton of resources to learn from and this eventually will start feeling overwhelmed and confusing on what resource should I lock onto and learn from. I've been in that situation and I know how it feels. That's the reasoning why I'm writing this so that you don't need to go through that mess.
I also want you to understand that it doesn't matter if the language, framework or anything that you are learning right now will exist in 10 yrs from now.
What matters is that it exists now and technology is being built on it.
Ask any senior developer who used VanillaJS and jQuery before all amazing JS libraries and frameworks that we now use, even existed. Or ask them how hard it was to center a div in CSS back in the days. Now we can use
margin: 0 auto and you have your div centered. You can achieve the same by using flexbox, grid and CSS frameworks, but the point here is, tech stack keeps evolving, it keeps updating and it's your duty as a developer to stay updated in the tech stack you use.
Its okay to get overwhelmed but PRACTISE, PRACTISE & PRACTISE. That's the only way you can get comfortable with it. Best of Luck !
The Resources
All the below resources mentioned are the ones that I found worth learning from. I also would like to point out that I will not be throwing a lot of resources out here because as humans, the more options we are given, the more confused and 😖 we feel to learn.
Note: I will try to keep this page updated as and when I find new amazing resources to learn from.
Let's start with the basics of Web development. Think of web development as a human body :
HTML and CSS
HTML is like the bare bones of Web Development. CSS is like the flesh, clothing and styling of Web Development. Learning these in a flow, together gives you a better understanding.
Resources :
To people who prefer to learn by reading : Learn to Code HTML & CSS- 101 - From literally baby steps to your first words, this is where you will learn all the required basics. I do want to mention that CSS is highly verbose, meaning there's a long list of properties that you can use to achieve similar results. CSS Reference is a website where you can understand the use cases of several popular properties visually. Refer it when you need it.
For people who prefer to learn by watching videos : This HTML Crash Course and CSS Crash Course by Brad Traversy covers pretty much everything you need to know about HTML and CSS.
And to practice what you have learnt, take up easy challenges on Frontend Mentor and solve them. Note that there will be tags on the card of the challenge that shows what skills you need to have before you attempt to solve it.
JavaScript
The brain and functionality of Web Development. This is where you will be spending more time learning. JavaScript is vast. You won't be mastering it right away. So, take things one step at a time and learn the core concepts. This will help you later when you start learning the frameworks.
Resources :
To people who prefer to learn by reading : JavaScript Tutorials - This website is simply all that you need to learn the basics of Modern JavaScript from scratch. If you would like to have a more detailed guide for learning JavaScript, check out this twitter thread by Pratham.
For people who prefer to learn by watching videos : This Javascript Crash Course by Brad Traversy covers all the basics of JavaScript that you need to know for now. There's also an amazing playlist by Akshay Saini called Namaste Javascript. You should definitely go through this playlist !
Now that you have gone through the theory part, its time to put that into practice and evaluate yourself to understand where you stand in implementing JS practically. This is where I would recommend you two resources - 30 days of JS by Asabeneh and 30 days of JS by Wes Bos. I would recommend you to do one of these two ( or both, if you wanna get reallllllyyyy good at JavaScript). And again, Go to Frontend Mentor and solve easy challenges. Note that there will be tags on the card of the challenge that shows what skills you need to have before you attempt to solve it.
If you like to understand JavaScript in a much deeper level, read Eloquent Javascript first and then read You Don't Know JS. Best books and probably when you start meeting devs on discord communities and on twitter, they mostly will recommend these books.
Once you are good in HTML,CSS and JS, you can move on to advanced topics and frameworks. The sky is the limit !
BONUS SECTION :
Thankyou for all the people who read till the bottom. So, I have a special resource for aspiring web devs from India. I always believe in project based learning. But some of us need a guided course with a mentor like a bootcamp where you learn with other aspiring devs like you. For that, I would recommend NeoG Camp . Its a 2-stage camp where in the first stage called level-0, you will be taken through the basics and some advanced concepts of web development. You will be given projects to complete. This stage is completely free and I recommend you to take it as a opportunity to find out if you are really dedicated enough to become a Web Developer. Once you complete level-0, you will need to submit your projects and an simple interview will be conducted to check what you've learnt in level-0. If you clear level-0 interview, you will be eligible to get into level-1 which is a paid program. This is where you will be taught all the necessary skills to become a Web Developer in 6 months. They also train you for interviews and help you get a job. For more info, check out their FAQ section.