Custom Agents

Learn how to build, deploy, and run custom agents to automate coding tasks with Fine.

The anatomy of an agent

In Fine, agents are not just bots. Agents are designed to perform domain-specific tasks, and are equipped with tools and relevant context. They are skilled at certain tasks, such as generating React components or spinning up CRUD APIs, and are familiar with your ecosystem and styling.

Here is the typical breakdown of an AI Agent:

Identity

Each agent has a unique identity and a set of skills that it brings to the task. This identity provides perspective to the AI when performing its functions, leading to more effective and focused results.

Tools

To perform their tasks, agents are equipped with a set of tools. These could range from the ability to browse a repository or third-party documentation to the ability to write code.

Guidelines

Many tasks in software development follow a pattern - a set of steps that need to be executed in order to accomplish the task.

When you run an Agent in Fine, it will execute a plan. This plan will be generated on-the-fly based on the Agent's guidelines, allowing for flexibility and adaptability to the specific needs of the task.

For example, an agent may implement a feature in React using a plan which might involve creating a component, updating the routing, managing state,etc., adapting as needed.

The .yaml manifest file

The manifest file contains the agent's identity, tools, and workflow. It's like a playbook for your agent, guiding it through the tasks you want to automate.

Building your first agent

Now, let's take a look at how you can create, deploy, and test your own agent.

Writing the .yaml file

First, you will need to describe your agent's workflow and provide guidelines. This is done in a YAML manifest file that contains several components. The main elements include the agent's identity, and prompts to generate code.

Here's an example for a simple agent that acts as a React expert:

id: react-agent
name: React Engineer
identity: |
  You are a senior software engineer, maintaining a web application written with React.
  You will get assignments to create new components, as well as update existing components in the codebase.
tools:
  - type: resource
    name: React Documentation
    description: |
      A free and open-source front-end JavaScript library for building user interfaces based on components.
    url: https://react.dev/reference/react
guidelines: |
  Read the specifications and generate the relevant code.

  - If the assignment is to create a new component, create the file for this component in a location that makes sense based on the current codebase conventions.
  - If the assignment is to update an existing component, locate it in the codebase, and update *only* that component.
    Only if the interface for this component changes, you may also update other files importing it to match the updates.

  Make sure that the code you write follows the codebase conventions - for example:
    - If the codebase uses a certain UI library (e.g. MUI), use it where relevant
    - If the codebase uses tailwindCSS, you will use tailwindCSS to style your components
    - And so forth...

  Do your best to make the components you generate look nice, following the codebase conventions.
  Only return the code you created, without any additional explanations.

This example showcases the basic structure of an agent. The 'id' is a unique identifier for your agent, and 'name' is a human-friendly title. The 'identity' is a brief description of the role or persona that the agent assumes, in the 'tools' section we provide React's docs, and under 'guidelines' we provide further instructions.

Deploying your agent

Once you have written your agent's manifest file, you can deploy it to Fine. To do this, hit "Deploy Agent" and upload your manifest file.

Explore ready-to-run agents

Check out the agent examples repository to explore ready-to-run agents that you can use with your favorite frameworks and tools.