Dev to Hero

Color-codes JS docs by difficulty. 100% free, no account, no AI — runs entirely in your browser.

Learning to code is hard. Documentation is harder. MDN, DevDocs and javascript.info are incredible resources — but they treat a beginner and a senior developer exactly the same way. Every section looks equally important. Nothing tells you where to start. Dev to Hero fixes that. It automatically color-codes every section of a documentation page based on its difficulty level: 🟢 Beginner — read this now 🟡 Intermediate — come back after the basics 🔴 Advanced — no need to stress about this yet But it goes much further than just color badges: 📌 Smart prerequisites — each section tells you exactly what you need to know first, sorted by learning order and split between required (★) and optional (○) concepts. Each prerequisite links directly to the relevant doc page. Click once to mark as approached, click twice to mark as mastered — synced across all supported sites and sessions. 📊 Page summary — see at a glance how many beginner, intermediate and advanced sections a page contains, which prerequisites you still need to master, plus an estimated reading time. ☐ Track your reading — mark sections as read and watch your progress update in real time. 🎯 Focus mode — show or hide beginner, intermediate and advanced sections independently so you can focus on exactly what's relevant to your level. 📋 Export your study plan — download a clean, structured study plan showing all sections by level, your read status, and prerequisites still to cover. 💡 Next reading suggestions — at the end of every page, Dev to Hero suggests what to read next based on your knowledge. ✎ Report incorrect badges — votes are currently local to your browser. Shared community voting may be added in a future update. ⌨️ Keyboard shortcut — toggle the extension on/off with Alt+Shift+M. Currently supported sites: MDN Web Docs (HTML EN + FR, CSS EN + FR, JavaScript EN + FR), DevDocs (HTML EN, CSS EN, JavaScript EN), javascript.info (EN) 6 694 pages covered — with more added regularly. Coming soon: React, Express, SQL, Python, TypeScript, Markdown fonctionnality online and more. 100% free. No AI. No account. No API. No ads. Changelog : [2.1.0] - 2026-06-14 ### Added FRENCH IS HERE !!!! 2.0.4 --> 2.1.0 and a BIG surprise ! - Full HTML & Full CSS & Full JavaScript in french for MDN (2,004 new pages !) - Now 6,694 pages covered. - Dev to Hero is now available on Edge and Opera browsers (download on the Chrome Web Store). Firefox is submitted today, I will warn you when it's official. 2026-06-07 - Still on 2.0.4, but with new screenshots on the Chrome Web Store, and the link of the short commercial video. [2.0.4] - 2026-05-29 ### Added - Full HTML & Full CSS in english for DevDocs - Full JavaScript for MDN and DevDocs (831 new pages on each website), with now a total of 979 pages of JavaScript covered on each. - 2,461 new pages added for MDN and DevDocs. Now 4 690 pages covered. [2.0.3] - 2026-05-13 ### Added - Full HTML & Full CSS in english for MDN, very soon available for DevDocs - 908 new pages added in MDN. Now 2,229 pages covered. [2.0.2] - 2026-05-06 ### Added - Support for 341 DevDocs pages - Finalized reading tips at the bottom of pages - 1,321 pages covered by Dev to Hero ### Fixed - JavaScript MDN EN 148 pages - Bug fixes [2.0.1] - 2026-05-04 ### Fixed - Bug fixes