Build an agent visually

What you'll build

The same agent as the code lab — but as a flow diagram you assemble by hand. Boxes = components; lines = data flowing between them.

Step 1

Open Langflow

Pick the easiest option for your class — all free:

• Langflow Desktop — download the app from langflow.org, open it. (No terminal — best for younger students.)
• Or pip — in a terminal: pip install langflow then langflow run, and open http://localhost:7860.
• Or cloud — DataStax offers a hosted Langflow free tier (sign in, skip installing).

Step 2

Drop in the core three

From the left component sidebar, drag these onto the canvas (skip if you used the template):

1. Chat Input (Inputs) — where your question enters.
2. Agent (Agents) — the brain that decides which tool to use.
3. Chat Output (Outputs) — where the answer comes out.

Connect them left-to-right: drag from Chat Input's output dot to the Agent's input, then Agent's response to Chat Output.

Step 3

Give the Agent a Gemini brain

Click the Agent component. In its settings:

• Set Model Provider → Google Generative AI (Gemini).
• Set Model Name → gemini-2.0-flash.
• Paste your Gemini API key into the API-key field.
• In Agent Instructions, write its job: "Use your tools to answer. Never guess currency rates or team facts — always call the tool."

Step 4

Add Tool #1 — a REST API

Drag an API Request component (Data / Tools) onto the canvas and configure it:

• Method: GET
• URL: https://api.frankfurter.app/latest?amount=50&from=USD&to=EUR
• Toggle the component into Tool mode (the "Tool" toggle / "Make tool"), so the Agent can call it and fill in the parameters itself.

Drag from the API Request's Toolset output into the Agent's Tools port. That line means "Agent, you may call this API."

Step 5

Add Tool #2 — an MCP server

This is the Station-7 payoff: plug in tools over MCP with no glue code. Drag the MCP Tools component (Tools / Bundles → MCP) onto the canvas.

• Set Mode → Stdio.
• Set Command → python3 and Arguments → team_server.py (download it above; keep it next to Langflow, or use its full path). On Langflow Desktop you can also point Command at any MCP server, e.g. an npx one.
• Langflow connects, then lists the server's tools (get_member_role, list_members). Leave them enabled.

Drag the MCP Tools output into the Agent's Tools port too. Now the Agent has both a web API and your MCP server.

Step 6

Run it & watch the calls

Click Playground (top-right) and ask the two-part question:

Maya earned a 500 USD bonus. What's her role,
and how much is 500 USD in euros?

Step 7

Save your work (the downloadable)

Langflow flows export as a single file. Click Share → Export (or the flow menu → Export) and Download — you get a .json you (or a student) can re-import into any Langflow with Import. That JSON is your visual workbook.

Nice — you built an agent with no code. Same architecture, same API + MCP calls, assembled visually. Want to see exactly what those boxes do under the hood? Do the sibling lab in Python.