Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

The new React Aria docs will have interactive prop controls that update both the component and the code. Configure, test, and copy into your app!

devongovett's profile picture

Devon Govett

41,689 subscribers

16,198 görüntüleme • 9 ay önce •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

Orijinal gönderinin yorumları burada görünecek

Benzer Videolar

we released our react package build an ai chat w/ interactive components in a few lines of code. add it to your app with: npx tambo full-send we support: - streaming for both messages and components - message history and message threads - state manage for generated components - suggested actions based on available components - component library that uses the react package the react package is open-source. server package will be open-sourced later this year.
1:01

we released our react package build an ai chat w/ interactive components in a few lines of code. add it to your app with: npx tambo full-send we support: - streaming for both messages and components - message history and message threads - state manage for generated components - suggested actions based on available components - component library that uses the react package the react package is open-source. server package will be open-sourced later this year.

Michael Magán

65,473 görüntüleme • 1 yıl önce

Introducing the new React Aria docs! 🎉 All-new content and search experience. Interactive CSS and Tailwind examples to get you started quickly – just install with shadcn. New guides and full example apps. MCP server and AI integrations. Check it out!
0:37

Introducing the new React Aria docs! 🎉 All-new content and search experience. Interactive CSS and Tailwind examples to get you started quickly – just install with shadcn. New guides and full example apps. MCP server and AI integrations. Check it out!

Devon Govett

76,555 görüntüleme • 5 ay önce

React Native & with Expo using shadcn template !!! ✨New Component: Import Alert Dialog Components and easily add it your React Native & Expo App Both Expo and RN CLI #buildinpublic #buildingpublic
0:27

React Native & with Expo using shadcn template !!! ✨New Component: Import Alert Dialog Components and easily add it your React Native & Expo App Both Expo and RN CLI #buildinpublic #buildingpublic

Sid

63,524 görüntüleme • 2 yıl önce

Well, it’s finally done. I just need to update the code with the new fixes, and I should have a test build ready.
0:36

Well, it’s finally done. I just need to update the code with the new fixes, and I should have a test build ready.

Echo Stretch

62,240 görüntüleme • 6 ay önce

Introducing Agents UI, an open-source shadcn component library for building polished React frontends for your voice agents. Audio visualizers. Media controls. Session management tools. Chat transcripts. All wired to LiveKit Agents. Install via the shadcn CLI and own the code.
0:43

Introducing Agents UI, an open-source shadcn component library for building polished React frontends for your voice agents. Audio visualizers. Media controls. Session management tools. Chat transcripts. All wired to LiveKit Agents. Install via the shadcn CLI and own the code.

LiveKit

182,387 görüntüleme • 3 ay önce

You can make your Figma designs functional with Claude AI Select component, go to Dev Mode and use Figma to Code plugin to turn to React/Tailwind. Copy the code and paste to Claude AI. Prompt "Create this component and center it". Then, "Make this functional", "Add rounded corners", "add hover states", "animate transitions". Don't forget to ask "always give full code". Otherwise, it might break the Artifact.
6:06

You can make your Figma designs functional with Claude AI Select component, go to Dev Mode and use Figma to Code plugin to turn to React/Tailwind. Copy the code and paste to Claude AI. Prompt "Create this component and center it". Then, "Make this functional", "Add rounded corners", "add hover states", "animate transitions". Don't forget to ask "always give full code". Otherwise, it might break the Artifact.

Meng To

171,513 görüntüleme • 1 yıl önce

Introducing Figma Connect. The best way to turn your Figma designs into code. No MCP hell. No plugins. Just copy and paste your designs into MagicPath and turn them into interactive prototypes without compromising your craft. Every pixel. Every detail. Every asset. Preserved.
1:19

Introducing Figma Connect. The best way to turn your Figma designs into code. No MCP hell. No plugins. Just copy and paste your designs into MagicPath and turn them into interactive prototypes without compromising your craft. Every pixel. Every detail. Every asset. Preserved.

Pietro Schirano

977,727 görüntüleme • 4 ay önce

Introducing Vaul 1.0. A drawer component for React. Rewritten, improved, with new docs.
0:20

Introducing Vaul 1.0. A drawer component for React. Rewritten, improved, with new docs.

Emil Kowalski

119,010 görüntüleme • 1 yıl önce

Move your docs to v0. Easy to update, extend, and collaborate. No more PRs for a one-line edit. Want AI chat or custom features in your docs? Just vibe code them right into the same project. v0 for docs is seriously good.
0:30

Move your docs to v0. Easy to update, extend, and collaborate. No more PRs for a one-line edit. Want AI chat or custom features in your docs? Just vibe code them right into the same project. v0 for docs is seriously good.

Esteban Suárez

36,962 görüntüleme • 8 ay önce

Made a copy of the monthly calendar used by Cal.com with shadcn UI, Radix by WorkOS Colors and React Aria
0:35

Made a copy of the monthly calendar used by Cal.com with shadcn UI, Radix by WorkOS Colors and React Aria

Damián Ricobelli

54,160 görüntüleme • 2 yıl önce

