Stagehand + Next.js Quickstart

R
Renaudil y a 2 jours
0

Description

Stagehand extends the power of Playwright, allowing you to reliably automate browsers in natural language.

npx boilerapp stagehand-next-js-quickstart

文档

🤘 Welcome to Stagehand Next.js!

Deploy with Vercel

Hey! This is a Next.js project built with Stagehand.

You can build your own web agent using: npx create-browser-app!

Setting the Stage

Stagehand is an SDK for automating browsers. It's built on top of Playwright and provides a higher-level API for better debugging and AI fail-safes.

Curtain Call

Get ready for a show-stopping development experience. Just run:

npm install && npm run dev

What's Next?

Add your API keys

This project defaults to using OpenAI, so it's going to throw a fit if you don't have an OpenAI API key.

To use Anthropic (or other LLMs), you'll need to edit stagehand.config.ts to use the appropriate API key.

You'll also want to set your Browserbase API key and project ID to run this project in the cloud.

cp .example.env .env # Add your API keys to .env

Custom .cursorrules

We have custom .cursorrules for this project. It'll help quite a bit with writing Stagehand easily.

Run on Browserbase

To run on Browserbase, add your API keys to .env and change env: "LOCAL" to env: "BROWSERBASE" in stagehand.config.ts.

Use Anthropic Claude 3.5 Sonnet

  1. Add your API key to .env
  2. Change modelName: "gpt-4o" to modelName: "claude-3-5-sonnet-latest" in stagehand.config.ts
  3. Change modelClientOptions: { apiKey: process.env.OPENAI_API_KEY } to modelClientOptions: { apiKey: process.env.ANTHROPIC_API_KEY } in stagehand.config.ts

Prix

Gratuit

FREE

评论 (0)

常见问题

常见问题解答 (FAQ)

有问题?我们有答案。如果您找不到想要的答案,请随时联络我们。

Boilerapp 是一个专门用于分享 Boilerplates、入门套件(Starter Kits)和项目模版的开发者社区平台。我们的目标很简单:为您节省初始配置(Setup)的时间,让您可以专注于真正重要的代码。无论您是在寻找简单的代码库还是完整的 SaaS 项目,都能在这里找到。

还有其他问题?

我们的团队随时为您提供帮助。联络我们,我们将尽快回复。

Stagehand + Next.js Quickstart | BoilerApp