### Install Herd SDK (CLI)

Source: https://herd.garden/docs/getting-started

Installs the Herd SDK globally using npm, yarn, or pnpm. This command is essential for using Herd from your command line interface.

```bash
npm install -g @monitoro/herd
```

```bash
yarn add global @monitoro/herd
```

```bash
pnpm add -g @monitoro/herd
```

--------------------------------

### MCP SDK Server Setup and Start

Source: https://context7_llms

Demonstrates the initial setup and startup of the MCP Server, which is designed for AI integration via the MCP protocol. It outlines the basic server configuration and the expected request/response format for AI interactions.

```javascript
const { MCPServer } = require('mcp-browser-automation');
const server = new MCPServer({ port: 8000 });
await server.start();

console.log('MCP Browser Automation server is running on port 8000');

// Example AI request format:
/*
{
  "action": "createSession",
  "params": {}
}
*/

// Example AI response format:
/*
{
  "sessionId": "session123",
  "status": "success"
}
*/
```

--------------------------------

### Migration Guide: Apify to Herd Installation (Bash)

Source: https://context7_llms

Provides the necessary bash commands to install the Herd SDK via npm and outlines the prerequisite steps for setting up Herd, including installing the browser extension and registering a browser device.

```bash
npm install @monitoro/herd
```

--------------------------------

### Complete Herd Client and Device Example (Python)

Source: https://context7_llms

A comprehensive Python example demonstrating the full workflow: initializing the HerdClient, getting a device, creating a new page, navigating to a URL, listening for navigation events, listing open pages, and finally closing the client and device.

```python
from monitoro_herd import HerdClient
import asyncio

async def main():
    client = HerdClient(
        token="your-auth-token"
    )
    
    await client.initialize()
    
    # Get a device
    device = await client.get_device("my-browser")
    
    # Create a new page and navigate
    page = await device.new_page()
    await page.goto("https://example.com")
    
    # Listen for navigation events
    def handle_navigation(event):
        print("Page navigated:", event["url"])
    
    device.on("navigation", handle_navigation)
    
    # List all pages
    pages = await device.list_pages()
    print(f"Device has {len(pages)} pages open")
    
    # Cleanup when done
    await device.close()
    await client.close()

# Run the async function
asyncio.run(main())
```

--------------------------------

### SvelteKit Application Initialization

Source: https://herd.garden/docs/getting-started

This JavaScript code snippet demonstrates the initialization process for a SvelteKit application. It dynamically imports necessary modules and starts the application, setting up routing and rendering.

```javascript
{
  __sveltekit_jmmcji = {
    base: new URL("..", location).pathname.slice(0, -1),
    env: {}
  };
  const element = document.currentScript.parentElement;
  const data = [null, null, null];
  Promise.all([
    import("../_app/immutable/entry/start.6a3d3c9b.js"),
    import("../_app/immutable/entry/app.e9d49fce.js")
  ]).then(([kit, app]) => {
    kit.start(app, element, {
      node_ids: [0, 3, 13],
      data,
      form: null,
      error: null
    });
  });
}
```

--------------------------------

### SvelteKit Initialization Script

Source: https://herd.garden/docs/installation

This script initializes the SvelteKit application by loading necessary modules and starting the client-side rendering process. It sets up the base path and environment variables, then asynchronously loads the SvelteKit start and app modules.

```javascript
{ __sveltekit_jmmcji = { base: new URL("..", location).pathname.slice(0, -1), env: {} }; const element = document.currentScript.parentElement; const data = [null,null,null]; Promise.all([ import("../_app/immutable/entry/start.6a3d3c9b.js"), import("../_app/immutable/entry/app.e9d49fce.js") ]).then(([kit, app]) => { kit.start(app, element, { node_ids: [0, 3, 13], data, form: null, error: null }); }); }
```

--------------------------------

### Full Device Interaction Example

Source: https://context7_llms

A comprehensive example demonstrating the typical workflow of using the HerdClient and Device classes. It includes initializing the client, getting a device, creating a new page, navigating, listening for events, listing pages, and finally cleaning up by closing both the device and the client.

```javascript
import { HerdClient } from '@monitoro/herd';

async function main() {
    const client = new HerdClient({
        token: 'your-auth-token'
    });
    
    await client.initialize();
    
    // Get a device
    const device = await client.getDevice('my-browser');
    
    // Create a new page and navigate
    const page = await device.newPage();
    await page.goto('https://example.com');
    
    // Listen for navigation events
    device.on('navigation', (event) => {
        console.log('Page navigated:', event.url);
    });
    
    // List all pages
    const pages = await device.listPages();
    console.log(`Device has ${pages.length} pages open`);
    
    // Cleanup when done
    await device.close();
    await client.close();
}

main().catch(console.error);
```

