How I'd Learn Front End Web Development Now
When I started out with doing web stuff in 1999, things were very different, much simpler in some ways but much harder in others. So, the way I gradually learnt was quite different from how somebody would learn now.
Back in my day...
So, there was a lot less to learn but learning was harder. There wasn't great documentation online, or, at least, not easy to find, so I used books. Cross browser compatibility was hard.
In short, it's a completely different landscape now. So, I thought it would be interesting to think about how I would learn or advise others to learn if starting out now.
This is a critical area that is often overlooked. The web is a universal platform that should be for everyone, not just for those with good eyesight, expensive devices and fast networks. We need to consider how we deliver content that works for all.
It's definitely worth learning this from the beginning so things are done in the right way as it's harder to correct bad habits later. Being able to demonstrate an understanding of accessibility will put you ahead of other candidates who have skipped over it when it comes to job hunting.
It's rare these days that we can create a web page that will be for a single screen size, so we need to know how to make a user interface that looks good on a big desktop screen and a phone. This is a whole area that is again worth tackling fairly early on. It's a bit of an art, a collection of techniques and tricks that are not easy to discover. This is an area that would probably benefit from a course.
Source control and package management
Once you've got enough of the basics to make something amazing, you'll naturally want to share it with the world, and then you'll want to make use of your amazing thing or other people's in your future projects.
Source control is about publishing code but also collaboration - reviewing each other's code, branching out and merging it back together. The most commonly used system for this is probably git. Worth reading up on.
Package management is about bundling up your project into a package that can be easily exported and then imported into other projects. The most common platform for front end code is npm.
These two areas usually involve using the command line, a terminal where you type commands to make things happen. It's not as scary as it looks and makes you look like a proper hacker to those not in the know.
Probably later than some would expect, but I genuinely feel the other things are more important to get good longer term. If you learn a framework too early their way of doing things becomes your normal and then if you change framework you have to start again. If you understand the core technologies then you can see what the framework is giving you and can adjust more easily.
CSS frameworks can be very useful for providing ready-made styling, bringing consistency and the CSS is well structured. It's a good way of learning how to structure your own CSS for larger projects.
There are also UI frameworks and design systems which provide complete components ready to use.
With all of these frameworks, there's lots of time saving and knowledge to be gained but it's important to remember that these are just someone's opinion and one way of doing things. There is no single right way or best way.
Extending the basics with pre-compilation
I'd say that's probably everything you need but there are a couple of other bits that are cheap to learn so worth throwing in there - more skills to boast about can't hurt.
Sass is a superset of CSS - it's CSS with added bells and whistles. You write in .scss files, making use of the fancy additional features and then it gets compiled to normal CSS. The great part is that it's additional features, not a different language so CSS is valid Sass. You can start out with a .scss file, just write normal CSS and it gets compiled to CSS. It's a bit pointless but means you can start off with nothing and then gradually learn and use Sass one feature at a time. It's a nice easy learning curve.
With both of these, once you get into the new features you'll never go back.
Then, anything goes
Once you've got these skills, it's really an open playing field. You can learn whatever takes your interest, or maybe whatever your job needs.
Let me know if you'd do things differently.