Front end web development seems a good place to start, but what is it?
Becoming a programmer: Diary entry #3
After a few weeks of hesitation, floundering around trying to find an entry point to the vast world of programming, I settled on HTML (because its the simplest place) and frontend web development (because it logically progresses from HTML).
But what is front end web development and what does it entail?
The more I read, the vaster this field seemed to grow. It’s not just HTML. More than this, it’s not just learning some programming languages. There are a whole range of skills (hard and soft) and what appear to be entire standalone sub-sectors that frontend web development encompasses.
I immediately heard voices in my head shouting: “Which skills should I learn? In which order? To what depth? From which of the myriad of online resources? How long is this going to take?” I kept reading.
Front end web development, it would appear, is everything you see of a website in your browser, and a little (a lot?) more...
This includes how the content is presented and the ways in which users can interact with the website, such as navigation bars. This part hinges on ‘user-facing code’ which is written using three core languages that complement each other: HTML (Hyper Text Markup Language), CSS (Cascading Style Sheets), and JavaScript.
You’ll need to be fluent in HTML, CSS, and JavaScript as a minimum.
Later, as you get more advanced, these languages are supplemented by ‘frameworks’ (which we discuss in a later entry) such as Bootstrap and EmberJS and ‘libraries’ (which we will also discuss in a later entry) such as jQuery and LESS.
Front end web design also includes a plethora of non-code skills that you’ll need to become adept in.
After dealing with HTML, CSS, and JavaScript you will also need to know a number of non-code skills. Without going into exhaustive detail, and depending on the size of the team on a given project(if you have one), you might need to be able to:
- understand user experience principles and conduct user testing;
- design and present wire frames, story boards, and user and process flows;
- understand and take decisions relating to information architecture;
- factor in search engine optimisation to ensure users can find your website;
- manage projects and client relationships;
- work in an ‘Agile/Scrum’ development process;
- manipulate and manage the images you want to use on a website using software such as Gimp or Photoshop;
- factor in accessibility considerations to ensure sites can be accessed by users with differing abilities (e.g. visual, mobility, and cognitive impairments);
- handle visual design elements, possibly including the creation of a style guide for a site;
- draft content and outline and manage a content strategy;
- and more…
For now, here are my three favourite resources for better understanding front end web development.
- Dungeons & Developers
This website playfully demonstrates the range of skills a front end web developer needs to have through an ‘RPG-style talent tree for web developers’.
2. Web Developer Roadmap — 2020
This web page presents a chart demonstrating a path a front end web developer could take in 2020 and gives an idea of the landscape. Don’t be put off: the page is very extensive and covers more or less everything there is to learn — you don’t need to know all of this in the beginning (and perhaps not ever).
3. Three Web Dev Careers Decoded: Front-End vs Back-End vs Full Stack
This web page clearly and succinctly explains the differences between front end, back end, and full stack.
And with this, I continue with my career transition, in a state of trepidation about the amount there is to learn, and pressured by the want to get working right away.