--------------------------------

### Configure Herd MCP Server

Source: https://herd.garden/docs/getting-started

An example configuration for an MCP (Multi-Agent Communication Protocol) server that uses the Herd CLI to run the browser trail. This allows AI agents to interact with web pages via Herd.

```json
{
    "mcpServers": {
        "browser": {
            "command": "herd",
            "args": [
                "trail",
                "server",
                "@herd/browser"
            ]
        }
    }
}
```

--------------------------------

### Install Selenium Client

Source: https://context7_llms

Instructions for installing the Selenium client library for JavaScript and Python. Selenium requires additional setup for WebDriver management, which must be kept in sync with browser versions.

```javascript
# JavaScript
npm install selenium-webdriver
```

```python
# Python
pip install selenium
```

```bash
# Additionally, you must:
# 1. Download the correct WebDriver for each browser
# 2. Ensure WebDriver versions match browser versions
# 3. Add WebDrivers to your PATH or specify their location
# 4. Update WebDrivers when browsers update
```

--------------------------------

### SvelteKit Initialization Script

Source: https://herd.garden/docs/connect-your-browser

This script initializes the SvelteKit application, loading necessary modules and starting the client-side rendering process. It handles the initial setup and hydration of the application.

```JavaScript
{ 
  __sveltekit_jmmcji = { base: new URL("..", location).pathname.slice(0, -1), env: {} }; 
  const element = document.currentScript.parentElement;
  const data = [null,null,null];
  Promise.all([
    import("../\_app/immutable/entry/start.6a3d3c9b.js"),
    import("../\_app/immutable/entry/app.e9d49fce.js")
  ]).then(([kit, app]) => {
    kit.start(app, element, { node_ids: [0, 3, 13], data, form: null, error: null });
  });
}
```

--------------------------------

### MCP SDK Server Setup

Source: https://context7_llms

Installs the MCP SDK and sets up the MCP server. The client side then needs to implement the MCP protocol to communicate with the server for browser automation tasks.

```javascript
// Install MCP SDK
npm install mcp-browser-automation

// Set up the MCP server
const { MCPServer } = require('mcp-browser-automation');
const server = new MCPServer({
  port: 8000,
  // Additional configuration for the server
});

// Start the server
await server.start();

// Client side needs to implement MCP protocol
// to communicate with the server

// Then through MCP protocol interactions:
// 1. Create a browser session
// 2. Navigate to URL
// 3. Interact with page
```

--------------------------------

### Install Herd SDK

Source: https://context7_llms

Installs the Herd SDK using npm. After installation, users need to install the browser extension and connect their browser to start using Herd.

```bash
npm install @monitoro/herd
```

--------------------------------

### Run Your First Herd Trail (CLI)

Source: https://herd.garden/docs/getting-started

Executes the '@herd/browser' trail to navigate to a specified URL and extract data in markdown format. This is a basic test to verify Herd's functionality.

```bash
herd trail run @herd/browser -a markdown -p '{"url": "https://example.com"}'
```

--------------------------------

### Twitter Assistant: Full Example

Source: https://context7_llms

A comprehensive example demonstrating the setup of a Twitter Assistant using Herd MCP. It includes server configuration, defining tools for posting tweets and liking tweets, and a resource for fetching the timeline, all managed through browser automation.

```javascript
import { HerdMcpServer } from '@monitoro/herd';
import { z } from 'zod';

const server = new HerdMcpServer({
    info: {
        name: "twitter-assistant",
        version: "1.0.0",
        description: "Twitter automation for LLMs"
    },
    transport: {
        type: "sse",
        port: 3000
    },
    herd: {
        token: process.env.HERD_TOKEN
    }
});

// Post a tweet
server.tool({
    name: "postTweet",
    description: "Post a new tweet",
    schema: {
        content: z.string().max(280)
    }
}, async ({ content }, devices) => {
    const device = devices[0];
    const page = await device.newPage();
    await page.goto('https://twitter.com/compose/tweet');
    await page.type('div[aria-label="Tweet text"]', content);
    await page.click('div[data-testid="tweetButton"]');
    return { success: true };
});

// Get timeline
server.resource({
    name: "timeline",
    uriOrTemplate: "twitter/timeline",
}, async (devices) => {
    const device = devices[0];
    const page = await device.newPage();
    await page.goto('https://twitter.com/home');
    
    return await page.extract({
        tweets: {
            _$r: 'article[data-testid="tweet"]',
            author: '[data-testid="User-Name"]',
            content: '[data-testid="tweetText"]',
            stats: {
                likes: '[data-testid="like"]',
                retweets: '[data-testid="retweet"]'
            }
        }
    });
});

// Like a tweet
server.tool({
    name: "likeTweet",
    description: "Like a tweet by its URL",
    schema: {
        tweetUrl: z.string().url()
    }
}, async ({ tweetUrl }, devices) => {
    const device = devices[0];
    const page = await device.newPage();
    await page.goto(tweetUrl);
    await page.click('div[data-testid="like"]');
    return { success: true };
});

// Start the server
server.start().then(() => {
    console.log('Twitter Assistant ready!');
}).catch(console.error);
```

