Loading video...

Video Failed to Load

Go Home

Introducing React Grab Select any element on your page → tell Claude Code or Codex what to change Fully open source npx react-grab@latest

aidenybai's profile picture

Aiden Bai

70,402 subscribers

959,031 views • 7 months ago •via X (Twitter)

EducationNews & PoliticsScience & Technology
LIVE

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

Introducing React Grab: Select elements and edit with Cursor/Claude Code Works in your localhost and in any React app
0:11

Introducing React Grab: Select elements and edit with Cursor/Claude Code Works in your localhost and in any React app

Aiden Bai

527,287 views • 11 months ago

Introducing /react-doctor Your React app probably has bad code. This fixes it Install as agent skill. Fully open source. npx react-doctor@latest
0:15

Introducing /react-doctor Your React app probably has bad code. This fixes it Install as agent skill. Fully open source. npx react-doctor@latest

Aiden Bai

586,747 views • 4 months ago

New in React Doctor: Prevent bad React code from breaking prod Install GitHub Action. Fully open source npx react-doctor@latest
0:11

New in React Doctor: Prevent bad React code from breaking prod Install GitHub Action. Fully open source npx react-doctor@latest

Aiden Bai

63,325 views • 4 months ago

Introducing React Native Doctor Find performance and security bugs in your mobile app Run via CLI and fix with agents. Fully open source npx react-doctor@latest
0:17

Introducing React Native Doctor Find performance and security bugs in your mobile app Run via CLI and fix with agents. Fully open source npx react-doctor@latest

Aiden Bai

172,586 views • 4 months ago

In Claude Code desktop's Browser pane, you can select any element (⌘⇧S) and say what to change. Claude reads the DOM elements, React components, and styles before making edits. You can also draw on the page, and give the annotation to Claude as context.
0:19

In Claude Code desktop's Browser pane, you can select any element (⌘⇧S) and say what to change. Claude reads the DOM elements, React components, and styles before making edits. You can also draw on the page, and give the annotation to Claude as context.

Anthony Morris ツ

46,294 views • 2 months ago

i think i might've got React Grab working in the terminal... select a TUI element → give to agent as context
0:11

i think i might've got React Grab working in the terminal... select a TUI element → give to agent as context

Aiden Bai

36,481 views • 7 months ago

Added new transitions to There are now 21 transitions you can copy as CSS or React code or use as a skill for Claude, Cursor or Codex npx skills add jakubantalik/transitions.dev
0:15

Added new transitions to There are now 21 transitions you can copy as CSS or React code or use as a skill for Claude, Cursor or Codex npx skills add jakubantalik/transitions.dev

Jakub Antalik

220,993 views • 4 months ago

Added 12 new transitions to 33 total You can copy as CSS or React code or use as a skill for Claude, Cursor or Codex or use with Refine tool npx skills add jakubantalik/transitions.dev
0:13

Added 12 new transitions to 33 total You can copy as CSS or React code or use as a skill for Claude, Cursor or Codex or use with Refine tool npx skills add jakubantalik/transitions.dev

Jakub Antalik

74,750 views • 3 months ago

(re-)introducing Avatars fully generative gradients based on seed available on npm and fully open-source grab it here:
0:13

(re-)introducing Avatars fully generative gradients based on seed available on npm and fully open-source grab it here:

Jesse

73,982 views • 3 months ago

Introducing text-to-lottie: an open source skill and harness for generating production ready Lottie animations with codex/claude code. $ npx skills add diffusionstudio/lottie Prompts guide and repo in the comments.
0:12

Introducing text-to-lottie: an open source skill and harness for generating production ready Lottie animations with codex/claude code. $ npx skills add diffusionstudio/lottie Prompts guide and repo in the comments.

konstantinpaulus

883,456 views • 4 months ago

Introducing Expect Let agents test your code in a real browser 1. Run Claude Code / Codex to QA your app 2. Watch a video of every bug found 3. Fix and repeat until passing Run as a CLI or agent skill. Fully open source
0:16

Introducing Expect Let agents test your code in a real browser 1. Run Claude Code / Codex to QA your app 2. Watch a video of every bug found 3. Fix and repeat until passing Run as a CLI or agent skill. Fully open source

Aiden Bai

