Start your first Session with Puppeteer

Get started with a Puppeteer Node.js template

Clone this GitHub repo to start using Browserbase with Puppeteer.

1. Get your API Key

   Your API key and Project ID are displayed in the Overview Dashboard:

   

   Then copy your API Key directly from the input and update your .env by adding the BROWSERBASE_API_KEY entry

   Alternatively, you can temporarily set the environment variable for a single bash command by prefixing it with BROWSERBASE_API_KEY=<your_api_key> in your terminal.

2. Install dependencies

   Node.js

   npm i puppeteer-core @browserbasehq/sdk
   

   
   
3. Update your code or clone a template

   Running your existing code with Browserbase only requires a few line changes:

   Node.js

   import puppeteer from "puppeteer-core";
   import Browserbase from "@browserbasehq/sdk";
   
   const BROWSERBASE_API_KEY = process.env["BROWSERBASE_API_KEY"]!;
   const BROWSERBASE_PROJECT_ID = process.env["BROWSERBASE_PROJECT_ID"]!;
   
   const bb = new Browserbase({
     apiKey: BROWSERBASE_API_KEY,
   });
   
   (async () => {
     // Create a new session
     const session = await bb.sessions.create({
       projectId: BROWSERBASE_PROJECT_ID,
     });
   
     // Connect to the session
     const browser = await puppeteer.connect({
       browserWSEndpoint: session.connectUrl
     });
   
     const pages = await browser.pages();
     const page = pages[0];
   
     await page.goto("https://news.ycombinator.com");
     await page.close();
     await browser.close();
     console.log(`Session complete! View replay at https://browserbase.com/sessions/${session.id}`);
   })().catch((error) => console.error(error.message));
   

   Be sure to set your BROWSERBASE_API_KEY and BROWSERBASE_PROJECT_ID environment variables to the values you copied from the Dashboard.

   Get started with a Puppeteer Node.js template

   Clone this GitHub repo to get started with Puppeteer

4. Inspect the completed Session

   You can find all the recent sessions on the Overview Dashboard, along with essential metrics:

   

   Select your Session to inspect it with the Session Inspector.

Start building

Using Browser Sessions

Learn how to connect to and interact with browser sessions effectively.

Managing Sessions

Understand how to properly end sessions and manage their lifecycle.