diff --git a/packages/docs/src/App.tsx b/packages/docs/src/App.tsx index bb5be45..4c028fa 100644 --- a/packages/docs/src/App.tsx +++ b/packages/docs/src/App.tsx @@ -182,16 +182,22 @@ export const routes = [ ], }), route({ - path: "/react-server-components", - component: defer(, { - name: "LearnRscPage", - }), - }), - route({ - path: "/route-definitions", - component: defer(, { - name: "LearnRouteDefinitionsPage", - }), + path: "/rsc", + component: , + children: [ + route({ + path: "/", + component: defer(, { + name: "LearnRscPage", + }), + }), + route({ + path: "/route-features", + component: defer(, { + name: "LearnRouteDefinitionsPage", + }), + }), + ], }), route({ path: "/actions", diff --git a/packages/docs/src/pages/ApiUtilitiesPage.tsx b/packages/docs/src/pages/ApiUtilitiesPage.tsx index 7bb5f49..ea4f8a7 100644 --- a/packages/docs/src/pages/ApiUtilitiesPage.tsx +++ b/packages/docs/src/pages/ApiUtilitiesPage.tsx @@ -349,7 +349,7 @@ const routes = [
  • bindRoute - Binds a component to a partial route definition (see{" "} - Two-Phase Route Definitions) + Two-Phase Route Definitions)
  • Types: ActionArgs, LoaderArgs,{" "} @@ -363,10 +363,9 @@ const routes = [ , and hooks, use the main @funstack/router entry point.

    - See the{" "} - React Server Components{" "} - guide for a full walkthrough of using the server entry point, and the{" "} - Two-Phase Route Definitions{" "} + See the React Server Components guide for a + full walkthrough of using the server entry point, and the{" "} + Two-Phase Route Definitions{" "} guide for using bindRoute() to split route definitions across the RSC boundary.

    diff --git a/packages/docs/src/pages/HomePage.tsx b/packages/docs/src/pages/HomePage.tsx index ade5a5b..b6d4673 100644 --- a/packages/docs/src/pages/HomePage.tsx +++ b/packages/docs/src/pages/HomePage.tsx @@ -108,7 +108,7 @@ export function HomePage() {

    RSC Compatible

    Designed to work with React Server Components.{" "} - Learn more + Learn more

    diff --git a/packages/docs/src/pages/LearnIndexPage.tsx b/packages/docs/src/pages/LearnIndexPage.tsx index f8c8c87..e158cb3 100644 --- a/packages/docs/src/pages/LearnIndexPage.tsx +++ b/packages/docs/src/pages/LearnIndexPage.tsx @@ -72,27 +72,25 @@ export function LearnIndexPage() {
    -

    - React Server Components -

    -

    - Learn how to use FUNSTACK Router with React Server Components. Define - routes in server modules using the{" "} - @funstack/router/server entry point and keep your client - bundle lean by separating route definitions from runtime router code. -

    -
    -
    -

    - RSC with Route Features -

    +

    React Server Components

    - Use loaders, typed hooks (useRouteParams,{" "} - useRouteData, useRouteState), and navigation - state alongside React Server Components. This guide shows how to split - route definitions across the server/client boundary using{" "} - bindRoute() so client components get full type safety. + FUNSTACK Router is designed to work with React Server Components. + These guides cover how to define routes in server modules and use + route features alongside RSC:

    +
      +
    • + React Server Components — define + routes in server modules using the{" "} + @funstack/router/server entry point and keep your + client bundle lean +
      • +
    • + RSC with Route Features{" "} + — use loaders, typed hooks, and navigation state alongside RSC + by splitting route definitions with bindRoute() +
      • +
    diff --git a/packages/docs/src/pages/LearnPage.tsx b/packages/docs/src/pages/LearnPage.tsx index 74316aa..4714339 100644 --- a/packages/docs/src/pages/LearnPage.tsx +++ b/packages/docs/src/pages/LearnPage.tsx @@ -19,6 +19,8 @@ const learnNavItems: NavEntry[] = [ { path: "/learn/navigation-api", label: "Navigation API" }, { path: "/learn/nested-routes", label: "Nested Routes" }, { path: "/learn/type-safety", label: "Type Safety" }, + { path: "/learn/actions", label: "Form Actions" }, + { path: "/learn/transitions", label: "Transitions" }, { label: "SSR", items: [ @@ -31,15 +33,12 @@ const learnNavItems: NavEntry[] = [ ], }, { - path: "/learn/react-server-components", - label: "React Server Components", - }, - { - path: "/learn/route-definitions", - label: "RSC with Route Features", + label: "RSC", + items: [ + { path: "/learn/rsc", label: "React Server Components" }, + { path: "/learn/rsc/route-features", label: "RSC with Route Features" }, + ], }, - { path: "/learn/actions", label: "Form Actions" }, - { path: "/learn/transitions", label: "Transitions" }, ]; function isNavGroup(entry: NavEntry): entry is NavGroup { diff --git a/packages/docs/src/pages/LearnRscPage.tsx b/packages/docs/src/pages/LearnRscPage.tsx index 7392b21..63144be 100644 --- a/packages/docs/src/pages/LearnRscPage.tsx +++ b/packages/docs/src/pages/LearnRscPage.tsx @@ -271,8 +271,8 @@ export default function App() {
  • For type-safe hooks in client components, see the{" "} - RSC with Route Features guide - which explains how to split route definitions across the + RSC with Route Features{" "} + guide which explains how to split route definitions across the server/client boundary
    • diff --git a/packages/docs/src/pages/LearnSsgPage.tsx b/packages/docs/src/pages/LearnSsgPage.tsx index fc9787c..35dc88a 100644 --- a/packages/docs/src/pages/LearnSsgPage.tsx +++ b/packages/docs/src/pages/LearnSsgPage.tsx @@ -103,11 +103,9 @@ export function LearnSsgPage() {

    If you only need loaders to run at build time (not on the client), - consider using{" "} - React Server Components{" "} - with SSG. RSC lets you fetch data on the server during the build and - send the result as static HTML, without shipping loader code to the - client. + consider using React Server Components with + SSG. RSC lets you fetch data on the server during the build and send + the result as static HTML, without shipping loader code to the client.