Workshop · Workshop Day · 11.02.2027
Point an Agent at an API, Get a Beautiful Frontend
Start from a real, public REST API and finish the day with a deployed, genuinely nice Angular frontend, with AI coding agents driving most of the keystrokes.
Abstract
Everyone can get a coding agent to spit out code. Far fewer people can point one at a real API and walk away, the same day, with a frontend that actually looks good, holds together, and is deployed. That gap is the craft of agentic engineering, and it is what this workshop is about.
We start from a real, public REST API and build a genuinely nice Angular frontend for it, with AI coding agents driving most of the keystrokes. You will design the UI with the agent, set the agent up to succeed, plan and delegate the work, build feature by feature, and ship it through automated reviews and a pipeline. By the end you will have done the whole loop once with guidance, and you will know how to run it again on Monday against your own APIs.
You will build a working, deployed Angular frontend for a real financial-data API: live data views, a clean and responsive UI built on a small design system, and a CI pipeline that reviews and ships it. More importantly, you'll leave with a repeatable way of working, not just one demo repo.
The workshop is for Angular and frontend developers who have used AI coding tools a little and want to move from occasional autocomplete to actually delegating real feature work. You should be comfortable with TypeScript and the basics of Angular. No prior experience with agents or MCP is required.
We build against a real, public financial-data API. The default is Twelve Data (twelvedata.com), whose free tier is plenty for a workshop project.
Agenda
Block 1: Design First, with the Agent
Before a single component, decide what “beautiful” means. Use Claude to go from raw API to a UI concept, a small design system, and a component inventory, so the agent builds toward something intentional instead of generic output.
- Reading an unfamiliar API and shaping it into screens
- Generating a lightweight design system: colors, type, spacing, components
- Turning a concept into a concrete build plan the agent can follow
Block 2: Set the Agent Up to Win
The unglamorous part that decides everything downstream: project scaffolding, context engineering, and connecting the agent to the world through MCP.
- Structuring the repo and context so the agent stays oriented
- Wiring MCP so the agent can read the API spec and your tooling directly
- Token minimization and reusable skills, so speed doesn't cost a fortune
Block 3: Plan and Delegate
Move from “prompt and pray” to real delegation. Break the frontend into work packages and run several agents at once.
- Planning work with the agent before writing code
- Using subagents to parallelize independent tasks
- Driving the tight build, test, fix loop and keeping it honest
Block 4: Build It Out
Feature by feature to a polished, responsive Angular frontend, with a clear eye on where agents shine and where they quietly go wrong.
- Building real screens against live API data
- Spotting and correcting the failure modes agents fall into
- Keeping the code clean, typed, and maintainable while moving fast
Block 5: Ship It
A frontend that only runs on your laptop doesn't count. Close the loop with automated review and deployment.
- Agent-assisted MR and PR reviews as a quality gate
- A CI pipeline that builds, checks, and deploys
- Shipping the result, and a candid look at token and resource realities
What You'll Take Away
- A repeatable workflow for turning any API into a clean, working frontend with coding agents
- Hands-on experience wiring MCP so agents can reach an API spec, codebase, and tooling
- Practical patterns for prompting, reviewing, and correcting agents so quality stays high
- Honest judgment about what agentic engineering speeds up, what it breaks, and how to stay in control
Prerequisites and Setup
Bring the following, ready to go on the morning:
- A GitHub account, since we push, review, and deploy through it all day
- A laptop with an IDE you're comfortable in (VS Code, WebStorm, or similar), with Node.js and Git installed
- A Claude subscription, the coding agent we drive throughout the workshop. A paid plan is needed for a full day of hands-on agent use, and a higher tier such as Claude Max is recommended given how token-heavy the day is
- Comfort with TypeScript and the basics of Angular, since you'll build and run a real app
- A Twelve Data account for the free API key (stocks, forex, crypto), unless we provide pooled keys on the day
Your host
Joe Eifert is a Swiss AI engineer, founder and instructor who builds production-scale AI systems with LLMs, agents and MCP, currently consulting for the private bank LGT. He co-founded and served as CTO of the agritech startup databaum, and burns through hundreds of millions of AI tokens a month refining agentic engineering workflows in real projects.
Since 2017 he has taught web development, machine learning and AI at ICT-Berufsbildung Zentralschweiz, and runs hands-on courses on agentic software engineering and enterprise MCP integration.
11–12 February 2027, Lucerne, Switzerland.
Get tickets