846,043 views • 7 months ago

Introducing React Doctor Scan your React codebase for anti-patterns: - Unnecessary useEffects - Fix accessibility issues - Prop drilling instead of context / composition Run as a CLI or agent skill. Repeat until passing. Fully open source
0:12

Introducing React Doctor Scan your React codebase for anti-patterns: - Unnecessary useEffects - Fix accessibility issues - Prop drilling instead of context / composition Run as a CLI or agent skill. Repeat until passing. Fully open source

Aiden Bai

1,081,802 views • 8 months ago

made a nothing design skill for claude code. tell it "nothing style" and it builds the whole thing. tokens, components, dark+light. go grab it, it’s open source:
0:15

made a nothing design skill for claude code. tell it "nothing style" and it builds the whole thing. tokens, components, dark+light. go grab it, it’s open source:

Dom

293,131 views • 6 months ago

Tired of asking Claude to change a Tailwind class? Claude Code on desktop makes it easy to browse, view, or edit files. Use CMD+Shift+F or open select Files from the pane picker in your sessions today.
0:16

Tired of asking Claude to change a Tailwind class? Claude Code on desktop makes it easy to browse, view, or edit files. Use CMD+Shift+F or open select Files from the pane picker in your sessions today.

Anthony Morris ツ

15,738 views • 6 months ago

Claude Code on desktop lets you select DOM elements directly, much easier than describing which component you want updated! Claude gets the tag, classes, key styles, surrounding HTML, and a cropped screenshot. React apps also get the source file, component name and props
0:16

Claude Code on desktop lets you select DOM elements directly, much easier than describing which component you want updated! Claude gets the tag, classes, key styles, surrounding HTML, and a cropped screenshot. React apps also get the source file, component name and props

Lydia Hallie ✨

608,327 views • 7 months ago

I made an extension for using Claude Code, Codex CLI, Copilot in the browser. Select elements and send them to the agent. Works in: ✅ Next.js ✅ React (Vite) ✅ TanStack Start ✅ Vue ✅ Astro ✅ Plain HTML ✅ Any other framework (.NET, Ruby, etc.) Here's how it works...
0:15

I made an extension for using Claude Code, Codex CLI, Copilot in the browser. Select elements and send them to the agent. Works in: ✅ Next.js ✅ React (Vite) ✅ TanStack Start ✅ Vue ✅ Astro ✅ Plain HTML ✅ Any other framework (.NET, Ruby, etc.) Here's how it works...

Wesley

97,456 views • 1 year ago

I brought progressive blur to react native with Expo Native Modules ✨ needed it for this sleep timer island, so I built it. grab the source on motionary 👇
0:14

I brought progressive blur to react native with Expo Native Modules ✨ needed it for this sleep timer island, so I built it. grab the source on motionary 👇

Mehdi · Motionary

11,264 views • 1 month ago

Sonnet as the main model, Opus as an advisor, and Haiku for subagents Save this and try it with one of your sessions Install: npx claude-code-templates@latest --setting model/sonnet-opus-advisor-haiku-subagents This command installs the settings required to configure your Claude Code sessions with this model distribution Select the appropriate configuration scope: User, Project, or Local
0:17

Sonnet as the main model, Opus as an advisor, and Haiku for subagents Save this and try it with one of your sessions Install: npx claude-code-templates@latest --setting model/sonnet-opus-advisor-haiku-subagents This command installs the settings required to configure your Claude Code sessions with this model distribution Select the appropriate configuration scope: User, Project, or Local

Daniel San

28,819 views • 11 days ago

Introducing Dexter 2.0 Open source. Built for financial research. Like Claude Code, but for stocks. What Dexter does: • plans tasks • runs on its own • validates its work • researches stocks It uses OSS tools like , with a fresh stack of typescript, react, ink, and bun. Fast to build. Easy to use. No coding required. My favorite project of the year.
0:13

Introducing Dexter 2.0 Open source. Built for financial research. Like Claude Code, but for stocks. What Dexter does: • plans tasks • runs on its own • validates its work • researches stocks It uses OSS tools like , with a fresh stack of typescript, react, ink, and bun. Fast to build. Easy to use. No coding required. My favorite project of the year.

Virat Singh

210,314 views • 10 months ago