Front-end web developer

Draft
This page is not complete.

Welcome to our front-end web developer learning pathway!

Here we provide you with a structured course that will teach you all you need to know to become a front-end web developer. Simply work through each section, learning new skills (or improving existing ones) as you go along. During each section you will find exercises and assessments to test your understanding before you move forward.

Subjects covered

The broad subjects covered are:

  • Basic setup and learning how to learn
  • Web standards and best practices (such as accessibility and cross-browser compatibility)
  • HTML, the language that gives web content structure and meaning
  • CSS, the language used to style web pages
  • JavaScript, the scripting language used to create dynamic functionality on the web

The different sections are designed to be worked through in order, but each one is also self-contained. If you, for example, already know HTML really well, you can quite happily skip ahead to the CSS section.

Prerequisites

You don't need any previous knowledge to start this course. All you need is a computer that can run modern web browsers, an internet connection, and a willingness to learn.

If you are not sure whether front-end web development is for you, and/or you want to get a gentle introduction before starting on a more complete course, you should work through our Getting started with the web module first, before going further.

Getting help

We have tried to make learning front-end web development as comfortable as possible, however you will probably still get to the point where you get stuck because you don't understand something, or some code is just not working like you think it should be.

Don't panic. We all get stuck sometimes, whether we are beginner or professional web developers. The Learning how to learn (TBD, LINK) article will provide you with a series of hints and tips for looking up information and helping yourself, and if you are still stuck, feel free to post a question on our Discourse forum.

Let's get started. Good luck!

The learning pathway

Getting started

Time to complete: 1–2 hours

Prerequisites

Nothing except basic computer literacy.

How will I know I'm ready to move on?

There are no assessments in this part of the course. Make sure you don't skip it though β€” it is important to get you set up and ready to tackle exercises later on in the course.

Core guides

Additional resources

List anything in here that is useful but not essential, for each section.

Semantics and structure with HTML

Time to complete: 35–50 hours

Prerequisites

Nothing except basic computer literacy, and a basic web development environment set up.

How will I know I'm ready to move on?

The assessments at the end of each module are designed to test your knowledge of the subject matter β€” completing each one will prove that you are able to move on to the next module.

Core modules

Additional resources

List anything in here that is useful but not essential, for each section.

Styling and layout with CSS

Time to complete: 90–120 hours

Prerequisites

It is recommended that you have basic HTML knowledge before starting to learn CSS. You should at least study Introduction to HTML first.

How will I know I'm ready to move on?

The assessments at the end of each module are designed to test your knowledge of the subject matter β€” completing each one will prove that you are able to move on to the next module.

Core modules

Additional resources

Interactivity with JavaScript

Time to complete: 135–185 hours

Prerequisites

It is recommended that you have basic HTML knowledge before starting to learn JavaScript. You should at least study Introduction to HTML first.

How will I know I'm ready to move on?

The assessments at the end of each module are designed to test your knowledge of the subject matter β€” completing each one will prove that you are able to move on to the next module.

Core modules

Additional resources

List anything in here that is useful but not essential, for each section.

Collecting data with web forms

Time to complete: 40–50 hours

Prerequisites

Forms require HTML, CSS, and JavaScript knowledge to use them effectively. They are complex, and therefore are given a separate treatment.

How will I know I'm ready to move on?

The assessments at the end of each module are designed to test your knowledge of the subject matter β€” completing each one will prove that you are able to move on to the next module.

Core modules

Additional resources

List anything in here that is useful but not essential, for each section

Making the web work for everyone

Time to complete: 60–75 hours

Prerequisites

It is a good idea to have knowledge of HTML, CSS, and JavaScript before working through this section β€” many of the techniques and best practices contained within touch on multiple technologies.

How will I know I'm ready to move on?

The assessments at the end of each module are designed to test your knowledge of the subject matter β€” completing each one will prove that you are able to move on to the next module.

Core modules

Additional resources

List anything in here that is useful but not essential, for each section

Modern tooling

Time to complete: 50–60 hours

Prerequisites

It is a good idea to have knowledge of HTML, CSS, and JavaScript before working through this section, as the tools discussedwork alongside many of these technologies.

How will I know I'm ready to move on?

The assessments at the end of each module are designed to test your knowledge of the subject matter β€” completing each one will prove that you are able to move on to the next module.

Core modules

  • Understanding modern web development tooling (20–25 hour read/exercises) (not yet written)
  • GitHub crash course (4 hour read)
  • Client-side frameworks (25–30 hour read/exercises) (not yet written)

Additional resources

List anything in here that is useful but not essential, for each section