Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

How I've changed the way I do code reviews by using the /visual-recap skill:

118,303 Aufrufe • vor 3 Monaten •via X (Twitter)

35 Kommentare

Profilbild von Steve (Builder.io)
Steve (Builder.io)vor 3 Monaten

Source and install instructions here: Source for the MDX viewer/editor here:

Profilbild von Kent C. Dodds 🐨
Kent C. Dodds 🐨vor 3 Monaten

I'm going to try this out and make a video about it. I talked to several people at AIE this week about building this exact skill myself, so I'm excited to play with it!

Profilbild von Steve (Builder.io)
Steve (Builder.io)vor 3 Monaten

amazing @kentcdodds, if you have any Qs or issues DM me anytime, happy to help

Profilbild von Yoav Ganbar
Yoav Ganbarvor 3 Monaten

@kentcdodds looks sweet! most def geek diving into this

Profilbild von Chukwudi Nwobodo
Chukwudi Nwobodovor 3 Monaten

@Steve8708 do i have permission to add this to my harness?

Profilbild von Steve (Builder.io)
Steve (Builder.io)vor 3 Monaten

absolutely

Profilbild von Chukwudi Nwobodo
Chukwudi Nwobodovor 3 Monaten

Thank you so much

Profilbild von Chris Scott
Chris Scottvor 3 Monaten

I use this same skill with some modifications for pr review also.

Profilbild von Quardart Seisey
Quardart Seiseyvor 3 Monaten

I changed the way I do code reviews by letting codex review claude PRs and letting claude review codex PRs 😆

Profilbild von Russell Joshua
Russell Joshuavor 3 Monaten

*yoink

Profilbild von Cruz
Cruzvor 3 Monaten

@kentcdodds This is a great way to approve a bug

Profilbild von Paulund
Paulundvor 3 Monaten

This is really cool. Great work Steve.

Profilbild von A. F. ♪
A. F. ♪vor 3 Monaten

When I get the time, I will try to use it on gitlab, since I no longer use github, unless you port it before I get to it.

Profilbild von giiid💫
giiid💫vor 3 Monaten

is it opencode compatible?

Profilbild von Steve (Builder.io)
Steve (Builder.io)vor 3 Monaten

absolutely is

Profilbild von Cyrus Radfar
Cyrus Radfarvor 3 Monaten

you could also use code tours bias: I created it 🤭

Profilbild von Chiara
Chiaravor 3 Monaten

anything that speeds up a code review is a clear win. you get to approve the deployment that takes down production with unprecedented efficiency

Profilbild von Andy Wang
Andy Wangvor 3 Monaten

@plannotator

Profilbild von Ravin Sharma
Ravin Sharmavor 3 Monaten

I am building something similar, but more granular control, and better experience.

Profilbild von Shara
Sharavor 3 Monaten

Turning reviews into actual reviews instead of rubber stamps is valuable.

Profilbild von Ireneusz Patalas
Ireneusz Patalasvor 3 Monaten

Is it GitHub only or can I also use it locally with any git repo when I check out the PR branch?

Profilbild von Steve (Builder.io)
Steve (Builder.io)vor 3 Monaten

works anywhere - GitHub is just an example

Profilbild von Ireneusz Patalas
Ireneusz Patalasvor 3 Monaten

Tried it today with the plan (it’s awesome!) but I wonder how do I do /visual-recap on a PR outside GitHub? Do I need to checkout the PR branch and it will figure out the diff from that automatically?

Profilbild von ᕲΛᐺΞ ᗷΛᖇᖇΞTT 🍥
ᕲΛᐺΞ ᗷΛᖇᖇΞTT 🍥vor 3 Monaten

You still do code reviews? Our team's workflow has PR reviews mostly automated - We require a human review also, but the majority of the time it's nailing it & flagging anything important. We have a /respond the engineer can address anything that was relevant or decline points

Profilbild von Sebastian Buzdugan
Sebastian Buzduganvor 3 Monaten

/visual-recap catches shape, but deleted tests still need boring manual review

Profilbild von ΛNGΞL
ΛNGΞLvor 3 Monaten

Do you have a YouTube channel where you explain the other skills as well? 👀

Profilbild von Rifad
Rifadvor 3 Monaten

Anthropic should hire you

Profilbild von Bhagyesh Radiya
Bhagyesh Radiyavor 3 Monaten

Will definitely give it a try seems good but, how it is different from artifacts which is launched today by claude

Profilbild von Piyush
Piyushvor 3 Monaten

Try , you might change how you code with agents:)

Profilbild von Hanan Beer
Hanan Beervor 3 Monaten

I made a graphviz skill to show me well graphviz lol prompt in the top right corner (sorry I had to censor a bit for security - probably nothing sensitive but better safe than sorry)

Profilbild von Timur Yessenov
Timur Yessenovvor 3 Monaten

@Steve8708 The MDX viewer is the useful clue. Code review shouldn’t start from a wall of comments; it should start from the changed screen/state, then jump into the diff that made it happen.

Profilbild von Sophie e.
Sophie e.vor 1 Monat

A one-size-fits-all visual recap can miss the nuance of logic errors. How do you keep the team from relying on it as a crutch instead of thinking critically?

Profilbild von Back LLM Radar|Syl
Back LLM Radar|Sylvor 3 Monaten

This is the right direction. Code review is becoming less “read the diff” and more “verify the artifact.” A useful recap should include screenshots, user path, changed files, risk labels, untested cases, and rollback notes. Makes AI-assisted review auditable, not just faster.

Profilbild von Theo
Theovor 3 Monaten

Check out it has been a complete game changer for me.

Profilbild von Ovi Bodea
Ovi Bodeavor 3 Monaten

been building something like this as well, but this is so much better, plus the MDX idea is genius! I'm playing with it right now

Ähnliche Videos

Introducing /visual-plan - a skill to generate rich, visual plans for Claude Code and Codex. Plan mode in Claude Code is incredible. But I always find my eyes glazing over when it gives me this huge markdown essay in my terminal. I found I can make much better visual plans with reusable components. So I made a skill called `/visual-plan`. It generates plans as MDX with visual, interactive components. Diagrams, interactive API specs, schema design changes, annotated code, and even pan and zoomable wireframes. So for any UI work, you can look at a wireframe first, comment on it, iterate, and then have the agent work. I’ve found this to be a much more intuitive interface for reasoning about what the agent is doing. It’s somewhat inspired by that popular post about how HTML is better than Markdown. But HTML can be slow and verbose to write. And it doesn’t look good checked into a repo. This has really made me feel like humans and engineering are entering a new abstraction phase, where we reason about things at the plan level. As long as the plan is good, agents are getting more and more reliable at executing on it. Almost to the degree that we trust the C compiler to compile to assembly reliably. Plans are the new intermediate representation. I also made a skill for the reverse of this, called `/visual-recap`. After the agent works, it gives you a recap of everything it did. Same idea: wireframes, interactive API specs and diffs, schemas, annotated code, etc. So now when you’re reviewing what the agent did for you, or looking at a pull request of somebody else’s code, you can see a visual recap instead of just reading a wall of text. It’s all free and open source. You can find it on my GitHub. Will link to it in the reply because we all know how dumb these algorithms are with links.

Steve (Builder.io)

126,758 Aufrufe • vor 4 Monaten