Front-end web developer
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. Work through each section, learning new skills
(or improving existing ones) as you go along. Each section includes exercises and
assessments to test your understanding before you move forward.
Subjects covered
The 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
Tooling that is used to facilitate modern client-side web development.
You can work through sections in order, but each one is also self-contained. For example, if you
already know HTML, you can 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 if front-end web development is for you, and/or you want a gentle
introduction before starting a longer and more complete course, work through our Getting started
with the web module first.
Getting help
We have tried to make learning front-end web development as comfortable as possible, but you
will probably still get stuck because you don't understand something, or some code is just not
working.
Don't panic. We all get stuck, whether we are beginner or professional web developers.
The Learning and getting help article provides you with a series of tips for looking up
information and helping yourself. If you are still stuck, feel free to post a question on
our Discourse forums.
Let's get started. Good luck!
The learning pathway
Getting started
Time to complete: 1.5–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. But make sure you don't skip. It is important
to get you set up and ready to do work for exercises later on in the course.
Guides
Installing basic software — basic tool setup (15 min read)
Background on the web and web standards (45 min read)
Learning and getting help (45 min read)
Semantics and structure with HTML
Time to complete: 35–50 hours
Prerequisites
Nothing except basic computer literacy, and a basic web development environment.
How will I know I'm ready to move on?
The assessments in each module are designed to test your knowledge of the subject matter.
Completing the assessments confirms that you are ready to move on to the next module.
Modules
Introduction to HTML (15–20 hour read/exercises)
Multimedia and embedding (15–20 hour read/exercises)
HTML tables (5–10 hour read/exercises)
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 in each module are designed to test your knowledge of the subject matter.
Completing the assessments confirms that you are ready to move on to the next module.
Modules
CSS first steps (10–15 hour read/exercises)
CSS building blocks (35–45 hour read/exercises)
CSS styling text (15–20 hour read/exercises)
CSS layout (30–40 hour read/exercises)
Additional resources
CSS layout cookbook
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 in each module are designed to test your knowledge of the subject matter.
Completing the assessments confirms that you are ready to move on to the next module.
Modules
JavaScript first steps (30–40 hour read/exercises)
JavaScript building blocks (25–35 hour read/exercises)
Introducing JavaScript objects (25–35 hour read/exercises)
Client-side web APIs (30–40 hour read/exercises)
Asynchronous JavaScript (25–35 hour read/exercises)
Web forms — Working with user data
Time to complete: 40–50 hours
Prerequisites
Forms require HTML, CSS, and JavaScript knowledge. Given the complexity of working with
forms, it is a dedicated topic.
How will I know I'm ready to move on?
The assessments in each module are designed to test your knowledge of the subject matter.
Completing the assessments confirms that you are ready to move on to the next module.
Modules
Web forms (40–50 hours)
Making the web work for everyone
Time to complete: 45–55 hours
Prerequisites
It is good to know HTML, CSS, and JavaScript before working through this section. Many of the
techniques and best practices touch on multiple technologies.
How will I know I'm ready to move on?
The assessments in each module are designed to test your knowledge of the subject matter.
Completing the assessments confirms that you are ready to move on to the next module.
Modules
Cross-browser testing (25–30 hour read/exercises)
Accessibility (20–25 hour read/exercises)
Modern tooling
Time to complete: 55–90 hours
Prerequisites
It is good to know HTML, CSS, and JavaScript before working through this section, as the tools
discussed work alongside many of these technologies.
How will I know I'm ready to move on?
There are no specific assessment articles in this set of modules. The case study tutorials at the
end of the second and third modules prepare you for grasping the essentials of modern tooling.
Modules
Git and GitHub (5 hour read)
Understanding client-side web development tools (20–25 hour read)
Understanding client-side JavaScript frameworks (30-60 hour read/exercises)
