Contributing to MDN: Meet the Contributors

If you’ve ever built anything with web technologies, you’re probably familiar with MDN Web Docs. With about 13,000 pages documenting how to use programming languages such as HTML, CSS and JavaScript, the site has about 8,000 people using it at any given moment.

MDN relies on contributors to help maintain its ever-expanding and up to date documentation. Supported by companies such as Open Web Docs, Google, w3c, Microsoft, Samsung and Igalia (to name a few), contributions also come from community members. These contributions take many different forms, from fixing issues to contributing code to helping newcomers and localizing content.

We reached out to 4 long-time community contributors to talk about how and why they started contributing, why they kept going, and ask what advice they have for new contributors.

Meet the contributors

MDN contributors come from all over the world, have different backgrounds, and contribute in different ways. 

Irvin and Julien’s main area of contribution is localizations. They are part of a diverse team of volunteers that ensure that MDN is translated in seven different languages (Discover here how translations of MDN content happens.

Since the end of 2020, the translation of MDN articles happen on the new GitHub based platform.

Irvin

Irvin, @irvinfly, volunteer from Mozilla Taiwan Community

I had been a front-end engineer for more than a decade. I had been a leisure contributor on MDN for a long time. I check MDN all the time when writing websites, but only made some simple contributions, like fixing typos.

In early 2020, the MDN team asked us if zh (Chinese) locale would like to join the early stage of the localization system on Yari, the new Github-based platform. We accepted the invitation and formed the zh-review-team. Since then, I have begun to contribute to MDN every week.

My primary work is collaboration with other zh reviewers to check and review the open pull requests on both Traditional Chinese and Simplified Chinese locales. Our goal is to ensure that all the changes to the zh docs are well done, both regarding the file format and translations. 

Julien

Sphinx  (Julien) (he / him), @Sphinx_Twitt 

Most of my contributions revolve around localizing MDN content in French (translating new articles and also maintaining existing pages). Since MDN moved to GitHub, contributing also encompasses reviewing other’s contributions. 

I started to contribute when, having time as a student, I joined a collaborative translation project led by Framasoft. After a few discussions, I joined a mailing list and IRC. One of the first contribution proposals I saw was about improving the translation of the MDN Glossary in French to help newcomers.

I started helping and was welcomed by the team and community at that time. One thing led to another, and I started helping to translate other areas of MDN in French.

Tanner and Kenrick are also longtime volunteers. Their main areas of activity are contributing code, solving issues in MDN repositories, as well as reviewing and assisting the submissions of other contributors.

In MDN, all users can add issues to the issue tracker, as well as contributing fixes, and reviewing other people fixes

Tanner

Tanner Dolby, @tannerdolby 

 I contribute to MDN by being active in the issue tracker of MDN repositories. 

I tend to look through the issues and search for one I understand, then I read the conversation in the issue thread for context. If I have any questions or notice that the conversation wasn’t resolved, I comment in the thread to get clarification before moving forward. 

From there, I test my proposed changes locally and then submit a pull request to fix the issue on GitHub. The changes I submit are then reviewed by project maintainers. After the review, I implement recommended changes. 

Outside of this, I contribute to MDN by spotting bugs and creating new issues, fixing existing issues, making feature requests for things I’d like to see on the site, assisting in the completion of a feature request, participating in code review and interacting with other contributors on existing issues.

I started contributing to MDN by creating an issue in the mdn/yari repository. I was referencing documentation and wanted to clarify a bit of information that could be a typo. 

The MDN Web Docs team was welcoming of me resolving the issue, so I opened and reviewed/merged a PR I submitted, which fixed things. The Yari project maintainers explained things in detail, helping me to understand that the content for MDN Web Docs lived in mdn/content and not directly in mdn/yari source. The issue I originally opened was transferred to mdn/content and the corresponding fix was merged. 

My first OSS experience with MDN was really fun. It helped me to branch out and explore other issues/pull requests in MDN repositories to better understand how MDN Web Docs worked, so I could contribute again in the future.

Kenrick

Kenrick, @kenrick95

I’ve edited content and contributed codes to MDN repositories: browser-compat-data, interactive-examples, and yari.

My first contribution to content was a long time ago, when we could directly edit on MDN. I can no longer recall what it was, probably fixing a typo. 

My first code contribution was to the “interactive-examples” repo. I noticed that the editor had some bugs, and I found the GitHub issue. After I read the codes, it seemed to me that the bug could be easily fixed, so I went ahead and sent a pull request

Why contribute?

Contributions are essential to the MDN project. When talking about why they deem contribution to MDN a critical task, contributors underlined different facets, stressing its importance as an open, reliable and easily accessible resource to programmers, web developers and learners.

Contributions to MDN documentation and infrastructure help insure the constant improvement of this resource. 

Contributions to MDN are important because it helps to provide a reliable and accessible source of information on the Web for developers. MDN Web Docs being open source allows for bugs to quickly be spotted by contributors and for feature requests to be readily prototyped. 

Building in the open creates an environment that allows for contributors from all over the world to help make MDN a better resource for everyone and that is incredible. (Tanner)

Contributions to the platform and tools that powers MDN are important to enhance users experience (Kenrick)

Small and big contributions are all significant and have a real impact. A common misconception about contributing to MDN is that you can only contribute code, but that is not the case! 

MDN is the primary place for people to check any references on web-dev tech. As small as fixing one typo, any contribution to MDN can always help thousands of programmers and learners. (Irvin)

Contribution to localization allows learners and developers to access this resource in languages other than English, making it more accessible. 

Especially for those who are struggling with reading English docs, localization can enable them to access the latest and solid knowledge (Irvin)

Contributing to localization help beginners on the Web finding quality documentation and explanations so that they can build sites, apps and so on without having to know English. MDN is a technical reference, but also a fantastic learning ground to educate newcomers. From basic concepts to complex techniques, language should not be a barrier to build something on the Web. (Julien)

Contributing is a rewarding experience

We asked contributors why they find contributing to MDN a rewarding experience. They told us that contribution is a way to help others, but also to learn new things. They spoke about the relationship that volunteers build with other people while contributing, and the possibility to learn from and help others. 

The part of contributing that I enjoy most is providing a fix for something that positively impacts the experience for users browsing MDN Web Docs. This could be an update to documentation to help provide developers with accurate docs, or helping to land a new feature on the site that will provide users new or improved functionality. Before I started contributing to MDN, I referenced MDN Web Docs very often and really appreciated the hard work that was put into the site. To this day, I’m motivated to continue help making MDN Web Docs the best resource it can be through open source contributions. (Tanner)

I enjoy finding different points of view on how to achieve the same things. This is natural, since the people I interact comes from different part of the world and we all are influenced by our local cultures (Kenrick)

The part of contributing I most enjoy is definitely the part when I’m learning and discovering from what I’m translating (…). My best memory to contribute to MDN is that I had the great privilege of spending an evening watching a sunset of lava and sea with people related to MDN for whom I have the deepest esteem. (Julien)

The journey of contribution itself is important. The support of MDN maintainers and the exchange of ideas is essential. Contribution does not happen in a silo but is a collaborative effort between volunteers and the MDN team.

My best memory of contributing to MDN would have to be the journey of creating the copy-to-clipboard functionality for code snippets on MDN Web Docs. I remember prototyping the feature in mdn/yari locally and then beginning to see it come to life really quickly, which was wonderful to see.

The code review process for this feature was such a joy and incredibly motivating. Each step of the feature was tested thoroughly and every win was celebrated.

Each morning, I would wake up and eagerly check my email and see if any “Re: [mdn/yari]” labelled emails were there because it meant I could get back to collaborating with the MDN Web Docs team. This contribution really opened my eyes to how incredibly fun and rewarding open source software can be. (Tanner)

My best memory of contributing to MDN was working on https://github.com/mdn/yari/pull/172. The change in itself wasn’t big, but the solution changed several times after lengthy discussion. I’m amazed on how open the maintainers are in accepting different point of views for achieving the end goal (Kenrick)

Contributions to be proud of

All contributions are important, but some hold a special place with each volunteer.

The contribution that I’m most proud of is adding copy-to-clipboard functionality to all code snippets for documentation pages on MDN Web Docs. I use this utility very often while browsing pages on MDN Web Docs and seeing a feature I helped build live on the site for other people to use is an amazing feeling.

This contribution was something I wanted to see on the site and after discussing the feature with the Yari team, I began prototyping and participating in code review until the feature was merged into the live site. This utility was one of the first “large” feature requests that I contributed to mdn/yari and is something I’m very proud of. (Tanner)

The contribution I am most proud of is having the HTML, CSS, and JavaScript section complete and up-to-date in French in 2017 after being told this would be impossible :) . More recently, helping rebuilding tools for localizers on the new MDN platform with a tracking dashboard (Julien)

