Add environment variables to docs (#210)

README.md

@@ -1,13 +1,13 @@
 <h1 align="center">
   <font size="30">
   <b>
-    E2B - Cloud for AI Agents & Apps
+    E2B - Sandbox Runtime for LLMs
   </b>
   </font>
 </h1>
 
 <h3 align="center">
-  Sandboxed cloud environments for AI agents & apps with a single line of code
+  Sandboxed cloud environments for AI-powered apps and agentic workflows
 </h3>
 
 <h4 align="center">
@@ -26,7 +26,10 @@
   </a>
 </h4>
 
-[E2B](https://e2b.dev) is cloud for AI agents and AI apps. With E2B, you can create AI playgrounds. In these AI playgrounds, you can let your AI agents and apps:
+[E2B](https://e2b.dev) is cloud for AI agents and AI apps. With E2B, you can
+create AI playgrounds. In these AI playgrounds, you can let your AI agents and
+apps:
+
 - Run any code and terminal command in a sandboxed environment
 - Install dependencies and programs
 - Use filesystem
@@ -38,19 +41,21 @@
 
 This just a few examples of what can be done with our agent cloud environments.
 
-**Our SDK works with any AI agent (no matter what framework, you're using), and without the need to manage any infrastructure.**
-
+**Our SDK works with any AI agent (no matter what framework, you're using), and
+without the need to manage any infrastructure.**
 
 ## Getting Started & Documentation
 
 Visit [docs](https://e2b.dev/docs) to get started with the SDK.
 
 ### Python
+
 ```bash
 pip install e2b
 ```
 
 ### JavaScript & TypeScript
+
 ```bash
 npm install @e2b/sdk
 ```

apps/docs/src/app/sandbox/envs/page.mdx

@@ -0,0 +1,21 @@
+# Setting environment variables
+
+## Global environment variables
+You can set the sandbox's global environment variables when you're initializing a new sandbox.
+<CodeGroupAutoload
+  path="basics/set_env_vars"
+  isRunnable={false}
+/>
+
+
+## Environment variables per process
+Alternatively, you can set environment variables when starting a new process. These environment variables are accessible only for this process.
+
+<Note>
+Environment variables set when starting a a new process have precedence over the environment variables set when initializing the sandbox.
+</Note>
+
+<CodeGroupAutoload
+  path="basics/process_env_vars"
+  isRunnable={true}
+/>

apps/docs/src/app/sandbox/process/page.mdx

@@ -2,13 +2,12 @@
 
 Here are the basic operations you can do with the process inside a LLM sandbox:
 
-- [Start process](/playgrounds/process#start-process)
-- [Stop process](/playgrounds/process#stop-process)
-- [Stdout](/playgrounds/process#stream-stdout)
-- [Stdin](/playgrounds/process#send-stdin)
-- [Stderr](/playgrounds/process#stream-stderr)
-- [On exit](/playgrounds/process#on-process-exit)
-- [Environment variables](/playgrounds/process#set-environment-variables)
+- [Start process](/sandbox/process#start-process)
+- [Stop process](/sandbox/process#stop-process)
+- [Stdout](/sandbox/process#stream-stdout)
+- [Stdin](/sandbox/process#send-stdin)
+- [Stderr](/sandbox/process#stream-stderr)
+- [On exit](/sandbox/process#on-process-exit)
 
 ## Start process
 
@@ -57,12 +56,3 @@ Set either on exit handler for whole session level or per process.
   path="basics/process_write_stdin"
   isRunnable={true}
 />
-
-## Set environment variables
-
-Environment variables set on process has precedence over the ones set on the session.
-
-<CodeGroupAutoload
-  path="basics/set_env_vars"
-  isRunnable={true}
-/>

apps/docs/src/app/sandbox/resources/page.mdx

@@ -1,8 +1,8 @@
-# Sandbox Resources
+# Sandbox resources
 
 ### Available resources
 - 4 vCPU {{ className: 'lead' }}
 - 1GB RAM {{ className: 'lead' }}
 - 2.5GB storage {{ className: 'lead' }}
 
-If you need more resources, please [contact us](mailto:hello@e2b.dev) with your use case.
+If you need more resources, please [reach out to us](/getting-help) with your use case.

apps/docs/src/code/js/basics/process_env_vars.js

@@ -0,0 +1,16 @@
+import { Session } from '@e2b/sdk'
+
+const session = await Session.create({
+  id: 'Nodejs',
+  envVars: { FOO: 'Hello' },
+})
+
+const proc = await session.process.start({
+  cmd: 'echo $FOO $BAR!',
+  envVars: { BAR: 'World' }, // $HighlightLine
+})
+await proc.wait()
+console.log(proc.output.stdout)
+// output: Hello World!
+
+await session.close()

apps/docs/src/code/js/basics/set_env_vars.js

@@ -5,14 +5,4 @@ const session = await Session.create({
   envVars: { FOO: 'Hello' }, // $HighlightLine
 })
 
-// This example will print back the string we send to the process using `sendStdin()`
-
-const proc = await session.process.start({
-  cmd: 'echo $FOO $BAR!',
-  envVars: { BAR: 'World' }, // $HighlightLine
-})
-await proc.wait()
-console.log(proc.output.stdout)
-// output: Hello World!
-
 await session.close()

apps/docs/src/code/python/basics/process_env_vars.py

@@ -0,0 +1,17 @@
+from e2b import Session
+
+session = Session.create(
+    id="Nodejs",
+    env_vars={"FOO": "Hello"}
+)
+
+proc = session.process.start(
+    "echo $FOO $BAR!",
+    env_vars={"BAR": "World"},  # $HighlightLine
+)
+proc.wait()
+
+print(proc.output.stdout)
+# output: Hello World!
+
+session.close()

apps/docs/src/code/python/basics/set_env_vars.py

@@ -5,13 +5,4 @@
     env_vars={"FOO": "Hello"}  # $HighlightLine
 )
 
-proc = session.process.start(
-    "echo $FOO $BAR!",
-    env_vars={"BAR": "World"},  # $HighlightLine
-)
-proc.wait()
-
-print(proc.output.stdout)
-# output: Hello World!
-
 session.close()

apps/docs/src/components/Header.tsx

@@ -86,7 +86,7 @@ export const Header = forwardRef(function Header({ className }, ref) {
         className={clsx(
           'absolute inset-x-0 top-full h-px transition',
           (isInsideMobileNavigation || !mobileNavIsOpen) &&
-            'bg-zinc-900/7.5 dark:bg-white/7.5',
+          'bg-zinc-900/7.5 dark:bg-white/7.5',
         )}
       />
       <div className="relative top-1 hidden items-start justify-start lg:flex">

apps/docs/src/components/Navigation/routes.tsx

@@ -13,6 +13,7 @@ import {
   Link,
   FileUp,
   FileDown,
+  Variable,
 } from 'lucide-react'
 
 export const routes = [
@@ -106,19 +107,19 @@ export const routes = [
             size={20}
           />
         ),
-        title: 'Resources',
+        title: 'Sandbox Resources',
         href: '/sandbox/resources',
       },
-      // {
-      //   icon: (
-      //     <Variable
-      //       strokeWidth={1}
-      //       size={20}
-      //     />
-      //   ),
-      //   title: '[TODO] Environment Variables',
-      //   href: '/sandbox/envs',
-      // },
+      {
+        icon: (
+          <Variable
+            strokeWidth={1}
+            size={20}
+          />
+        ),
+        title: 'Environment Variables',
+        href: '/sandbox/envs',
+      },
       {
         icon: (
           <FolderTree