👌 IMPROVE: lingo

apps/baseai.dev/content/docs/guides/nextjs-with-baseai.mdx

@@ -19,7 +19,7 @@ This guide covers building AI features in a Next.js app using BaseAI, focusing o
 
 ## Next.js with BaseAI Example
 
-We also have pre-built a Next.js app with BaseAI for you to get started quickly. You can refer to the following resources to understand how to build a Next.js app with BaseAI. 
+We also have pre-built a Next.js app with BaseAI for you to get started quickly. You can refer to the following resources to understand how to build a Next.js app with BaseAI.
 
 - [Next.js with BaseAI](https://github.com/LangbaseInc/baseai/tree/main/examples/nextjs)
 - [Example of using BaseAI](https://github.com/LangbaseInc/baseai/tree/main/examples/nextjs/app/demo)
@@ -37,7 +37,7 @@ We also have pre-built a Next.js app with BaseAI for you to get started quickly.
 - [React Component](https://github.com/LangbaseInc/baseai/blob/main/examples/nextjs/components/pipe-stream.tsx)
 - [API Route Handler](https://github.com/LangbaseInc/baseai/blob/main/examples/nextjs/app/api/langbase/pipes/run-stream/route.ts)
 
-### `usePipe()`: Chat 
+### `usePipe()`: Chat
 
 - [React Component](https://github.com/LangbaseInc/baseai/blob/main/examples/nextjs/components/chat-simple.tsx)
 - [API Route Handler](https://github.com/LangbaseInc/baseai/blob/main/examples/nextjs/app/api/langbase/pipes/run-stream/route.ts)
@@ -93,7 +93,7 @@ Create a new pipe using the `pipe` command. Use `summary` as the pipe name and f
 npx baseai@latest pipe
 ```
 
-It creates a pipe at `baseai/pipes/summary.ts` in your current directory. 
+It creates a pipe at `baseai/pipes/summary.ts` in your current directory.
 
 ---
 
@@ -138,7 +138,7 @@ export async function POST(req: NextRequest) {
 
 Add following to your Next.js app to run the pipe.
 
-- Pipe run **page** at `app/pipe-run/page.tsx` 
+- Pipe run **page** at `app/pipe-run/page.tsx`
 - Pipe run **component** at `components/pipe-run.tsx` — This component will run the pipe.
 - UI **Button** component at `components/ui/button.tsx`
 - UI **Input** component at `components/ui/input.tsx`
@@ -333,7 +333,39 @@ Refer to [Next.js with BaseAI](https://github.com/LangbaseInc/baseai/tree/main/e
 
 ---
 
-## Step #7: Run the Next.js BaseAI App
+## Step #9: Add environment variables
+
+To be able to run and later deploy your Next.js app, you need to add providers and Langbase API keys.
+
+```bash
+# !! SERVER SIDE ONLY !!
+# Keep all your API keys secret — use only on the server side.
+
+# TODO: ADD: Both in your production and local env files.
+# Langbase API key for your User or Org account.
+# How to get this API key https://langbase.com/docs/api-reference/api-keys
+LANGBASE_API_KEY=
+
+# TODO: ADD: LOCAL ONLY. Add only to local env files.
+# Following keys are needed for local pipe runs. For providers you are using.
+# For Langbase, please add the key to your LLM keysets.
+# Read more: Langbase LLM Keysets https://langbase.com/docs/features/keysets
+OPENAI_API_KEY=
+ANTHROPIC_API_KEY=
+COHERE_API_KEY=
+FIREWORKS_API_KEY=
+GOOGLE_API_KEY=
+GROQ_API_KEY=
+MISTRAL_API_KEY=
+PERPLEXITY_API_KEY=
+TOGETHER_API_KEY=
+```
+
+`LANGBASE_API_KEY` is the user or org API key that you authenticated with. You can obtain your [User/Org API Key](https://langbase.com/docs/api-reference/api-keys) from the Langbase dashboard.
+
+---
+
+## Step #8: Run the Next.js BaseAI App
 
 Run BaseAI dev server and start the Next.js app.
 
@@ -348,33 +380,20 @@ Write a prompt message and click on the `Ask AI` button to generate the completi
 
 ---
 
-## Step #8: Deploy BaseAI project on Langbase
+## Step #9: Deploy BaseAI project on Langbase
 
 To deploy the project on Langbase, you need to authenticate with your Langbase account.
 
 ```bash
 npx baseai@latest auth
 ```
 
-After authentication, you can deploy the project using the following command.
+After authentication, you can deploy the project using the following command. When you deploy, you need to add keys for providers like OpenAI, Google, etc., in [Langbase Keysets](https://langbase.com/docs/features/keysets).
 
 ```bash
 npx baseai@latest deploy
 ```
 
-This will deploy your project on Langbase and you can access it as a highly scalable API. Check the [BaseAI `deploy` documentation](https://baseai.dev/docs/deployment/deploy) for more details.
+This will deploy your project on Langbase and you can access it as a serverless highly scalable API. Check the [BaseAI `deploy` documentation](https://baseai.dev/docs/deployment/deploy) for more details.
 
 ---
-
-## Step #9: Deploy Next.js app 
-
-Deploy your Next.js app using Vercel or any other hosting provider and set the following environment variables.
-
-```bash
-OPENAI_API_KEY="" #your_openai_api_key
-LANGBASE_API_KEY="" #your_langbase_api_key
-```
-
-Langbase API key is the user or org API key that you authenticated with. You can obtain your [User/Org API Key](https://langbase.com/docs/api-reference/api-keys) from the Langbase dashboard.
-
----