Skip to content

Create markdown import and rendering guide #6150

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.

Sign up for GitHub

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

Jump to bottom
Merged
tannerlinsley merged 3 commits into from
Dec 19, 2025
Merged

Create markdown import and rendering guide #6150

tannerlinsley merged 3 commits into from
Dec 19, 2025

Conversation

@tannerlinsley
Copy link
Member

@tannerlinsley tannerlinsley commented Dec 19, 2025 •
edited by coderabbitai bot
Loading

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.

@claude
docs(start): add guide for rendering markdown content
9a408f7 
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.
@github-actions github-actions bot added the documentation Everything documentation related label Dec 19, 2025
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Dec 19, 2025 •
edited
Loading

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

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
Copy link

nx-cloud bot commented Dec 19, 2025 •
edited
Loading

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
Copy link

pkg-pr-new bot commented Dec 19, 2025

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

@tannerlinsley tannerlinsley merged commit 5ae9461 into main Dec 19, 2025
5 of 6 checks passed
@tannerlinsley tannerlinsley deleted the claude/markdown-import-guide-UNy5i branch December 19, 2025 18:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

documentation Everything documentation related

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@tannerlinsley @claude