nextra VS typedoc

In this article, you will learn how Nextra can be used to generate a static documentation site and we also provide an example.

Nextra, a powerful framework built on top of Next.js, has been empowering developers to create content-focused websites effortlessly.

Been using https://github.com/shuding/nextra in the past, really loved MDX + nextjs, anything better now?

At this point for jargons.dev, I have muted that it will be an Open Source dictionary that can accept word contribution, it will not require a server, it will rely on GitHub as backend, using a bunch of md files similar to The Odin Project and doc sites implemented like Nextra (this was infact my knight in shiny armor, I was looking to build jargons.dev with Nextra) but I also want to make contributing to the dictionary fun, and lovable with a streamlined contribution experience.

Not quite the same use case, but I've been really enjoying using https://nextra.site/ to create a static documentation site for one of my projects.

It's managed to strike a good balance of getting out the way and letting me mostly just write plain markdown, whilst being able to fall back to react components if needed.

With CD to GitHub pages on merge to main I think it's a pretty good experience

co-author here

we put in a lot of effort into our docs and we'd greatly appreciate any criticism or feedback! Langfuse is powerful but the docs should help beginners to quickly get started and then incrementally use more features.

docs are OSS, repo: https://github.com/langfuse/langfuse-docs

built using: https://github.com/shuding/nextra

However, this may just be due to the lack of proper documentation from the Nextra side of things (shoutout to Nextra though, regardless).

Nextra - Nextra is another option for creating documentation sites. While it might not be as well-known as Docusaurus, Nextra offers a modern and minimalist approach to building documentation. It is designed to be lightweight and user-friendly, making it a good choice for those who prefer a simple and clean documentation style. You can explore more about Nextra on their official website.

I have looked at https://nextra.site/ but that doesn't work with the app router yet. So I'm wondering if there's another alternative.

Documentation generation from your compiled .d.ts with typedoc

JavaScript (TypeScript) ecosystem has various types of API docs generators. Maybe the most popular one is TypeDoc. While generating API docs itself is easy, hosting API docs is pretty hard. Publishing generated HTML to static hosting service like GitHub Pages is the method I adopted previously, but it's not an ideal solution because we can't view docs for older versions.

Firstly, install Typedoc using npm:

Background:The main bottleneck with the TypeDoc default theme especially for large projects is the verbose HTML for the left-hand navigation that linearly grows for each page based on the project size and consumes a massive amount of disk space; see this TypeDoc issue. The DMT caches the left-hand navigation HTML and dynamically creates a shared web component that is utilized across all pages only making a single copy of the navigation HTML. This reduces disk space utilization by up to 90% and also makes doc generation ~80% faster. I also include some style additions and replace the main search index generation using compressed MesssagePack instead of JSON which reduces the search index size by more than 90%.

While the Prim+RPC server is expected to be JavaScript, I'd like to support other languages through JSON Schema. I wrote a tool that translates TypeDoc comments into RPC-specific documentation. My plan is to turn this result into JSON Schema that can be served with the Prim+RPC server. This means you can get typed suggestions (for instance, from an IDE that understands JSON Schema) when writing requests in JSON files (I wrote a little about this here, still a WIP). From this, you could use your favorite HTTP client in the language of your choice, like but still benefit from having typed requests.

Docusaurus has a Typedoc plugin. Also there is a typedoc markdown plugin.

Finally, JSDoc can be used to generate documentation for your code using tools like JSDoc itself and TypeDoc. These tools generate HTML or Markdown documentation based on your JSDoc annotations, making it easier for others to understand how your code works and how to use it.

Since you're using TypeScript, use TypeDoc.