--------------------------------

### Automate Browser with Herd SDK (JavaScript)

Source: https://herd.garden/docs/getting-started

Connects to a Herd device, initializes the client, lists available devices, creates a new browser page, navigates to a URL, and extracts data using CSS selectors. This demonstrates programmatic browser automation with the Herd SDK.

```javascript
// Connect to your Herd device
const client = new HerdClient('your-token');
await client.initialize();
const devices = await client.listDevices();
const device = devices[0];

// Create a new page and navigate
const page = await device.newPage();
await page.goto("https://example.com");

// Extract data using simple selectors
const data = await page.extract({
  title: "h1",
  description: "p",
  link: "a"
});

console.log("Extracted data:", data);
```

--------------------------------

### Complete HerdClient Automation Example

Source: https://herd.garden/docs/automation-basics

A full example demonstrating the initialization of the HerdClient, listing devices, creating a new page, navigating to a URL, extracting content using CSS selectors, and closing the client connection. It includes error handling for robustness.

```typescript
import { HerdClient } from '@monitoro/herd';

async function runBasicAutomation() {
  const client = new HerdClient('your-token');
  
  try {
    // Initialize the client
    await client.initialize();
    console.log('Client initialized successfully');
    
    // Get the first available device
    const devices = await client.listDevices();
    if (devices.length === 0) {
      throw new Error('No devices available');
    }
    const device = devices[0];
    console.log(`Connected to device: ${device.id}`);
    
    // Create a new page
    const page = await device.newPage();
    console.log('New page created');
    
    // Navigate to a website
    console.log('Navigating to example.com...');
    await page.goto('https://example.com');
    console.log('Navigation complete');
    
    // Extract content
    console.log('Extracting content...');
    const content = await page.extract({
      title: 'h1',
      description: 'p',
      link: 'a'
    });
    
    // Display the extracted content
    console.log('\nExtracted content:');
    console.log(`Title: ${content.title}`);
    console.log(`Description: ${content.description}`);
    console.log(`Link: ${content.link}`);
    
  } catch (error) {
    console.error('Error during automation:', error);
  } finally {
    // Always close the client when done
    console.log('Closing client connection...');
    await client.close();
    console.log('Client connection closed');
  }
}

// Run the automation
runBasicAutomation();

```

--------------------------------

### SvelteKit Initialization Script

Source: https://herd.garden/docs/troubleshooting

This JavaScript code snippet initializes the SvelteKit application, loading necessary modules and starting the client-side rendering process. It handles routing and application setup.

```javascript
{
  __sveltekit_jmmcji = {
    base: new URL("..", location).pathname.slice(0, -1),
    env: {}
  };
  const element = document.currentScript.parentElement;
  const data = [null, null, null];
  Promise.all([
    import("../_app/immutable/entry/start.6a3d3c9b.js"),
    import("../_app/immutable/entry/app.e9d49fce.js")
  ]).then(([kit, app]) => {
    kit.start(app, element, {
      node_ids: [0, 3, 13],
      data,
      form: null,
      error: null
    });
  });
}
```

--------------------------------

### Python Client: Basic Setup and Initialization

Source: https://context7_llms

Demonstrates how to create an instance of the HerdClient, authenticate with a token, and initialize the client to connect to the Herd platform.

```python
from monitoro_herd import HerdClient

# Create a client instance
client = HerdClient(
    token='your-auth-token'  # Get your token at herd.garden
)

# Initialize the client
await client.initialize()
```

--------------------------------

### Install and Connect Herd SDK

Source: https://context7_llms

Shows how to install the Herd SDK using npm and connect to an existing browser instance to begin automation tasks.

```javascript
// Install the Herd SDK
npm install @monitoro/herd

// Connect to your existing browser
import { HerdClient } from '@monitoro/herd';

const client = new HerdClient('your-token');
await client.initialize();
const devices = await client.listDevices();
const device = devices[0];

// Full browser automation capabilities
const page = await device.newPage();
await page.goto('https://example.com');
```

--------------------------------

### Initialize and Run Apify Actor with Puppeteer (javascript)

Source: https://context7_llms

This example shows how to install the Apify SDK, initialize an Apify actor, launch a Puppeteer browser instance in the cloud, navigate to a URL, and properly exit the actor.

