BiTree
  • Search For Lessons
  • Curriculum
  • Pricing
  • For Educators
  • Become a Tutor
  • About
  • Contact
Log InGet Started

Questions, concerns, bug reports, or suggestions? We read every message, write to us at [email protected].

More ways to reach us →
BiTree

Live coding lessons for aspiring developers and security professionals.

[email protected]

(201) 785-7951

Mon–Fri, 9 AM–5 PM EST

Learn

  • Search For Lessons
  • Curriculum
  • Pricing

Company

  • About
  • For Educators & Schools
  • Become a Tutor
  • Contact Us

Legal

  • Terms of Service
  • Privacy Policy
© 2026 BiTree. All rights reserved.
Curriculum/AI Agents/No-Code Agents/n8n: Visual Drag-and-Drop Workflow Automation
50 minBeginner

n8n: Visual Drag-and-Drop Workflow Automation

After this lesson, you will be able to: Set up n8n, navigate the node editor, and build your first automated workflow that calls an API and transforms data.

n8n is a visual workflow builder with hundreds of node types and a built-in AI Agent node. This lesson installs n8n, walks through the editor, and has you build a real workflow, fetch data, transform it, send it somewhere.

Prerequisites:What Are AI Agents? Concepts and the Agent Loop

Install n8n locally

Self-hosted is free; the cloud version has a 14-day trial. We'll self-host with npx, no Docker required.

  1. 1

    1. Make sure Node.js 18+ is installed (`node --version`).

  2. 2

    2. In a terminal, run: `npx n8n`. n8n downloads and starts.

  3. 3

    3. Open http://localhost:5678 in your browser.

  4. 4

    4. Sign up for a local account (just an email, stays on your machine).

  5. 5

    5. You'll land on an empty workflow canvas.

Anatomy of a node

A node is one step in your workflow. Trigger nodes start the workflow (schedule, webhook, manual). Action nodes do something (HTTP, database, send email). Each node takes input from the previous one, transforms it, and passes output forward.

Diagram coming soon!

Three nodes connected by arrows: Trigger → HTTP Request → Set node, with example JSON flowing between them

Build your first workflow

Goal: fetch a random joke from an API and log it.

  1. 1

    1. Click the '+' on the canvas. Add a 'Manual Trigger' node.

  2. 2

    2. Add an 'HTTP Request' node. URL: https://official-joke-api.appspot.com/random_joke. Method: GET.

  3. 3

    3. Add a 'Set' node. Add a field 'joke' with value `{{ $json.setup }} ... {{ $json.punchline }}`.

  4. 4

    4. Click 'Test workflow' (top right).

  5. 5

    5. Click each node to inspect its input/output JSON.

💡 Expressions: the $json magic

n8n uses `{{ $json.fieldName }}` to reference data from the previous node. This is how data flows between nodes. Hover any field, n8n shows you what data is available from upstream.

Triggers worth knowing

Manual, runs when you click. Schedule, runs every X minutes / cron. Webhook, runs when an HTTP endpoint is hit. Form, runs when a hosted form is submitted. Pick the trigger that fits the real use case.

Sign in and purchase access to unlock this lesson.

Sign in to purchase
←What Are AI Agents? Concepts and the Agent Loop
Back to No-Code Agents
Building Your First n8n AI Agent→