A mandala pattern created out of plain text characters.

Announcing the MDN front-end developer curriculum

Author avatarThe MDN Team5 minute read

Hello everyone! We're delighted to share with you all the work we've been doing on creating the "MDN curriculum for front-end development". The curriculum is intended to provide an up-to-date industry recommendation for the fundamental skills and best practices that a front-end web developer should have. The curriculum also describes soft skills such as the mindset and attitude that will help secure a position and sustain long-term success in this field.

In this post, we'll share the key research findings that helped us shape the curriculum, the different groups of learners who can benefit from this curriculum, and how you can participate by way of asking questions and giving feedback.

Why we are adding a curriculum

Part of our focus for 2023 is on making MDN a resource where people can learn new skills, as well as becoming familiar with navigating and using reference documentation.

Back in 2019, we launched Learn web development on MDN to help folks learn the basics of front-end development. With a lot of useful content published to date, this part of MDN has proven to be pretty successful — it averages around 10% of MDN page views.

We believe that by supplementing the Learn area with stronger guidance on what new front-end developers should learn about in order to be successful in the web industry, we'll make this section of our website even more helpful. The curriculum represents a first step towards this goal.

Our research on essential front-end developer skills

The curriculum is an outcome of an extensive survey conducted by the MDN team in early 2023. We wanted to understand our users' expectations in regards to learning front-end web development on MDN and elsewhere. We surveyed the following audience groups that use this content for learning:

  • Students/learners
  • New and experienced web developers
  • Technical hiring managers
  • Educators

From the survey, we identified the following key gaps and problems:

  • Students highlighted a lack of structured guidance on what topics to learn and when.
  • The experienced web developers and hiring managers highlighted the limited awareness of crucial best practices around topics such as accessibility, privacy, responsive design, general debugging/problem-solving, and performance.
  • All groups identified a single missing resource outlining supplementary skills to enhance employment prospects or performance in current jobs. Some of the examples that came up in this category included JavaScript frameworks and tools for version control and testing.
  • Nearly everyone surveyed cited a deficiency in soft skills, including attributes like teamwork, giving and receiving feedback, and research and planning abilities.

Introducing the front-end developer curriculum

Based on our research findings, we decided to focus on creating a high-level curriculum – a single document that lists all the fundamental and supplementary topics that front-end developers should learn about, along with trusted resources to get started with each of them. The curriculum will be available for free.

Before we launch the curriculum, we're making it available to preview in MDN's curriculum repository on GitHub. See below how to explore the various sections and peruse the document's information.

We believe the curriculum will be useful for several different groups of people, from students wanting to learn web development to educators wanting to put together courses for teaching. Check out the curriculum introduction to read more about the purpose of the curriculum and the target audience.

To help you navigate the curriculum, we have organized it into the following major sections:

  • Precursor knowledge: Topics that are not, strictly speaking, web development topics but do constitute useful topics for anyone wanting to learn front-end web development. This includes soft skills and knowledge of a typical development environment.
  • Core modules: Topics that we feel every web developer should have a good grounding in. These modules include all the information they need to design and build a basic, accessible website/app that follows modern best practices, and manage and deploy their code using a tool like GitHub.
  • Optional extension modules: These "extension" topics constitute useful additional skills to learn as web developers start to expand their knowledge and develop specialties.

Head over to each section and then use the sidebar to explore all the different sub-topics contained within.

Share your feedback

We hope you're as excited about this project as we are! We are looking forward to providing a single trusted resource that offers guidance on what to learn as a front-end developer. We want to take you with us on this journey as we formalize the curriculum and would appreciate your feedback before its official launch. We're particularly interested in your input regarding these questions:

  • Does our curriculum contain all the fundamental knowledge a front-end web developer needs? If not, what topics are we missing? We are interested in high-level concerns (for example, "this whole area is missing") as well as lower-level feedback (for example, specific CSS or JavaScript topic omissions).
  • Do you think the curriculum is helpful to its key target audiences, for example, students wanting to learn front-end development and teachers wishing to create courses based on it? If not, why not?

Let us know what you think by opening an issue in the mdn/curriculum GitHub repository under General feedback or Topic coverage. Expertise in a specific area is welcome even if you lack knowledge in others. We know that the curriculum is quite extensive and appreciate the time you would spend in sharing your feedback. Feel free to also share this post with anybody you know who is thinking about entering this field or looking to hire front-end developers.

What's next

We're targeting a Q4 2023 release for the curriculum. At the same time, we're assessing the addition of links to resources that delve into the topics we've highlighted. Looking ahead, we're considering related courses as part of our expanding initiatives. Stay tuned for more details!

Stay Informed with MDN

Get the MDN newsletter and never miss an update on the latest web development trends, tips, and best practices.