```javascript
// Install the Apify SDK
npm install apify

// Create an actor
import { Actor } from 'apify';

// Run in Apify cloud environment
await Actor.init();

// Launch a browser in the cloud
const browser = await Actor.launchPuppeteer();
const page = await browser.newPage();
await page.goto('https://example.com');

// Must manually handle stopping the actor
await Actor.exit();
```

--------------------------------

### Herd SDK Installation and Connection

Source: https://context7_llms

Installs the Herd SDK using npm and demonstrates establishing a direct connection to your browser using `HerdClient` to list available devices.

```javascript
// Install the Herd SDK
npm install @monitoro/herd

// Simple direct connection to your browser
import { HerdClient } from '@monitoro/herd';

const client = new HerdClient('your-token');
await client.initialize();
const devices = await client.listDevices();
const device = devices[0];
```

--------------------------------

### Install Herd SDK (JavaScript)

Source: https://herd.garden/docs/automation-basics

Instructions for setting up your JavaScript environment and installing the Herd SDK using npm. This is the first step before writing any automation code.

```bash
npm install @monitoro/herd
```

--------------------------------

### IFTTT Integration Setup

Source: https://monitoro.co/

Guide to connecting Monitoro with IFTTT. It details obtaining a webhook key from IFTTT, creating an IFTTT service in Monitoro, setting up an IFTTT applet with a webhook trigger, and sending data from Monitoro to IFTTT using value fields.

```APIDOC
IFTTT Webhook Integration:
  Purpose: Trigger IFTTT applets when website data changes.
  Steps:
    1. Get Webhook URL from IFTTT (https://maker.ifttt.com/use/YOUR_KEY).
    2. Create IFTTT service in Monitoro using the Webhook URL.
    3. Create an IFTTT applet: Trigger = Webhooks (Receive a web request) with event name (e.g., 'monitoro_ifttt_tutorial').
    4. Configure IFTTT action (e.g., Post a tweet).
    5. In Monitoro, select data to send to IFTTT, mapping it to value1, value2, etc., corresponding to IFTTT applet fields.
  Dependencies: Monitoro account, IFTTT account.
  Inputs: IFTTT Webhook URL, Monitoro project data, IFTTT event name.
  Outputs: Triggered IFTTT applets.
```

--------------------------------

### JavaScript MCP Server: Basic Setup

Source: https://context7_llms

Sets up and starts a Herd MCP Server, which securely exposes local web application functionality to LLMs. Requires configuration for server info, transport, and Herd authentication.

```javascript
import { HerdMcpServer } from '@monitoro/herd';

const server = new HerdMcpServer({
    info: {
        name: "gmail-assistant",
        version: "1.0.0",
        description: "Gmail automation tools for LLMs"
    },
    transport: {
        type: "sse",
        port: 3000
    },
    herd: {
        token: "your-herd-token"  // Get from herd.garden
    }
});

// Start the server
await server.start();
```

--------------------------------

### Install Herd Client

Source: https://context7_llms

Instructions for installing the Herd client library for JavaScript and Python. Herd simplifies browser automation by not requiring separate WebDriver installations.

```javascript
# JavaScript
npm install @monitoro/herd
```

```python
# Python
pip install herd-client
```

```bash
# Then install the browser extension and connect your browser
# That's it! No WebDrivers or browser drivers to manage
```

--------------------------------

### Python Herd SDK Direct Browser Automation

Source: https://context7_llms

Example demonstrating direct web automation using the Python Herd SDK. It shows how to initialize the client, get a device, create a new page, navigate to a URL, and extract structured content from the page.

```python
from monitoro_herd import HerdClient

async def main():
    client = HerdClient(token="your-token")
    await client.initialize()
    
    device = await client.get_device("my-browser")
    page = await device.new_page()
    
    # Navigate to Twitter
    await page.goto("https://twitter.com")
    
    # Extract timeline content
    content = await page.extract({
        "tweets": {
            "_$": "article[data-testid='tweet']",
            "author": "[data-testid='User-Name']",
            "content": "[data-testid='tweetText']"
        }
    })
    print("Timeline:", content)

# Run the async function
import asyncio
asyncio.run(main())
```

--------------------------------

### SvelteKit Initialization Script

Source: https://herd.garden/docs/trails-automations

This script initializes the SvelteKit application by loading necessary modules and starting the app with provided configuration. It handles the bootstrapping process for the frontend application.

