At the beginning of 2020, my wife decided to learn Web Development and so she asked me where she should start.

Needless to say, I was excited to have someone so close to me to talk about something I love (and also to use as my guinea pig to see if my suggestions work for her! 😂 )

I helped her make a plan/roadmap to learn the basics of web development, starting with the Front End. Now, almost August 2020, she said she is having A GREAT time and the plan I elaborated is working like a charm!

So I decided to share this with you. Who knows, it might help other people too!

ENOUGH with the background story, here is the plan:

1. Responsive Web Design

Learn the basics of HTML, CSS, Accessibility (and so much more).

Where: Free Code Camp has an amazing platform to learn this. But I recommend you get this certification by following along with the amazing Florin Pop. He has videos where he goes through all the challenges on FCC and helps you solve them with no rush and lots of patience.

First video of the series:

Florin is kind, knowledgable and fun! (Make sure you follow him on his social media)

2. CSS - In Depth

In the last step you would have played around with some very important concepts but now it is time to get serious.

Where: Check out this incredible Udemy Course called:
👇👇👇
CSS - The Complete Guide.
☝️☝️☝️
In this course, you will see all the key concepts of CSS covered in depth. Important things like Flexbox and CSS Grid will be expanded upon compared to the previous step. Max definitely knows what he is talking about and will make complex concepts seem easy!

3. Build, Build, Build

Now you know A LOT and you probably followed along building several projects. Now it is time for you to build your own projects. It doesn't have to be the next Twitter or Netflix, but build 1 or 2 small projects where you put everything in practice.

DON'T FORGET: Upload your work to Github so other people can see it. Here is a tutorial on how to push to Github and make your projects live: A Guide to using Github Pages.

4. Looks + Functionallity

If you made it this far you are on 🔥

Your websites probably look amazing but now, they need to do something, right? The buttons, forms, even simple calculations, all that requires scripting/programming. Otherwise, the website is just static art.

This is were learning JavaScript, the most used and beginner-friendly programming language there is, comes into play!

Where: Another Udemy Course.
👇👇👇
The Complete JavaScript Course.
☝️☝️☝️

This one is taught by the patient and thorough instructor: Jonas Schmedtmann.

5. Solidify your knowledge - AKA Build some more!

The more you build, the more chances you have of retaining the knowledge you just obtained.

Where: Probably one of the people who has contributed the most to the Development community is Brad Traversy, and not a long time ago he decided to bless us with an awesome Udemy Course called:
👇👇👇
20 Web Projects With Vanilla JavaScript.
☝️☝️☝️

Believe it or not, that's it. If you follow these steps you will know enough to call yourself a Front End Developer!

Of course, there are a lot of things you could add, like a Framework, a CSS pre-processor, bundlers, and transpilers. But with HTML, CSS, and JS, you have enough to become employable!

Time: 6-7 Months

Budget: ~40$

BONUS: Be active in the community. Tweet about your journey, cheer other people, and learn from others. Have a professional LinkedIn Profile

DISCLAIMER: Make sure you build your own projects and not only follow along coding what others are coding. Pause the videos, attempt the solution yourself and if you get stuck, only then play the video to see how they did it.