Skip to content

feat: use fumadocs for website #1654

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 67 commits into from
Jul 22, 2025
Merged

feat: use fumadocs for website #1654

merged 67 commits into from
Jul 22, 2025

Conversation

nperez0111
Copy link
Contributor

@nperez0111 nperez0111 commented May 2, 2025

This PR implements a new docs site, based on fumadocs.

I purposefully did not just update the existing docs site, so that we can compare the changes, and remove any cruft that may be left over.

So far, I've done the following:

  • Implemented the docs and examples content pages (with slight modifications to the content since titles are now generated from the frontmatter of the mdx files)
  • Moved over the pricing page (a one-off page that was in React)
  • Moved over the thank you page (an mdx page)
  • Moved over the sign in/sign up pages and functionality and put the sign in button in the header
  • Added an llms.txt and llms-full.txt file which are automatically generated from the docs content (useful for LLMs to understand out APIs)

What's left:

image

Copy link

vercel bot commented May 2, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
blocknote ✅ Ready (Inspect) Visit Preview Jul 22, 2025 7:25am
blocknote-website 🛑 Canceled (Inspect) Jul 22, 2025 7:25am

* Added home and about pages

* docs: Examples, footer, and remaining pages (#1784)

* Added examples card grid and fixed demo styling

* Added footer + remaining pages, cleaned up files

* Removed unused Logo component

* - Fixed home page contributors GH/Discord icons
- Fixed CSS file imports
- Removed codeblock/tabs from generated example MDX files (now handled by the `Example` component)
- Fixed component imports in MDX
- Refactored `Example` component
- Various styling fixes
- Added `meta.json` generation

* Fixed pro examples + minor changes/fixes

* Small fix

* Small fix

* Removed `console.log`

* Added missing examples pages to meta

* Small fix

* Fixed build

* Updated package lock

* Updated lockfile

* Fixed example path in playground

* Implemented PR feedback

* Updated page headings
Copy link
Collaborator

@YousefED YousefED left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice! Not really a lot of questions about the code - so focused on testing the design / different pages.

Generic:

AI:

Do we need to merge in changes from main?

  • AI button doesn't show in header
  • AI preview banner has been removed (maybe need to merge in updates from main)

Navbar:

  • examples / docs aren't highlighted in navigation when that page is active
  • can we make the navigation more consistent between docs and main pages?
  • remove light / dark toggle from nav (keep in footer like existing site)

Other:

Let's walk through the pages together and manually compare them (maybe on a call), with specific attention to dark + light, responsive, etc. We can then see together what we do / do not want to fix. Some things I already noticed (outside of the above):

  • dark mode sign in / sign up page looks a lot different


export const runtime = "edge";

export async function GET(request: Request) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

TODO: make sure we test this when deployed

import { Hero } from "./hero/Hero";
import { Letter } from "./letter/Letter";

export default function Home() {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why is this directory named (home)? Is this a route group? https://nextjs.org/docs/app/api-reference/file-conventions/route-groups ? Should it be? (as it's a single page, right?)

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I agree it's a little odd, but seems like it's the recommended setup for fumadocs since that's what they use for their site (https://github.com/fuma-nama/fumadocs/tree/dev/apps/docs/app/(home)). Either way, I'm pretty sure it's because you don't wanna render a HomeLayout in your root route layout (i.e. /app/layout.tsx) since that'll get inherited by all other routes. So while it's weird that it's in a route group, this seems to be the correct approach for fumadocs.

import { baseOptions } from "@/app/layout.config";
import { Footer } from "@/components/Footer";

export default function Layout({ children }: { children: ReactNode }) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

trying to understand the setup, for which pages is this layout file used?

Copy link
Collaborator

@matthewlipski matthewlipski Jul 8, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The app/docs, app/examples, and app/pages routes correspond to the content/docs, content/examples, and content/pages directories. So the layout for app/pages is used for the about, thanks, and legal pages that we define in MDX in content/pages.

@matthewlipski
Copy link
Collaborator

@YousefED r.e. the sidebar scrolling issue - seems to be working, however scrolling to the left of the sidebar scrolls the content instead. You have to have the cursor directly over the sidebar (this is the same behaviour as NextJS docs).

Copy link
Collaborator

@YousefED YousefED left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

great cleanup in the latest iteration

@nperez0111
Copy link
Contributor Author

nperez0111 commented Jul 22, 2025

Can we use a static link system or broken link checker to catch these things?

We likely could, the ones I've seen mostly run against the live website, but idk if it is worth the effort to set up now

@nperez0111 nperez0111 merged commit 5cd50e7 into main Jul 22, 2025
4 of 6 checks passed
@nperez0111 nperez0111 deleted the fumadocs branch July 22, 2025 07:19
@vercel vercel bot temporarily deployed to Preview – blocknote-website July 22, 2025 07:25 Inactive
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants