Front end web development seems a good place to start, but what is it?

Becoming a programmer: Diary entry #3

Image by Vivienne Nieuwenhuizen, available on

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).

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.

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.

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.

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…
  1. 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.

Overcoming a fear of public displays of writing (PDW) while teaching myself coding and hoping to make a career transition.