```javascript
{
  "__sveltekit_jmmcji": {
    "base": "new URL(\"..\", location).pathname.slice(0, -1)",
    "env": {}
  },
  "const element = document.currentScript.parentElement;
  const data = [
    null,
    null,
    null
  ];
  Promise.all([
    import("../_app/immutable/entry/start.6a3d3c9b.js"),
    import("../_app/immutable/entry/app.e9d49fce.js")
  ]).then(([kit, app]) => {
    kit.start(app, element, {
      "node_ids": [
        0,
        3,
        13
      ],
      "data": data,
      "form": null,
      "error": null
    });
  });
}
```

--------------------------------

### Install and Connect Herd Browser Extension (javascript)

Source: https://context7_llms

This snippet demonstrates how to install the Herd SDK, connect to your local browser using an API token, list available devices, and create a new page to navigate to a URL.

```javascript
// Install the Herd SDK
npm install @monitoro/herd

// Simple setup code
import { HerdClient } from '@monitoro/herd';

// Connect to your own browser
const client = new HerdClient('your-token');
await client.initialize();
const devices = await client.listDevices();
const device = devices[0];

// Create a page and automate it
const page = await device.newPage();
await page.goto('https://example.com');
```

--------------------------------

### Install and Connect Firecrawl SDK

Source: https://context7_llms

Demonstrates how to install the Firecrawl SDK and connect to its cloud service using an API key for web crawling and data extraction.

```javascript
// Install the Firecrawl SDK
npm install @mendable/firecrawl-js

// Connect to Firecrawl's cloud service
import FirecrawlApp from '@mendable/firecrawl-js';

const app = new FirecrawlApp({ apiKey: "fc-YOUR_API_KEY" });

// Send request to cloud-based crawling service
const result = await app.scrapeUrl('example.com');
console.log(result.markdown);
```

--------------------------------

### Install Herd SDK

Source: https://context7_llms

Installs the Herd SDK globally using npm, yarn, or pnpm. This command makes the Herd CLI and SDK available on your system.

```bash
npm install -g @monitoro/herd
```

```bash
yarn global add @monitoro/herd
```

```bash
pnpm add -g @monitoro/herd
```

--------------------------------

### Herd.js: Install SDK

Source: https://context7_llms

Provides the command to install the Herd SDK package using npm. This is the first step in setting up Herd.js for web automation.

```bash
npm install @monitoro/herd
```

--------------------------------

### Install Monitoro Herd SDK (Bash)

Source: https://context7_llms

Provides the command to install the Monitoro Herd SDK using pip, a package installer for Python. Ensure Python 3.8+ is installed and a virtual environment is set up.

```bash
pip install monitoro-herd
```

--------------------------------

### HerdClient Installation (Bash)

Source: https://context7_llms

Installs the Herd client library for JavaScript projects using npm or yarn.

```bash
npm install @monitoro/herd
# or
yarn add @monitoro/herd
```

--------------------------------

### SvelteKit Application Initialization

Source: https://herd.garden/docs/device-management

This snippet demonstrates the client-side initialization of a SvelteKit application. It dynamically imports necessary SvelteKit modules and starts the application within the specified DOM element, handling routing and rendering.

```javascript
{ __sveltekit_jmmcji = { base: new URL("..", location).pathname.slice(0, -1), env: {} }; const element = document.currentScript.parentElement; const data = [null,null,null]; Promise.all([ import("../_app/immutable/entry/start.6a3d3c9b.js"), import("../_app/immutable/entry/app.e9d49fce.js") ]).then(([kit, app]) => { kit.start(app, element, { node_ids: [0, 3, 13], data, form: null, error: null }); }); }
```

--------------------------------

### Python Installation

Source: https://context7_llms

Installs the monitoro-herd Python package using pip.

```bash
pip install monitoro-herd
```

--------------------------------

### Herd Browser Automation Example

Source: https://context7_llms

A JavaScript example demonstrating how to use the Herd client to connect to an existing browser, navigate to a URL, interact with elements, and perform assertions.

```javascript
// JavaScript
import { HerdClient } from '@monitoro/herd';

async function runTest() {
  // Connect to your existing browser
  const client = new HerdClient('your-token');
  await client.initialize();
  const devices = await client.listDevices();
  const device = devices[0];
  
  // Create a new page for testing
  const page = await device.newPage();
  await page.goto('https://example.com');
  
  // Test interactions
  await page.click('.nav-item');
  await page.waitForSelector('.content-loaded');
  
  // Assert condition
  const header = await page.$('.header');
  const text = await header.getText();
  console.assert(text.includes('Expected Text'), 'Header text verification failed');
  
  // Cleanup
  await page.close();
  await client.close();
}

runTest();
```

--------------------------------

### Herd Installation Commands

Source: https://context7_llms

Provides essential commands for installing the Herd SDK for both JavaScript (npm) and Python (pip) environments, enabling users to integrate Herd into their projects.

```bash
# JavaScript
npm install @monitoro/herd

# Python
pip install herd-client
```

