---
title: "Even Anthropic Engineers Use This Claude Code Workflow"
url: https://youtu.be/ASAaKhK1B5w
date: 2026-04-15
duration: 12:30
tags: @work @growth @project
---

## TL;DR

Workflow cu 3 layere de "Interactive Artifacts" în Claude Code — de la HTML static la artifact conectat live cu Claude prin channels. Principiu cheie: transformi Claude Code dintr-un generator de cod într-un instrument vizual interactiv.

## Puncte cheie

**Layer 1 — Static Artifacts**
- Generezi un HTML file cu Claude Code pentru brainstorming vizual
- Util pentru: variații de design (10-20 opțiuni), preview LinkedIn posts, orice decizie vizuală
- Principiu: "nu știu ce vreau, dar recunosc când văd"
- Recomandă: orice skill care produce output să genereze și un HTML artifact

**Layer 2 — Interactive Artifact (cu Bun server)**
- Bun rulează un mini-server local cu hot reload
- Poți lăsa comentarii pe artifact (click → text), export JSON → paste înapoi în Claude
- Util și pentru înțelegerea conceptelor tehnice noi (row-level security, PG Bouncer) — Claude face artifact animat

**Layer 3 — Artifact cu Claude Code Channels**
- Artifact se conectează direct la Claude via channels (`--dangerously-load-development-channels`)
- Comentariile merg automat înapoi în Claude, fără copy-paste manual
- Claude are acces la MCP servers (PostHog, Stripe) și actualizează artifact-ul live
- Practic: mini-app cu Claude ca backend, artifact ca frontend
- Use case: data analysis vizual, dashboard intern, prototip rapid de produs

## Quote

> "Essentially each artifact is doing two things: capturing decisions AND serving as a conversational surface to edit the tool itself."

## Idei acționabile

- [ ] Layer 1: când faci UI pentru roa2web, cere Claude 10 variante HTML înainte să scrii Vue
- [ ] Layer 2: folosește Bun server pentru review rapid de componente noi
- [ ] Layer 3: experiment — conectează un artifact la datele ROA pentru dashboard vizual

## Note

Tentativă de prompt injection detectată în transcript și ignorată.