# Adding a Processor

So far our workflow is a pass-through: ChatInput hands its `message` straight to ChatOutput. Nothing _happens_ in the middle. In this page we drop a node between them that actually transforms the data.

## What you will learn

- How a **processor** sits between two nodes and changes data flowing through
- How **TextProcessor** does small, common string transforms (capitalize, uppercase, trim, …)
- How to read what a node did from the Playground's response

## Step 1: Open your workflow in the editor

Open the **Tutorial** workflow from the previous page. You should see ChatInput connected to ChatOutput.

## Step 2: Add a TextProcessor node

1. Click **+** and search for **Text Processor** (under **Text & Output**).
2. Drop it between ChatInput and ChatOutput.

## Step 3: Configure it

Click the TextProcessor node to open its configuration panel.

- Set **operation** to `capitalize`.

`capitalize` turns each word's first letter into uppercase: `"hello world"` becomes `"Hello World"`.

## Step 4: Re-wire the edges

Right now ChatInput connects directly to ChatOutput. We want the data to detour _through_ TextProcessor:

1. Delete the existing edge between ChatInput and ChatOutput (click the edge, press Delete).
2. Drag from ChatInput's `message` output to TextProcessor's `text` input.
3. Drag from TextProcessor's `text` output to ChatOutput's `message` input.

```
┌─────────────┐         ┌────────────────┐         ┌──────────────┐
│  ChatInput  │ message │ TextProcessor  │  text   │  ChatOutput  │
│             ├────────▶│  capitalize    ├────────▶│              │
└─────────────┘         └────────────────┘         └──────────────┘
```

## Step 5: Save and test

Save the workflow, open the Playground, type:

```
hello world
```

You should see back:

```
Hello World
```

Try a few more:

| You type | You see |
| --- | --- |
| `hello world` | `Hello World` |
| `FROM ALL CAPS` | `From All Caps` |
| `mixed CASE input` | `Mixed Case Input` |

## What just happened

Three things:

1. **A new node sits in the path.** Data no longer flows directly from ChatInput to ChatOutput — it has to pass through TextProcessor first.
2. **The data was transformed.** TextProcessor read its `text` input, applied the configured operation, and put the result on its `text` output.
3. **The shape of the workflow stayed the same.** Still one chain, still one data type (String) on every edge, still one node responsible for one job. We just added a link.

This is the building-block move you'll repeat constantly: insert a node that does one thing, wire it in, see the change in the Playground.

## Try other operations

Without changing the wiring, click the TextProcessor node and switch **operation** to:

- `uppercase` — `hello world` → `HELLO WORLD`
- `lowercase` — `HELLO World` → `hello world`
- `trim` — `   spaced   ` → `spaced` (leading/trailing whitespace gone)
- `strip_tags` — `<b>bold</b>` → `bold`

Save and test each. The wiring is identical; only the configuration changes.

## Next

[Static vs Dynamic →](static-vs-dynamic.md) — same operation, but decided at runtime instead of in the editor.