--------------------------------

### Basic Trail package.json Setup

Source: https://context7_llms

Shows the minimal configuration required in a trail's package.json file to define a new automation project and its core dependency on the Herd SDK.

```json
{
    "name": "my-trail",
    "version": "1.0.0",
    "dependencies": {
        "@monitoro/herd": "latest"
    }
}
```

--------------------------------

### SvelteKit Client Initialization

Source: https://herd.garden/devices

This script initializes the SvelteKit application on the client side. It configures the base path, environment variables, and loads the necessary application modules to start the SvelteKit framework.

```javascript
{
  __sveltekit_jmmcji = {
    base: new URL(".", location).pathname.slice(0, -1),
    env: {"PUBLIC_NATS_URL":"nats://herd.garden:4222"}
  };
  const element = document.currentScript.parentElement;
  const data = [null,null,null];
  Promise.all([
    import("./_app/immutable/entry/start.6a3d3c9b.js"),
    import("./_app/immutable/entry/app.e9d49fce.js")
  ]).then(([kit, app]) => {
    kit.start(app, element, {
      node_ids: [0, 2, 11],
      data,
      form: null,
      error: null
    });
  });
}
```

--------------------------------

### Example Usage of Herd Garden LLMs Page API

Source: https://context7_llms

A comprehensive example demonstrating the typical workflow of the Herd Garden LLMs Page API, including page creation, navigation, form interaction, data extraction, and page closure.

```python
# Create a new page
page = await device.new_page()

# Navigate to a URL
await page.goto("https://example.com")

# Fill out a form
await page.type("#username", "myuser")
await page.type("#password", "mypass")
await page.click("#submit-button", {"waitForNavigation": "networkidle2"})

# Extract some data using the extract method
data = await page.extract({
    "title": "h1",
    "description": ".description"
})
print("Extracted data:", data)

# Close the page when done
await page.close()
```

--------------------------------

### App Initialization Script

Source: https://herd.garden/trails

This JavaScript code snippet initializes the application by importing necessary modules and starting the kit with provided data and configuration. It's typically used in front-end frameworks for bootstrapping the application.

```javascript
Promise.all([
  import("./_app/immutable/entry/start.6a3d3c9b.js"),
  import("./_app/immutable/entry/app.e9d49fce.js")
]).then(([kit, app]) => {
  kit.start(app, element, {
    node_ids: [0, 8, 30],
    data,
    form: null,
    error: null
  });
});
```

--------------------------------

### Trail Directory Structure Example

Source: https://context7_llms

Illustrates the standard file and directory structure for a Herd trail, including URL definitions, selector configurations, action implementations, and the project manifest.

```file-structure
google-search/
    urls.ts
    selectors.ts
    actions.ts
    package.json
```

--------------------------------

### HerdClient Methods (JavaScript)

Source: https://context7_llms

Provides documentation for key HerdClient methods including initialization, listing and getting devices, registering new devices, sending low-level commands, and subscribing to device events.

```APIDOC
HerdClient:
  initialize(): Initializes the client by establishing connections to the Herd platform. Must be called before using other methods.
    Usage:
      await client.initialize();

  listDevices(): Returns a list of all available devices.
    Usage:
      const devices = await client.listDevices();
      console.log('Available devices:', devices);

  getDevice(deviceId: string): Gets a specific device by ID.
    Parameters:
      deviceId: The unique identifier of the device.
    Usage:
      const device = await client.getDevice('device-123');

  registerDevice(options: object): Registers a new device with the platform.
    Parameters:
      options: An object containing device registration details, e.g., { deviceId: string, type: string, name: string }.
    Usage:
      const device = await client.registerDevice({
          deviceId: 'my-device',
          type: 'browser',
          name: 'My Test Browser'
      });

  sendCommand(deviceId: string, command: string, params: object): Sends a command to a specific device. This is a low-level method and not recommended for most use cases.
    Parameters:
      deviceId: The ID of the target device.
      command: The command to send (e.g., 'Page.click').
      params: An object containing parameters for the command.
    Usage:
      const result = await client.sendCommand('device-123', 'Page.click', {
          selector: '#submit-button'
      });

  subscribeToDeviceEvents(deviceId: string, callback: function): Subscribes to all events from a device. Returns an unsubscribe function.
    Parameters:
      deviceId: The ID of the device to subscribe to.
      callback: A function to handle incoming events.
    Usage:
      const unsubscribe = client.subscribeToDeviceEvents('device-123', (event) => {
          console.log('Device event:', event);
      });
      // Later: unsubscribe to stop receiving events
      unsubscribe();
```

--------------------------------

### Basic Trail Setup Directory Structure

Source: https://context7_llms