In @Magicpathai every component is a conversation. Edit and refine, either manually or with AI. Design is the art of keeping good decisions. MagicPath lets you copy and paste interactive components across the canvas to explore and perfect your ideas.
1:00

In @Magicpathai every component is a conversation. Edit and refine, either manually or with AI. Design is the art of keeping good decisions. MagicPath lets you copy and paste interactive components across the canvas to explore and perfect your ideas.

Pietro Schirano

53,079 görüntüleme • 1 yıl önce

To edit the code of a Lovable app: 1. Connect your app to GitHub and open in any code editor. 2. Make your edits in the code editor. 3. Push the changes The updates will automatically reflect in your app.
0:56

To edit the code of a Lovable app: 1. Connect your app to GitHub and open in any code editor. 2. Make your edits in the code editor. 3. Push the changes The updates will automatically reflect in your app.

Lovable

20,897 görüntüleme • 1 yıl önce

Today we’re launching an experimental @Figma plugin that will convert your design into runnable code. Generate a Repl directly from Figma, and instantly share a static React app with your team. Then, use Replit AI to add functionality and get your code production-ready.
0:45

Today we’re launching an experimental @Figma plugin that will convert your design into runnable code. Generate a Repl directly from Figma, and instantly share a static React app with your team. Then, use Replit AI to add functionality and get your code production-ready.

Replit ⠕

524,398 görüntüleme • 2 yıl önce

Did you know React 19's ViewTransition component can create smooth, animated transitions between pages? Just wrap elements with the same name prop and React handles the rest. No complex animation libraries needed! 🎬
1:53

Did you know React 19's ViewTransition component can create smooth, animated transitions between pages? Just wrap elements with the same name prop and React handles the rest. No complex animation libraries needed! 🎬

Kent C. Dodds 🏹

26,001 görüntüleme • 6 ay önce

It's finally here! Untitled UI React is live ✨ Untitled UI React is the world’s largest collection of open-source React components built with Tailwind CSS v4.1 and React Aria. Just copy, paste, and build. 👇
1:02

It's finally here! Untitled UI React is live ✨ Untitled UI React is the world’s largest collection of open-source React components built with Tailwind CSS v4.1 and React Aria. Just copy, paste, and build. 👇

Jordan Hughes

243,721 görüntüleme • 10 ay önce

Here is a demo of the most comprehensive research agent for your code docs, powered by Nozomio Labs. It turns your indexed repos and docs into a dynamic tree that the agent can access on the fly, using SOTA tools to reduce code hallucinations. Now using the latest Anthropic model, Claude Opus 4.5.
0:35

Here is a demo of the most comprehensive research agent for your code docs, powered by Nozomio Labs. It turns your indexed repos and docs into a dynamic tree that the agent can access on the fly, using SOTA tools to reduce code hallucinations. Now using the latest Anthropic model, Claude Opus 4.5.

Arlan

28,405 görüntüleme • 6 ay önce

Big React Aria release! 🚀 🥳 Multi Select! 🎬 ComboBox onAction prop, e.g. "create" item ➡️ Disclosure animation ✅ New SelectionIndicator component – animations in Tabs, ToggleButtonGroup, etc. 📱 Improved modal scrolling behavior in iOS 26 📆 Calendar selectionAlignment prop
0:30

Big React Aria release! 🚀 🥳 Multi Select! 🎬 ComboBox onAction prop, e.g. "create" item ➡️ Disclosure animation ✅ New SelectionIndicator component – animations in Tabs, ToggleButtonGroup, etc. 📱 Improved modal scrolling behavior in iOS 26 📆 Calendar selectionAlignment prop

Devon Govett

51,350 görüntüleme • 8 ay önce

Recreated the Apple Photos UI with React Aria in just ~200 lines! Complete with virtualized scrolling, view transitions, adjustable waterfall layout, folder tree, search, multi-selection, and accessible drag and drop. Just one of the demos I'm planning for the new docs. 🙂
0:30

Recreated the Apple Photos UI with React Aria in just ~200 lines! Complete with virtualized scrolling, view transitions, adjustable waterfall layout, folder tree, search, multi-selection, and accessible drag and drop. Just one of the demos I'm planning for the new docs. 🙂

Devon Govett

46,438 görüntüleme • 9 ay önce

Turn design into code with Claude Code + Figma. Through MCP, Claude sees your mockup at the data level—component hierarchies, design tokens, auto-layout rules—and translates it into production-ready code.
0:33

Turn design into code with Claude Code + Figma. Through MCP, Claude sees your mockup at the data level—component hierarchies, design tokens, auto-layout rules—and translates it into production-ready code.

Claude

2,593,287 görüntüleme • 8 ay önce

Introducing v0 by Vercel - v0 generates custom components on the fly that you can copy and paste into your existing codebase. Need a component? Just Ask - Jared Palmer Mariana Castilho Guillermo Rauch Malte Ubl almonk and the team at Vercel
0:30

Introducing v0 by Vercel - v0 generates custom components on the fly that you can copy and paste into your existing codebase. Need a component? Just Ask - Jared Palmer Mariana Castilho Guillermo Rauch Malte Ubl almonk and the team at Vercel

shadcn

737,141 görüntüleme • 2 yıl önce