WebDev beginners..
So you learned HTML, CSS/JS and now you’re ready to move on to a framework. Most frameworks are building on top of basics, the better you understand them the easier you can understand the framework. The mistake I see most beginners make is moving on way too fast! They never seem to really grasp the basics.
Most of the time we breeze through the tutorial and we think that we know how to implement these things. We are fixated on finishing the tutorial instead of understanding the CONCEPTS that will help you build the same project, without the help of a video tutorial!
So how do I understand the basics better? Everyone says to build projects but what should you actually build? In order to build confidence you start with the from the ground up.
HTML
Don’t focus on knowing all the tags, just the most important ones!
Build boiler plates
Learn HOW to nest tags and WHY
Build Navbars! I used to build 3 Navbars a day in order for my mind to understand nesting better. Code everyday!
Learn keyboard shorcuts, learn about containers/divs and create multiple each day.
CSS
CSS is tricky, stick to plain CSS and don’t use any frameworks.
Learn Flexbox and grid. Learn these Separately!
For Flexbox, add to the 3 Navbars a day! Use Flexbox for layout. Once you understand flexbox and can make Navbars easily, move on.
For Grid, make a common photo grid 3x a day! Simple 10 minute project will help install the basics of grid.
Mix both grid and flexbox! Once you can make navbars and photo grids in your sleep, then move on to FULL PAGE LAYOUTS! Start creating simple one page website layouts. Make 3x each day.
Make a simple one page custom portfolio website. Using only what you know now, create a simple portfolio website. Implement what you learned and make mistakes.
The next day, recreate the portfolio website and add an additional page, like an about me.
By this time you should not only have a solid foundation on HTML/CSS but you’ll have real practice that your brain has already implemented as deep knowledge. Practice everyday! Don’t THINK that you know how to do it, go out and DO IT!!
Will continue with Javascript tomorrow..
Top comments (0)