Provides a template for setting up a new trail's directory structure, ensuring all necessary component files are in place for development.

```file-structure
my-trail/
    urls.ts
    selectors.ts
    actions.ts
    package.json
```

--------------------------------

### SvelteKit Client Initialization

Source: https://herd.garden/trails

This snippet shows the initialization of SvelteKit client-side variables, including the base path and environment variables like the NATS URL. It's part of the application's setup.

```javascript
const __sveltekit_jmmcji = {
  base: new URL(".", location).pathname.slice(0, -1),
  env: {
    "PUBLIC_NATS_URL": "nats://herd.garden:4222"
  }
};
const element = document.currentScript.parentElement;
const data = [
  null,
  {
    "type": "data",
    "data": null,
    "uses": {}
  },
  {
    "type": "data",
    "data": {
      trending: [
        {
          id: "d1203452-34f8-401f-948b-e9d6e1fb836c",
          name: "@herd/browser",
          description: "A Herd trail for interacting with your browser's tabs and extracting content, html, markdown, seo data...",
          tags: [
            "browser",
            "tab",
            "content",
            "data",
            "html",
            "markdown",
            "seo",
            "json-ld",
            "open-graph",
            "twitter",
            "meta"
          ],
          organization: {
            id: "63dbca55-c8ec-443b-959d-864aec9fc074",
            name: "Herd",
            tag: "herd"
          },
          origins: [],
          latestVersion: "1.0.3",
          publishedAt: "2025-04-06T02:35:46.005Z",
          updatedAt: "2025-06-21T11:22:30.883Z",
          createdAt: "2025-04-02T21:33:42.259Z",
          downloadCount: 320,
          versions: 4
        },
        {
          id: "2733a87d-d55a-4d78-b166-1f898ddacf3b",
          name: "@omneity/serp",
          description: "SERP (Search Engine Results Page) Scraper powered by herd.garden",
          tags: [
            "serp",
            "search",
            "seo",
            "search engine",
            "search engine optimization"
          ],
          organization: {
            id: "b7c62dd2-644d-4b0b-a46a-3410e9e726fa",
            name: "Omneity Labs",
            tag: "omneity"
          },
          origins: [
            "google.com",
            "bing.com",
            "duckduckgo.com",
            "search.brave.com"
          ],
          latestVersion: "1.0.10",
          publishedAt: "2025-04-02T21:43:15.362Z",
          updatedAt: "2025-06-21T11:22:32.455Z",
          createdAt: "2025-03-29T12:48:01.330Z",
          downloadCount: 186,
          versions: 11
        },
        {
          id: "7f1828f5-7cd5-4ca3-aa65-2d73426e87ca",
          name: "@omneity/hackernews",
          description: "Scrape HackerNews frontpage, posts and comments.",
          tags: [
            "hackernews",
            "frontpage",
            "posts",
            "comments"
          ],
          organization: {
            id: "b7c62dd2-644d-4b0b-a46a-3410e9e726fa",
            name: "Omneity Labs",
            tag: "omneity"
          },
          origins: [
            "news.ycombinator.com"
          ],
          latestVersion: "1.0.5",
          publishedAt: "2025-03-30T20:05:50.731Z",
          updatedAt: "2025-06-21T11:22:30.743Z",
          createdAt: "2025-03-30T19:23:42.174Z",
          downloadCount: 135,
          versions: 5
        },
        {
          id: "3eabb8da-6a39-4fd0-b284-bc876a098cf2",
          name: "@omneity/arxiv",
          description: "Search for Arxiv papers by author, keyword and more",
          tags: [
            "arxiv",
            "search",
            "papers",
            "science",
            "research"
          ],
          organization: {
            id: "b7c62dd2-644d-4b0b-a46a-3410e9e726fa",
            name: "Omneity Labs",
            tag: "omneity"
          },
          origins: [
            "arxiv.org"
          ],
          latestVersion: "1.0.1",
          publishedAt: "2025-03-31T16:32:28.263Z",
          updatedAt: "2025-06-21T11:22:32.215Z",
          createdAt: "2025-03-31T16:31:07.651Z",
          downloadCount: 132,
          versions: 2
        },
        {
          id: "7b8fdcf3-9124-4a20-830f-373ab934a56a",
          name: "@omneity/reddit",
          description: "Search Reddit and get posts, comments and other content",
          tags: [
            "search",
            "posts",
            "comments",
            "social",
            "social media",
            "reddit"
          ],
          organization: {
            id: "b7c62dd2-644d-4b0b-a46a-3410e9e726fa",
            name: "Omneity Labs",
            tag: "omneity"
          },
          origins: [
            "reddit.com"
          ],
          latestVersion: "1.0.1",
          publishedAt: "2025-03-31T16:57:13.124Z",
          updatedAt: "2025-06-21T11:22:40.494Z",
          createdAt: "2025-03-31T16:51:11.906Z",
          downloadCount: 114,
          versions: 2
        },
        {
          id: "0f1a98bc-5d4a-4330-a3b5-7dd863214268",
          name: "@omneity/linkedin.com",
          description: "Search and scrape data from LinkedIn from profiles, contact info, to companies, posts, comments, etc.",
          tags: [
            "linkedin",
            "scraper",
            "profiles",
            "companies",
            "posts",
            "comments",
            "search",
            "social media",
            "sales",
            "marketing",
            "business",
            "data",
            "intelligence",
            "research",
            "competitors",
            "leads",
            "prospecting",
            "networking",
            "contact info",
            "linkedin api",
            "linkedin scraper",
            "linkedin data",
            "social"
          ],
          organization: {
            id: "b7c62dd2-644d-4b0b-a46a-3410e9e726fa",
            name: "Omneity Labs",
            tag: "omneity"
          },
          origins: [
            "linkedin.com"
          ],
          latestVersion: "1.0.3",
          publishedAt: "2025-04-02T01:09:50.192Z",
          updatedAt: "2025-06-21T11:22:32.844Z",
          createdAt: "2025-04-01T23:46:21.547Z",
          downloadCount: 87,
          versions: 4
        }
      ],
      popular: [
        {
          id: "d1203452-34f8-401f-948b-e9d6e1fb836c",
          name: "@herd/browser",
          description: "A Herd trail for interacting with your browser's tabs and extracting content, html, markdown, seo data...",
          tags: [
            "browser",
            "tab",
            "content",
            "data",
            "html",
            "markdown",
            "seo",
            "json-ld",
            "open-graph",
            "twitter",
            "meta"
          ],
          organization: {
            id: "63dbca55-c8ec-443b-959d-864aec9fc074",
            name: "Herd",
            tag: "herd"
          },
          origins: [],
          latestVersion: "1.0.3",
          publishedAt: "2025-04-06T02:35:46.005Z",
          updatedAt: "2025-06-21T11:22:30.883Z",
          createdAt: "2025-04-02T21:33:42.259Z",
          downloadCount: 320,
          versions: 4
        },
        {
          id: "2733a87d-d55a-4d78-b166-1f898ddacf3b",
          name: "@omneity/serp",
          description: "SERP (Search Engine Results Page) Scraper powered by herd.garden",
          tags: [
            "serp",
            "search",
            "seo",
            "search engine",
            "search engine optimization"
          ],
          organization: {
            id: "b7c62dd2-644d-4b0b-a46a-3410e9e726fa",
            name: "Omneity Labs",
            tag: "omneity"
          },
          origins: [
            "google.com",
            "bing.com",
            "duckduckgo.com",
            "search.brave.com"
          ],
          latestVersion: "1.0.10",
          publishedAt: "2025-04-02T21:43:15.362Z",
          updatedAt: "2025-06-21T11:22:32.455Z",
          createdAt: "2025-03-29T12:48:01.330Z",
          downloadCount: 186,
          versions: 11
        },
        {
          id: "7f1828f5-7cd5-4ca3-aa65-2d73426e87ca",
          name: "@omneity/hackernews",
          description: "Scrape HackerNews frontpage, posts and comments.",
          tags: [
            "hackernews",
            "frontpage",
            "posts",
            "comments"
          ],
          organization: {
            id: "b7c62dd2-644d-4b0b-a46a-3410e9e726fa",
            name: "Omneity Labs",
            tag: "omneity"
          }
        }
      ]
    }
  }
];
```

--------------------------------

### Monitoro Quick Overview Video

Source: https://monitoro.co/

Embeddable iframe for the Monitoro quick overview video, providing a visual introduction to the tool's capabilities and setup.

```html
<iframe allowfullscreen="true" frameborder="0" scrolling="no" src="https://www.youtube.com/embed/8A6_pg41M2s"></iframe>
```

--------------------------------

### SvelteKit Application Initialization

Source: https://herd.garden/register

This script initializes the SvelteKit application by loading essential modules and starting the client-side rendering process. It configures the application's base path and environment variables.

```javascript
{ 
  const __sveltekit_jmmcji = { base: new URL(".", location).pathname.slice(0, -1), env: {} };
  const element = document.currentScript.parentElement;
  const data = [null,null];
  Promise.all([
    import("./_app/immutable/entry/start.6a3d3c9b.js"),
    import("./_app/immutable/entry/app.e9d49fce.js")
  ]).then(([kit, app]) => {
    kit.start(app, element, { node_ids: [0, 24], data, form: null, error: null });
  });
}
```