mdn is easy!

MDN is easy!A guide to contributing to the Mozilla Developer Network!

Chris Mills, Senior Tech Writer, MDN

Monday, 14 October 13

By the end, you will have

1. An MDN account2. An edit to an MDN page in your name.

MDN icebreaker!


Why would anyone contribute to MDN?


For everyone!

• Yourself• Your project•Mozillians• The whole world


You can

• Shine• Get sex, drugs and rock ‘n’ roll• Get stickers, t-shirts and recognition• Help the community get the docs they need


Your project can

• Get internal and external visibility• Get promotion (in combination with Hacks blog,

evangelist talks, etc.)• Get more users and contributors


Mozillians, the whole world

• Gets awesome docs to help them do their work• Is able to contribute back•Will get to know you and love you


It’s a great platform

• Kuma — based on Django and Node.js• It’s a Wiki, on steroids• Our development team are *actually*

ninjas.


How to contribute?

What do you want to get out of this session?


You just have to log in...• This is mainly just to cut down on some spam• And to share recognition, and blame!•We use Persona


Once logged in

• You can edit pages• Create new pages


You should also

• Report bugs at bugzilla.mozilla.org (project: Mozilla Developer Network :: General)• Get help on lists.mozilla.org/listinfo/dev-mdc• Get help on IRC (wiki.mozilla.org/IRC, room #devmo)


https://bugzilla.mozilla.org/

https://bugzilla.mozilla.org/

https://lists.mozilla.org/listinfo/dev-mdc




Editing


Don’t be afraid

• Hit that edit button• And kick some ass• At the very worst, we can revert changes• But we’d rather you edit stuff than send us bugs!


Edit toolbar

developer.mozilla.org/en-US/docs/Project:MDN/Contributing/Editor_guide


https://developer.mozilla.org/en-US/docs/Project:MDN/Contributing/Editor_guide




Edit bar


Footer controls


Macros

•Written in KumaScript, which is pretty much just JS• https://developer.mozilla.org/en-US/docs/

Project:MDN/Contributing/Custom_macros • For example, {{HTMLElement("div")}} is found at

developer.mozilla.org/en-US/docs/Template:HTMLElement


https://developer.mozilla.org/en-US/docs/Project:MDN/Contributing/Custom_macros




https://developer.mozilla.org/en-US/docs/Template:HTMLElement




How to contribute


Big or small

• It’s all really useful!• Some MDN contributors literally just make a handful

of small fixes each day, or week• But it improves the site quality enormously


Small contributions

• Typos• Correction of technical errors• Title fixes• Adding tags• Code consistency fixes• Code snippets


Small contributions

• Improving descriptions and examples• Proof reading, tech review•Macro fixes• Other minutiae• Feedback!


Large contributions

•Writing new articles• Tech editing/copy editing• Translations•Writing demos• Kuma development•Writing tools


Create a new article


Write it...

• Then request an edit

• You can also ask on the mailing list or in IRC


Shout about it!

• Spread the word on Twitter, Google+, etc.• Get developers interested in using the feature/tool/

whatever it is, and contributing to the docs


Tech/copy editing

• Can be a big task, depending on the quality or length of writing•Make most fixes yourself• For uncertainties, contact the main contributor• Ask on IRC/mail• File a bug


Translations

• Really useful contribution• Keep MDN internationalized!


Find a page to translate


Choose a language


Enter your translation


Collaborate!

• Start a localization group• Or join an existing one• developer.mozilla.org/en-US/docs/Project:MDN/

Localizing/Localization_projects


https://developer.mozilla.org/en-US/docs/Project:MDN/Localizing/Localization_projects




Write demos

• Some people don’t like writing prose• But excel at writing code• Good demos are a major plus


How to add demos

• Put them on Github• Directly, or via JSBin, Codepen.io, etc.• Link to them!


Live samples

• Smaller samples can be put directly on the Wiki page• Then assembled into a running demo• developer.mozilla.org/en-US/docs/Project:MDN/

Contributing/Editor_guide/#Using_the_live_sample_system


https://developer.mozilla.org/en-US/docs/Project:MDN/Contributing/Editor_guide/#Using_the_live_sample_system






Write tools

•Why not write a demo that does something useful?• For example, the box-shadow generator• developer.mozilla.org/en-US/docs/Web/CSS/Tools/

Box-shadow_generator


https://developer.mozilla.org/en-US/docs/Web/CSS/Tools/Box-shadow_generator




Write macros

• A macro is basically just a special kind of page• developer.mozilla.org/en-US/docs/

Template:HTMLElement• In this page you enter KumaScript, which is basically

JS with some extra APIs






Write macros

• This JS is executed server-side• So you can’t do client-side type stuff with it• But you can automate a lot of work!• https://developer.mozilla.org/en-US/docs/

Project:MDN/Contributing/Custom_macros






Kuma development

• If you are a ninja (or at least a samurai, or pirate)• You might want to help develop the system• It’s on github• github.com/mozilla/kuma • developer.mozilla.org/en-US/docs/Project:MDN/

Kuma/Contributing


https://github.com/mozilla/kuma

https://github.com/mozilla/kuma

https://developer.mozilla.org/en-US/docs/Project:MDN/Kuma/Contributing




It’s a big community out there


CommUNITY

• Don’t feel you have to do it alone• Find others who share your immediate interests• And collaborate• Ask for help on IRC, mail


Repurposing content


Reuse!

•Why not repurpose that blog post?• Article?• Code example?• Quick-fire tip?• Or Hacks post?


Thanks for [email protected] || @chrisdavidmills

Chris Mills, Senior Tech Writer, MDN


mailto:[email protected]

mailto:[email protected]

https://twitter.com/chrisdavidmills

https://twitter.com/chrisdavidmills

Notes for session presenters

When running a workshop on MDN editing:

• Start with a presentation, including what you need to know to become an MDN contributor (slides 9-35?)•Make sure everyone can sign in, and find a page for

them to edit.


Notes for session presenters

When running a workshop on MDN editing:

• Bookmark several pages containing simple-to-fix problems.• Let people choose one of these to fix (unless they

want to find something of their own).


mdn is easy!

Technology