The project actually comprises four endeavours: 1) a novel design system / visual language tailored to the needs of such a manual; 2) a custom markup language and its compiler; 3) the manual itself written in the markup language; 4) an interactive UI built around the manual so that users can make the most of it.
All these parts were designed and iterated over together. The markup language supports not only the content structure, phrasing, and various visual elements, but also metadata for the interactive features such as quizzes, search, and advanced navigation; and process marks to keep track of work in progress, testing, and quality control. The compiler outputs HTML, JSON metadata, plus some reports. Well, have a look at a tiny sample of the markup:
PARA xdie {((TAG static)) ((TAG method)) DEF(@object-get-own-property-names){`Object.getOwnPropertyNames($o)`} ~> an ((array)) of the ((key-prop*)) of !!all!! ((string-keyed)) ((own-property*)) of $o STOP the list is sorted according to the ((standard-property-order))}
The visual system is another important part. The goals were: information density and low noise; suitability for small screens and high-distraction environments; being concise, yet able to go into detail and explain things with precision. I was pretty sure that regular blocks of prose were not the way. So after a lot of experimentation and iteration I devised this system of short sentences interspersed with special marks and tags, with rich use of hyperlinks and emphasis. Plus code samples using several forms of annotation. (Have a look at the app or a glance at the screenshots.)
And I wrote the manual. It has gradually grown to 2 megabytes of the markup. Yes it's been a LOT of work, but it's real now. Almost all of the JavaScript language is covered. Not everything yet and it still needs some polishing. But I think it is already a pretty unique resource that provides hundreds of answers and insights that are not easily found elsewhere.
And finally the app. One does not study very well at an office desk. So why not take advantage of mobile devices? A few key features out of many ideas made it into the app. * Three 'boards' where users can store content of their choice, reflecting the three main goals of the app: long-term study, short-term preparation, and quick reference. * Quizzes, which can even be generated for a custom selection of content. * User notes inserted right into the content. Analogically, context-specific user feedback is implemented, so the content can improve with the help of the community. * Terminology search and term browser, which provides quick way to all mentions of a given term and its relationships to other concepts. The UI is largely modeless and based on scrolling things into focus. No popups ever disrupt the user. There is no setup or sign-up needed upfront. Everything works offline.
Here we are. The whole platform (the compiler back-end + the app) now comprises around 7000 lines of JS code plus some HTML and CSS, using basically no external libraries.
It's been released as an iOS app, while I also intend to add some kind of desktop implementation in the future. At the moment, the app is available for FREE and you can get it from the App Store, so give it a try: https://apps.apple.com/app/id6454232823
You can also have a look at the app's website: https://stackrover.app/