diff --git a/content/examples/01-next-app/index.mdx b/content/examples/01-next-app/index.mdx deleted file mode 100644 index 9c5b1150486..00000000000 --- a/content/examples/01-next-app/index.mdx +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: Next.js App Router -description: Explore examples of how to use the AI SDK in Next.js App Router Application. ---- - -# Examples for Next.js App Router - -The AI SDK is designed to work with Next.js App Router. Since the App Router has first class support for React Server Components, you can use the `ai/rsc` module to build applications with features like [Generative User Interfaces](/docs/ai-sdk-rsc) and better [Server-Client State Management](/docs/ai-sdk-rsc/generative-ui-state). - -As a result, the examples will demonstrate querying the language model and streaming the response to the client using React Server Components and Server Actions from `ai/rsc`, instead of using Route Handlers and hooks such as `useChat` and `useCompletion` from `ai/react`. - -## Next.js Compatibility - -| Framework | ai/rsc | ai/core | ai/react | -| -------------------- | -------- | -------- | -------- | -| Next.js App Router | | | | -| Next.js Pages Router | | | | - -> **Note:** It is still possible to query the language model with Route Handlers and manage the response using hooks in the App Router, but it is recommended to use React Server Components for better performance and developer experience. diff --git a/content/examples/02-next-pages/01-basics/01-generating-text.mdx b/content/examples/01-next/01-basics/01-generating-text.mdx similarity index 100% rename from content/examples/02-next-pages/01-basics/01-generating-text.mdx rename to content/examples/01-next/01-basics/01-generating-text.mdx diff --git a/content/examples/02-next-pages/01-basics/02-streaming-text-generation.mdx b/content/examples/01-next/01-basics/02-streaming-text-generation.mdx similarity index 100% rename from content/examples/02-next-pages/01-basics/02-streaming-text-generation.mdx rename to content/examples/01-next/01-basics/02-streaming-text-generation.mdx diff --git a/content/examples/02-next-pages/01-basics/03-generating-object.mdx b/content/examples/01-next/01-basics/03-generating-object.mdx similarity index 100% rename from content/examples/02-next-pages/01-basics/03-generating-object.mdx rename to content/examples/01-next/01-basics/03-generating-object.mdx diff --git a/content/examples/02-next-pages/01-basics/04-streaming-object-generation.mdx b/content/examples/01-next/01-basics/04-streaming-object-generation.mdx similarity index 100% rename from content/examples/02-next-pages/01-basics/04-streaming-object-generation.mdx rename to content/examples/01-next/01-basics/04-streaming-object-generation.mdx diff --git a/content/examples/02-next-pages/01-basics/index.mdx b/content/examples/01-next/01-basics/index.mdx similarity index 100% rename from content/examples/02-next-pages/01-basics/index.mdx rename to content/examples/01-next/01-basics/index.mdx diff --git a/content/examples/02-next-pages/05-chat/01-generate-chat-completion.mdx b/content/examples/01-next/05-chat/01-generate-chat-completion.mdx similarity index 100% rename from content/examples/02-next-pages/05-chat/01-generate-chat-completion.mdx rename to content/examples/01-next/05-chat/01-generate-chat-completion.mdx diff --git a/content/examples/02-next-pages/05-chat/02-stream-chat-completion.mdx b/content/examples/01-next/05-chat/02-stream-chat-completion.mdx similarity index 100% rename from content/examples/02-next-pages/05-chat/02-stream-chat-completion.mdx rename to content/examples/01-next/05-chat/02-stream-chat-completion.mdx diff --git a/content/examples/02-next-pages/05-chat/10-use-chat-image-input.mdx b/content/examples/01-next/05-chat/10-use-chat-image-input.mdx similarity index 100% rename from content/examples/02-next-pages/05-chat/10-use-chat-image-input.mdx rename to content/examples/01-next/05-chat/10-use-chat-image-input.mdx diff --git a/content/examples/02-next-pages/05-chat/15-use-chat-custom-body.mdx b/content/examples/01-next/05-chat/15-use-chat-custom-body.mdx similarity index 100% rename from content/examples/02-next-pages/05-chat/15-use-chat-custom-body.mdx rename to content/examples/01-next/05-chat/15-use-chat-custom-body.mdx diff --git a/content/examples/02-next-pages/05-chat/index.mdx b/content/examples/01-next/05-chat/index.mdx similarity index 100% rename from content/examples/02-next-pages/05-chat/index.mdx rename to content/examples/01-next/05-chat/index.mdx diff --git a/content/examples/02-next-pages/10-tools/01-call-tool.mdx b/content/examples/01-next/10-tools/01-call-tool.mdx similarity index 100% rename from content/examples/02-next-pages/10-tools/01-call-tool.mdx rename to content/examples/01-next/10-tools/01-call-tool.mdx diff --git a/content/examples/02-next-pages/10-tools/05-call-tools-in-parallel.mdx b/content/examples/01-next/10-tools/05-call-tools-in-parallel.mdx similarity index 100% rename from content/examples/02-next-pages/10-tools/05-call-tools-in-parallel.mdx rename to content/examples/01-next/10-tools/05-call-tools-in-parallel.mdx diff --git a/content/examples/02-next-pages/10-tools/10-render-interface-during-tool-call.mdx b/content/examples/01-next/10-tools/10-render-interface-during-tool-call.mdx similarity index 100% rename from content/examples/02-next-pages/10-tools/10-render-interface-during-tool-call.mdx rename to content/examples/01-next/10-tools/10-render-interface-during-tool-call.mdx diff --git a/content/examples/02-next-pages/10-tools/index.mdx b/content/examples/01-next/10-tools/index.mdx similarity index 100% rename from content/examples/02-next-pages/10-tools/index.mdx rename to content/examples/01-next/10-tools/index.mdx diff --git a/content/examples/02-next-pages/11-state-management/01-save-messages.mdx b/content/examples/01-next/11-state-management/01-save-messages.mdx similarity index 100% rename from content/examples/02-next-pages/11-state-management/01-save-messages.mdx rename to content/examples/01-next/11-state-management/01-save-messages.mdx diff --git a/content/examples/02-next-pages/11-state-management/02-restore-messages.mdx b/content/examples/01-next/11-state-management/02-restore-messages.mdx similarity index 100% rename from content/examples/02-next-pages/11-state-management/02-restore-messages.mdx rename to content/examples/01-next/11-state-management/02-restore-messages.mdx diff --git a/content/examples/02-next-pages/11-state-management/index.mdx b/content/examples/01-next/11-state-management/index.mdx similarity index 100% rename from content/examples/02-next-pages/11-state-management/index.mdx rename to content/examples/01-next/11-state-management/index.mdx diff --git a/content/examples/02-next-pages/12-interface/01-route-components.mdx b/content/examples/01-next/12-interface/01-route-components.mdx similarity index 100% rename from content/examples/02-next-pages/12-interface/01-route-components.mdx rename to content/examples/01-next/12-interface/01-route-components.mdx diff --git a/content/examples/02-next-pages/12-interface/index.mdx b/content/examples/01-next/12-interface/index.mdx similarity index 100% rename from content/examples/02-next-pages/12-interface/index.mdx rename to content/examples/01-next/12-interface/index.mdx diff --git a/content/examples/02-next-pages/15-assistants/01-stream-assistant-responses.mdx b/content/examples/01-next/15-assistants/01-stream-assistant-responses.mdx similarity index 100% rename from content/examples/02-next-pages/15-assistants/01-stream-assistant-responses.mdx rename to content/examples/01-next/15-assistants/01-stream-assistant-responses.mdx diff --git a/content/examples/02-next-pages/15-assistants/05-stream-assistant-responses-with-tools.mdx b/content/examples/01-next/15-assistants/05-stream-assistant-responses-with-tools.mdx similarity index 100% rename from content/examples/02-next-pages/15-assistants/05-stream-assistant-responses-with-tools.mdx rename to content/examples/01-next/15-assistants/05-stream-assistant-responses-with-tools.mdx diff --git a/content/examples/02-next-pages/15-assistants/index.mdx b/content/examples/01-next/15-assistants/index.mdx similarity index 100% rename from content/examples/02-next-pages/15-assistants/index.mdx rename to content/examples/01-next/15-assistants/index.mdx diff --git a/content/examples/01-next/index.mdx b/content/examples/01-next/index.mdx new file mode 100644 index 00000000000..e35791edc36 --- /dev/null +++ b/content/examples/01-next/index.mdx @@ -0,0 +1,8 @@ +--- +title: Next.js +description: Explore examples of how to use the AI SDK in a Next.js Application. +--- + +# Next.js + +The following examples demonstrate how to achieve different use cases while integrating AI into your Next.js application. diff --git a/content/examples/02-next-pages/index.mdx b/content/examples/02-next-pages/index.mdx deleted file mode 100644 index d6402a896a9..00000000000 --- a/content/examples/02-next-pages/index.mdx +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: Next.js Pages Router -description: Explore examples of how to use the AI SDK in Next.js Pages Router. ---- - -# Examples for Next.js Pages Router - -The AI SDK is designed to work with Next.js Pages Router. The examples will demonstrate querying the language model and rendering the user interfaces using `ai/core` and `ai/react`, respectively. - -## Next.js Compatibility - -| Framework | ai/rsc | ai/core | ai/react | -| -------------------- | -------- | -------- | -------- | -| Next.js App Router | | | | -| Next.js Pages Router | | | | - -> **Note:** The App Router fully supports React Server Components, enhancing your development experience when using `ai/rsc`. This integration makes it easier to manage building [Generative User Interfaces](/docs/ai-sdk-rsc) and improves [Server-Client State Management](/docs/ai-sdk-rsc/generative-ui-state), offering a more streamlined development process. diff --git a/content/examples/01-next-app/01-basics/01-generating-text.mdx b/content/examples/05-rsc/01-basics/01-generating-text.mdx similarity index 100% rename from content/examples/01-next-app/01-basics/01-generating-text.mdx rename to content/examples/05-rsc/01-basics/01-generating-text.mdx diff --git a/content/examples/01-next-app/01-basics/02-streaming-text-generation.mdx b/content/examples/05-rsc/01-basics/02-streaming-text-generation.mdx similarity index 100% rename from content/examples/01-next-app/01-basics/02-streaming-text-generation.mdx rename to content/examples/05-rsc/01-basics/02-streaming-text-generation.mdx diff --git a/content/examples/01-next-app/01-basics/03-generating-object.mdx b/content/examples/05-rsc/01-basics/03-generating-object.mdx similarity index 100% rename from content/examples/01-next-app/01-basics/03-generating-object.mdx rename to content/examples/05-rsc/01-basics/03-generating-object.mdx diff --git a/content/examples/01-next-app/01-basics/04-streaming-object-generation.mdx b/content/examples/05-rsc/01-basics/04-streaming-object-generation.mdx similarity index 100% rename from content/examples/01-next-app/01-basics/04-streaming-object-generation.mdx rename to content/examples/05-rsc/01-basics/04-streaming-object-generation.mdx diff --git a/content/examples/01-next-app/01-basics/index.mdx b/content/examples/05-rsc/01-basics/index.mdx similarity index 100% rename from content/examples/01-next-app/01-basics/index.mdx rename to content/examples/05-rsc/01-basics/index.mdx diff --git a/content/examples/01-next-app/02-chat/01-generate-chat-completion.mdx b/content/examples/05-rsc/02-chat/01-generate-chat-completion.mdx similarity index 100% rename from content/examples/01-next-app/02-chat/01-generate-chat-completion.mdx rename to content/examples/05-rsc/02-chat/01-generate-chat-completion.mdx diff --git a/content/examples/01-next-app/02-chat/02-stream-chat-completion.mdx b/content/examples/05-rsc/02-chat/02-stream-chat-completion.mdx similarity index 100% rename from content/examples/01-next-app/02-chat/02-stream-chat-completion.mdx rename to content/examples/05-rsc/02-chat/02-stream-chat-completion.mdx diff --git a/content/examples/01-next-app/02-chat/index.mdx b/content/examples/05-rsc/02-chat/index.mdx similarity index 100% rename from content/examples/01-next-app/02-chat/index.mdx rename to content/examples/05-rsc/02-chat/index.mdx diff --git a/content/examples/01-next-app/03-tools/01-call-tool.mdx b/content/examples/05-rsc/03-tools/01-call-tool.mdx similarity index 100% rename from content/examples/01-next-app/03-tools/01-call-tool.mdx rename to content/examples/05-rsc/03-tools/01-call-tool.mdx diff --git a/content/examples/01-next-app/03-tools/02-call-tools-in-parallel.mdx b/content/examples/05-rsc/03-tools/02-call-tools-in-parallel.mdx similarity index 100% rename from content/examples/01-next-app/03-tools/02-call-tools-in-parallel.mdx rename to content/examples/05-rsc/03-tools/02-call-tools-in-parallel.mdx diff --git a/content/examples/01-next-app/03-tools/03-render-interface-during-tool-call.mdx b/content/examples/05-rsc/03-tools/03-render-interface-during-tool-call.mdx similarity index 100% rename from content/examples/01-next-app/03-tools/03-render-interface-during-tool-call.mdx rename to content/examples/05-rsc/03-tools/03-render-interface-during-tool-call.mdx diff --git a/content/examples/01-next-app/03-tools/index.mdx b/content/examples/05-rsc/03-tools/index.mdx similarity index 100% rename from content/examples/01-next-app/03-tools/index.mdx rename to content/examples/05-rsc/03-tools/index.mdx diff --git a/content/examples/01-next-app/04-state-management/01-ai-ui-states.mdx b/content/examples/05-rsc/04-state-management/01-ai-ui-states.mdx similarity index 100% rename from content/examples/01-next-app/04-state-management/01-ai-ui-states.mdx rename to content/examples/05-rsc/04-state-management/01-ai-ui-states.mdx diff --git a/content/examples/01-next-app/04-state-management/02-save-and-restore-states.mdx b/content/examples/05-rsc/04-state-management/02-save-and-restore-states.mdx similarity index 100% rename from content/examples/01-next-app/04-state-management/02-save-and-restore-states.mdx rename to content/examples/05-rsc/04-state-management/02-save-and-restore-states.mdx diff --git a/content/examples/01-next-app/04-state-management/index.mdx b/content/examples/05-rsc/04-state-management/index.mdx similarity index 100% rename from content/examples/01-next-app/04-state-management/index.mdx rename to content/examples/05-rsc/04-state-management/index.mdx diff --git a/content/examples/01-next-app/05-interface/01-route-components.mdx b/content/examples/05-rsc/05-interface/01-route-components.mdx similarity index 100% rename from content/examples/01-next-app/05-interface/01-route-components.mdx rename to content/examples/05-rsc/05-interface/01-route-components.mdx diff --git a/content/examples/01-next-app/05-interface/02-stream-component-updates.mdx b/content/examples/05-rsc/05-interface/02-stream-component-updates.mdx similarity index 100% rename from content/examples/01-next-app/05-interface/02-stream-component-updates.mdx rename to content/examples/05-rsc/05-interface/02-stream-component-updates.mdx diff --git a/content/examples/01-next-app/05-interface/03-token-usage.mdx b/content/examples/05-rsc/05-interface/03-token-usage.mdx similarity index 100% rename from content/examples/01-next-app/05-interface/03-token-usage.mdx rename to content/examples/05-rsc/05-interface/03-token-usage.mdx diff --git a/content/examples/01-next-app/05-interface/index.mdx b/content/examples/05-rsc/05-interface/index.mdx similarity index 100% rename from content/examples/01-next-app/05-interface/index.mdx rename to content/examples/05-rsc/05-interface/index.mdx diff --git a/content/examples/01-next-app/06-assistants/01-stream-assistant-responses.mdx b/content/examples/05-rsc/06-assistants/01-stream-assistant-responses.mdx similarity index 100% rename from content/examples/01-next-app/06-assistants/01-stream-assistant-responses.mdx rename to content/examples/05-rsc/06-assistants/01-stream-assistant-responses.mdx diff --git a/content/examples/01-next-app/06-assistants/02-stream-assistant-responses-with-tools.mdx b/content/examples/05-rsc/06-assistants/02-stream-assistant-responses-with-tools.mdx similarity index 100% rename from content/examples/01-next-app/06-assistants/02-stream-assistant-responses-with-tools.mdx rename to content/examples/05-rsc/06-assistants/02-stream-assistant-responses-with-tools.mdx diff --git a/content/examples/01-next-app/06-assistants/index.mdx b/content/examples/05-rsc/06-assistants/index.mdx similarity index 100% rename from content/examples/01-next-app/06-assistants/index.mdx rename to content/examples/05-rsc/06-assistants/index.mdx diff --git a/content/examples/05-rsc/index.mdx b/content/examples/05-rsc/index.mdx new file mode 100644 index 00000000000..0cd729396e1 --- /dev/null +++ b/content/examples/05-rsc/index.mdx @@ -0,0 +1,15 @@ +--- + +title: RSC (experimental) +description: Explore examples of how to use the AI SDK RSC in a Next.js application. +---` + +RSC (experimental) + + + AI SDK RSC is currently experimental. We recommend using [AI SDK + UI](/docs/ai-sdk-ui/overview) for production. For guidance on migrating from + RSC to UI, see our [migration guide](/docs/ai-sdk-rsc/migrating-to-ui). + + +The AI SDK provides tools for frameworks that support React Server Components (RSC). The following examples demonstrate how to achieve different use cases while integrating AI into your RSC powered applications.