Cline Releases Cline SDK: An Open-Source Agent Runtime Now Powering Its CLI and Kanban, With IDE Extensions Being Migrated

Introduction

In this tutorial, you'll learn how to build and extend a simple AI agent using the new Cline SDK, an open-source TypeScript runtime that powers Cline's CLI and Kanban tools. The SDK provides a structured way to create intelligent agents with capabilities like plugins, subagents, scheduling, and checkpointing. This tutorial will guide you through setting up the SDK, creating a basic agent, and extending it with custom functionality.

Prerequisites

• Node.js version 22 or higher installed
• Basic TypeScript knowledge
• npm or yarn package manager
• Access to an LLM API key (e.g., from Anthropic, OpenAI, or similar)

Step-by-Step Instructions

1. Setting Up Your Project

1.1 Initialize a new Node.js project

First, create a new directory for your project and initialize it with npm:

mkdir cline-agent-demo
 cd cline-agent-demo
 npm init -y

Why: This creates a clean project structure and package.json file to manage dependencies.

1.2 Install the Cline SDK

Install the Cline SDK and required dependencies:

npm install @cline/sdk @cline/llms @cline/agents

Why: The SDK provides the core runtime components for building agents, including LLM integration and agent management.

1.3 Configure TypeScript (optional but recommended)

If you're using TypeScript, initialize the tsconfig:

npx tsc --init

Why: TypeScript helps catch errors early and provides better IDE support for complex agent logic.

2. Creating a Basic Agent

2.1 Create an agent configuration file

Create a file called agent.ts and set up a basic agent:

import { createAgent } from '@cline/agents'
import { ClaudeLLM } from '@cline/llms'

const agent = createAgent({
  name: 'MyAssistant',
  llm: new ClaudeLLM({
    apiKey: process.env.CLAUDE_API_KEY!,
    model: 'claude-3-opus-20240229'
  }),
  instructions: 'You are a helpful assistant that answers questions concisely.'
})

export default agent

Why: This creates a basic agent instance with Claude as the LLM provider and sets up core instructions.

2.2 Create a simple interaction handler

Add a handler to process user input:

import agent from './agent'

async function handleUserQuery(query: string) {
  const response = await agent.run(query)
  console.log('Agent Response:', response)
  return response
}

// Example usage
handleUserQuery('What is the capital of France?')

Why: This demonstrates how to send queries to your agent and receive responses, forming the core interaction loop.

3. Extending with Plugins

3.1 Create a simple plugin

Create a plugin that adds a calculator capability:

import { Plugin } from '@cline/agents'

const calculatorPlugin: Plugin = {
  name: 'calculator',
  description: 'Performs basic arithmetic operations',
  execute: async (input: string) => {
    // Simple regex to extract numbers and operators
    const match = input.match(/(\d+)\s*([+\-*/])\s*(\d+)/)
    if (!match) return 'Could not parse calculation'
    
    const [, a, operator, b] = match
    const numA = parseFloat(a)
    const numB = parseFloat(b)
    
    let result
    switch (operator) {
      case '+': result = numA + numB; break
      case '-': result = numA - numB; break
      case '*': result = numA * numB; break
      case '/': result = numA / numB; break
      default: return 'Unsupported operator'
    }
    
    return `Result: ${result}`
  }
}

export default calculatorPlugin

Why: Plugins allow you to extend agent capabilities without modifying core logic, making agents modular and reusable.

3.2 Register the plugin with your agent

Update your agent configuration to include the plugin:

import { createAgent } from '@cline/agents'
import { ClaudeLLM } from '@cline/llms'
import calculatorPlugin from './plugins/calculator'

const agent = createAgent({
  name: 'MyAssistant',
  llm: new ClaudeLLM({
    apiKey: process.env.CLAUDE_API_KEY!,
    model: 'claude-3-opus-20240229'
  }),
  instructions: 'You are a helpful assistant that answers questions concisely.',
  plugins: [calculatorPlugin]
})

export default agent

Why: This adds the calculator functionality to your agent, allowing it to perform arithmetic operations when prompted.

4. Adding Subagents

4.1 Create a subagent for research tasks

Subagents are specialized agents that handle specific domains:

import { createAgent } from '@cline/agents'
import { ClaudeLLM } from '@cline/llms'

const researchAgent = createAgent({
  name: 'Researcher',
  llm: new ClaudeLLM({
    apiKey: process.env.CLAUDE_API_KEY!,
    model: 'claude-3-opus-20240229'
  }),
  instructions: 'You are a research assistant that finds and summarizes information on technical topics.'
})

export default researchAgent

Why: Subagents allow for domain specialization, making complex tasks more manageable by delegating to specialized agents.

4.2 Integrate subagent into main agent

Modify your main agent to delegate research tasks to the subagent:

import agent from './agent'
import researchAgent from './subagents/research'

async function handleQuery(query: string) {
  if (query.toLowerCase().includes('research')) {
    return await researchAgent.run(query)
  }
  return await agent.run(query)
}

Why: This demonstrates how to route different types of queries to appropriate agents, creating a more sophisticated system.

5. Testing Your Agent

5.1 Create a test script

Create a test file to verify your agent works:

import { handleUserQuery } from './agent'

async function runTests() {
  console.log('Testing basic query...')
  await handleUserQuery('Hello, what is your name?')
  
  console.log('Testing calculator plugin...')
  await handleUserQuery('Calculate 15 + 25')
  
  console.log('Testing research delegation...')
  await handleUserQuery('Research the latest developments in AI agents')
}

runTests()

Why: Testing ensures all components work together as expected and helps identify issues early.

5.2 Run the tests

node dist/agent-test.js

Why: This executes your agent with sample queries to verify functionality.

Summary

In this tutorial, you've learned how to set up and extend an AI agent using the Cline SDK. You created a basic agent with LLM integration, added plugins for extended functionality, and implemented subagents for specialized tasks. The SDK's modular architecture allows for easy extension and customization, making it suitable for building complex AI-powered tools. Remember to set your API keys in environment variables and explore the SDK's advanced features like checkpointing and CRON scheduling for production use.