Create markdown import and rendering guide by tannerlinsley · Pull Request #6150 · TanStack/router

tannerlinsley · 2025-12-19T18:50:56Z

Add comprehensive guide covering two methods for importing and rendering markdown in TanStack Start applications:

Static markdown with content-collections for build-time loading
Dynamic markdown fetched from GitHub or remote sources at runtime

Includes setup for unified/remark/rehype pipeline, code highlighting with Shiki, and practical examples for blog posts and documentation pages.

Summary by CodeRabbit

Documentation
- Added a new "Rendering Markdown" guide to the React documentation, covering two methods for handling markdown content: static markdown and dynamic markdown from remote sources, with setup steps, code examples, and syntax highlighting options.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

Add comprehensive guide covering two methods for importing and rendering markdown in TanStack Start applications: - Static markdown with content-collections for build-time loading - Dynamic markdown fetched from GitHub or remote sources at runtime Includes setup for unified/remark/rehype pipeline, code highlighting with Shiki, and practical examples for blog posts and documentation pages.

coderabbitai · 2025-12-19T18:51:08Z

Caution

Review failed

The pull request is closed.

Walkthrough

This PR adds comprehensive documentation for rendering Markdown in TanStack Start React apps. It introduces a new navigation entry in the config file and a new guide covering static markdown via content-collections and dynamic markdown fetched from remote sources.

Changes

Cohort / File(s)	Summary
Rendering Markdown Documentation `docs/start/config.json`, `docs/start/framework/react/guide/rendering-markdown.md`	Adds a new navigation item "Rendering Markdown" to the React Guides section in the navigation config; introduces a comprehensive guide file covering static markdown setup via content-collections, dynamic markdown fetching from remote sources, frontmatter parsing, syntax highlighting with Shiki, and practical examples for both approaches.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~15 minutes

Verify accuracy of Markdown processing setup instructions and code examples
Confirm navigation structure correctly placed within config hierarchy
Check completeness of static and dynamic markdown workflow descriptions

Possibly related PRs

docs: Move files to Guides section #5441: Modifies React Guides navigation structure in docs/start/config.json, overlapping with the navigation changes in this PR.

Suggested reviewers

schiller-manuel
birkskyum

Poem

🐰 A guide to rendering Markdown, how neat!
Static and dynamic paths now complete,
With content-collections and remote fetches,
This documentation truly matches,
Helping React devs compose their sketches! 📝

✨ Finishing touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch claude/markdown-import-guide-UNy5i

📜 Recent review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 05408f8 and 2493d7f.

📒 Files selected for processing (2)

docs/start/config.json (1 hunks)
docs/start/framework/react/guide/rendering-markdown.md (1 hunks)

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

nx-cloud · 2025-12-19T18:51:31Z

View your CI Pipeline Execution ↗ for commit 2493d7f

Command	Status	Duration	Result
`nx run-many --target=build --exclude=examples/*...`	✅ Succeeded	3s	View ↗
`nx affected --targets=test:eslint,test:unit,tes...`	✅ Succeeded	<1s	View ↗

☁️ Nx Cloud last updated this comment at 2025-12-19 18:54:12 UTC

pkg-pr-new · 2025-12-19T18:55:09Z

More templates

@tanstack/arktype-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/arktype-adapter@6150

@tanstack/directive-functions-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/directive-functions-plugin@6150

@tanstack/eslint-plugin-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/eslint-plugin-router@6150

@tanstack/history

npm i https://pkg.pr.new/TanStack/router/@tanstack/history@6150

@tanstack/nitro-v2-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/nitro-v2-vite-plugin@6150

@tanstack/react-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router@6150

@tanstack/react-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-devtools@6150

@tanstack/react-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-ssr-query@6150

@tanstack/react-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start@6150

@tanstack/react-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-client@6150

@tanstack/react-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-server@6150

@tanstack/router-cli

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-cli@6150

@tanstack/router-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-core@6150

@tanstack/router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools@6150

@tanstack/router-devtools-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools-core@6150

@tanstack/router-generator

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-generator@6150

@tanstack/router-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-plugin@6150

@tanstack/router-ssr-query-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-ssr-query-core@6150

@tanstack/router-utils

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-utils@6150

@tanstack/router-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-vite-plugin@6150

@tanstack/server-functions-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/server-functions-plugin@6150

@tanstack/solid-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router@6150

@tanstack/solid-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-devtools@6150

@tanstack/solid-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-ssr-query@6150

@tanstack/solid-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start@6150

@tanstack/solid-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-client@6150

@tanstack/solid-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-server@6150

@tanstack/start-client-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-client-core@6150

@tanstack/start-plugin-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-plugin-core@6150

@tanstack/start-server-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-server-core@6150

@tanstack/start-static-server-functions

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-static-server-functions@6150

@tanstack/start-storage-context

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-storage-context@6150

@tanstack/valibot-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/valibot-adapter@6150

@tanstack/virtual-file-routes

npm i https://pkg.pr.new/TanStack/router/@tanstack/virtual-file-routes@6150

@tanstack/vue-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router@6150

@tanstack/vue-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router-devtools@6150

@tanstack/vue-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router-ssr-query@6150

@tanstack/vue-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-start@6150

@tanstack/vue-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-start-client@6150

@tanstack/vue-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-start-server@6150

@tanstack/zod-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/zod-adapter@6150

commit: 2493d7f

github-actionsBot added the documentation Everything documentation related label Dec 19, 2025

autofix-ciBotand others added 2 commits December 19, 2025 18:52

ci: apply automated fixes
1535a41

docs(start): add rendering-markdown to navigation config
2493d7f

tannerlinsley merged commit 5ae9461 into mainDec 19, 2025
5 of 6 checks passed

tannerlinsley deleted the claude/markdown-import-guide-UNy5i branch December 19, 2025 18:55

coderabbitaiBot mentioned this pull request Feb 10, 2026
Add missing imports in markdown guide #6628
Open

Navigation Menu

Uh oh!

Uh oh!

Create markdown import and rendering guide - #6150

Create markdown import and rendering guide#6150
tannerlinsley merged 3 commits into
mainfrom
claude/markdown-import-guide-UNy5i

tannerlinsley commented Dec 19, 2025•
edited by coderabbitai Bot
Loading

Uh oh!

coderabbitaiBot commented Dec 19, 2025•
edited
Loading

Review failed

Uh oh!

nx-cloudBot commented Dec 19, 2025•
edited
Loading

Uh oh!

pkg-pr-newBot commented Dec 19, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Uh oh!

Conversation

tannerlinsley commented Dec 19, 2025• edited by coderabbitai BotLoading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitaiBot commented Dec 19, 2025• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review failed

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Uh oh!

nx-cloudBot commented Dec 19, 2025• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

pkg-pr-newBot commented Dec 19, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

tannerlinsley commented Dec 19, 2025•
edited by coderabbitai Bot
Loading

coderabbitaiBot commented Dec 19, 2025•
edited
Loading

nx-cloudBot commented Dec 19, 2025•
edited
Loading