Kenrick was most proud of adding a feature that marks the page you are looking at in the sidebar. This change makes a significant difference for visual learners. 

It was a simple change, but I felt that this UX improvement is important because it serves as a guide to the reader to check what are the documents related to the one they are reading. 

Getting started 

There are many ways to contribute to MDN! Our seasoned contributors suggest starting with reporting issues and trying to fix them, follow the issue trackers and getting familiarized with GitHub. Don’t be afraid to ask questions, and to make mistakes, there are people that will help you and review your work.

 Go at your own pace, don’t hesitate to ask questions. If you can, try to hack things to fix the issues you encounter on a project. If you are eager to learn things about the Web, check MDN as a way to contribute to open source (Julien)

Suppose you become aware of a bug in any MDN doc (such as a typo), you are welcome to fix them directly by clicking the “Edit on Github” button. The review team will ensure it’s good, so you don’t need to worry about making any mistakes. (Irvin)

From taking the first steps, contributors can then progress to more difficult issues and contributions. 

Don’t be afraid of reading code. Pick up any issue from GitHub, and you can easily start contributing code! (Kenrick)

My advice for new contributors or those getting started with open source is to get familiarized with the project that they wish to contribute in and then begin staying up-to-date with the issue tracker.

Start being active in the project by looking through issues and reading through the comments, this is a sure-fire way to learn about the project. If there is something that you aren’t ready to contribute but want to have a conversation about, drop a comment in the issue thread or create a discussion in the repository for a great way to inspire conversation about a topic.

Lastly, understanding a version control software like Git is recommended for those that are considering starting to contribute to open source software. Be open to help in any way you can when first getting started in open source, I started small with documentation fixes on MDN Web Docs and then gradually worked my way into more complex contributions as I became more familiar with the project. (Tanner)

If you want to start contributing, please check out these resources:

If you have any questions, join the matrix chat room for MDN.

About Francesca Minelli

Community Manager at Mozilla.

More articles by Francesca Minelli…