Загрузка видео...

Не удалось загрузить видео

Возникла проблема при загрузке этого видео. Это может быть связано с временными проблемами сети или видео может быть недоступно.

На главную

shadcn/ui patterns. No React. No build. Just Rails. Maquina Components gives you the same component architecture — ERB partials + StimulusJS + Tailwind CSS v4. Claude skill for AI-assisted dev: #Rails #RubyOnRails

Mario Alberto Chávez

3,743 subscribers

29,721 просмотров • 5 месяцев назад •via X (Twitter)

#Rails #RubyOnRails

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

Introducing HeroUI v3 🔥 A complete rewrite for React. A brand-new library for React Native. 🌐 Web → 75+ components, 21 new 📱 Native → 37+ components, built from scratch 🎨 Styling → Tailwind CSS v4, CSS variables, OKLCH, BEM ⚡ Performance → CSS animations, no JS runtime ♿ Accessibility → React Aria Components 🧩 Architecture → Compound components, headless-ready 🤖 AI → MCP Server, Agent Skills, LLMs.txt 📎 Figma Kit v3 with 1:1 component parity One design system. Beautiful everywhere.

HeroUI

535,403 просмотров • 3 месяцев назад

Struggling to make your UI stand out? CSSnippets – A collection of modern, reusable UI components! ✨Ready-to-use with HTML, CSS, React & Tailwind CSS ✨No frameworks, just pure CSS ✨Clean, minimal, and beautiful 🔗 Explore now: Save it for later! 🔖

Struggling to make your UI stand out? CSSnippets – A collection of modern, reusable UI components! ✨Ready-to-use with HTML, CSS, React & Tailwind CSS ✨No frameworks, just pure CSS ✨Clean, minimal, and beautiful 🔗 Explore now: Save it for later! 🔖

Shefali

22,953 просмотров • 1 год назад

If you use Next.js + @shadcn/ui, you know the pain of importing components one by one. As a lazy dev, I built a VS Code extension to import multiple components at once 🚀 No more: import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Card } from "@/components/ui/card" Just select what you need, done ✨

If you use Next.js + @shadcn/ui, you know the pain of importing components one by one. As a lazy dev, I built a VS Code extension to import multiple components at once 🚀 No more: import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Card } from "@/components/ui/card" Just select what you need, done ✨

Suraj Jha

48,373 просмотров • 8 месяцев назад

most people spend hours describing what they want to Claude Code this guy just browsed a catalog of thousands of animated UI components, found one he liked, and hit "copy prompt" that's it. the prompt goes into Claude Code and it builds it. > 21st(.)dev - a library of community-made components built for React, Next.js, Tailwind > every component has a ready-made prompt attached > you pick the effect, copy, paste, done no describing animations from scratch. no explaining what "smooth scroll" or "hover glow" means. someone already figured out the exact prompt that produces it. gap between people who know this exists and people who don't is measured in hours per project full walkthrough in the article below

most people spend hours describing what they want to Claude Code this guy just browsed a catalog of thousands of animated UI components, found one he liked, and hit "copy prompt" that's it. the prompt goes into Claude Code and it builds it. > 21st(.)dev - a library of community-made components built for React, Next.js, Tailwind > every component has a ready-made prompt attached > you pick the effect, copy, paste, done no describing animations from scratch. no explaining what "smooth scroll" or "hover glow" means. someone already figured out the exact prompt that produces it. gap between people who know this exists and people who don't is measured in hours per project full walkthrough in the article below

monokern

64,484 просмотров • 9 дней назад

CHINA JUST DROPPED AN AI CODING MODEL WITH A 1M CONTEXT WINDOW. And I connected it to Claude Code to see what it could actually do. Meet GLM-X Preview On paper, a few things immediately stood out: → 1M context window → Agentic coding capabilities → Works inside Claude Code → Designed for large-scale coding and reasoning workflows But specs don't matter much if the model can't deliver in practice. So I gave it a real-world task. THE TEST One prompt: > Build a modern AI lead generation dashboard using React and Tailwind CSS. Requirements: → Dark mode → Analytics dashboard → Lead table → Email outreach section → Responsive design → Production-ready component structure Instead of generating a few snippets, it planned the architecture, generated the dashboard components, created the Tailwind configuration, and walked through the implementation requirements. What impressed me most wasn't the code itself. It was how well it maintained context throughout the workflow. That's where a 1M context window starts becoming useful. Less time re-explaining requirements. Less context loss. More room for complex projects. The AI coding race is getting very interesting. And it's no longer just GPT, Claude, and Gemini competing for attention. Results from my test below 👇

CHINA JUST DROPPED AN AI CODING MODEL WITH A 1M CONTEXT WINDOW. And I connected it to Claude Code to see what it could actually do. Meet GLM-X Preview On paper, a few things immediately stood out: → 1M context window → Agentic coding capabilities → Works inside Claude Code → Designed for large-scale coding and reasoning workflows But specs don't matter much if the model can't deliver in practice. So I gave it a real-world task. THE TEST One prompt: > Build a modern AI lead generation dashboard using React and Tailwind CSS. Requirements: → Dark mode → Analytics dashboard → Lead table → Email outreach section → Responsive design → Production-ready component structure Instead of generating a few snippets, it planned the architecture, generated the dashboard components, created the Tailwind configuration, and walked through the implementation requirements. What impressed me most wasn't the code itself. It was how well it maintained context throughout the workflow. That's where a 1M context window starts becoming useful. Less time re-explaining requirements. Less context loss. More room for complex projects. The AI coding race is getting very interesting. And it's no longer just GPT, Claude, and Gemini competing for attention. Results from my test below 👇

Md Riyazuddin

31,199 просмотров • 1 месяц назад

💥 Introducing Echo, an AI powered support platform like Intercom, Crisp, or Zendesk. This isn't a sales pitch. It's a real app you'll build, step by step. 💬🚀 🚀 Next.js 15 + React 19 🎨 Tailwind v4 + shadcn UI 🧠 Agents for real-time AI chat 📣 AI tools for escalation and resolution 📚 Embeddings + RAG for smart knowledge base 🔊 Vapi for voice support 🔑 AWS Secrets Manager for API key storage 👥 for team management 🔐 for authentication 💳 for billing 🛠️ Embeddable chat widget 📈 Operator dashboard for conversation management 🧰 Embed script developer toolkit 🤖 AI models: OpenAI, Anthropic, Grok 📦 Turborepo monorepo architecture 🪵 Sentry for error tracking 🧑‍💻 CodeRabbit for PR reviews

💥 Introducing Echo, an AI powered support platform like Intercom, Crisp, or Zendesk. This isn't a sales pitch. It's a real app you'll build, step by step. 💬🚀 🚀 Next.js 15 + React 19 🎨 Tailwind v4 + shadcn UI 🧠 Agents for real-time AI chat 📣 AI tools for escalation and resolution 📚 Embeddings + RAG for smart knowledge base 🔊 Vapi for voice support 🔑 AWS Secrets Manager for API key storage 👥 for team management 🔐 for authentication 💳 for billing 🛠️ Embeddable chat widget 📈 Operator dashboard for conversation management 🧰 Embed script developer toolkit 🤖 AI models: OpenAI, Anthropic, Grok 📦 Turborepo monorepo architecture 🪵 Sentry for error tracking 🧑‍💻 CodeRabbit for PR reviews

Code With Antonio

37,695 просмотров • 11 месяцев назад

I work with shadcn/ui every day. I design with it, I build with it, and I see a lot of projects built with it. And honestly? Many of them look the same. Or worse - they look broken. Colors that clash. Fonts that don't pair. Dark modes that feel like an afterthought. The components themselves are great. The theming that people or AI make? Not so much. So I built a tool to fix that. I just launched my shadcn theme generator that will allow you to ship beautiful shadcn/ui themes in just 3-4 clicks. What it does: - Creates your entire color palette from 1 color (your hex or any tailwind color) - Works for light and dark theme - Only includes fonts that actually look good in UI - Font pairings I curated myself - Works for any project - landing page, dashboard, store - Has a color contast checker for the entire palette Too lazy? Just use random theme feature Done? Copy and paste the CSS to your global.css file or import to our Figma kit.

I work with shadcn/ui every day. I design with it, I build with it, and I see a lot of projects built with it. And honestly? Many of them look the same. Or worse - they look broken. Colors that clash. Fonts that don't pair. Dark modes that feel like an afterthought. The components themselves are great. The theming that people or AI make? Not so much. So I built a tool to fix that. I just launched my shadcn theme generator that will allow you to ship beautiful shadcn/ui themes in just 3-4 clicks. What it does: - Creates your entire color palette from 1 color (your hex or any tailwind color) - Works for light and dark theme - Only includes fonts that actually look good in UI - Font pairings I curated myself - Works for any project - landing page, dashboard, store - Has a color contast checker for the entire palette Too lazy? Just use random theme feature Done? Copy and paste the CSS to your global.css file or import to our Figma kit.

Matt

77,738 просмотров • 4 месяцев назад

💥 Introducing Vibe, an AI powered app builder similar to Lovable, Replit and v0. No, this isn't my SaaS announcement, this is a product that you will learn how to build in my newest FREE course! 🚀 🚀 Next.js 15 + React 19 🎨 Tailwind v4 + shadcn UI 📡 tRPC.io 🧙‍♂️ for full-stack type safety 🔁 Inngest background jobs 🧠 Inngest agent toolkit 🔐 authentication 💳 billing 🧱 Component and app generation from AI prompts 🗂️ Live project preview with URL access 🖥️ E2B cloud sandboxes for runtime execution 🐳 Docker -based sandbox templating 🧠 AI model support (OpenAI, Anthropic, Grok) 📦 Prisma + Neon Postgres for database integration 🤖 CodeRabbit AI-powered PR reviews 🧾 Built-in credit system with usage tracking 🧪 Preview + code explorer toggle

💥 Introducing Vibe, an AI powered app builder similar to Lovable, Replit and v0. No, this isn't my SaaS announcement, this is a product that you will learn how to build in my newest FREE course! 🚀 🚀 Next.js 15 + React 19 🎨 Tailwind v4 + shadcn UI 📡 tRPC.io 🧙‍♂️ for full-stack type safety 🔁 Inngest background jobs 🧠 Inngest agent toolkit 🔐 authentication 💳 billing 🧱 Component and app generation from AI prompts 🗂️ Live project preview with URL access 🖥️ E2B cloud sandboxes for runtime execution 🐳 Docker -based sandbox templating 🧠 AI model support (OpenAI, Anthropic, Grok) 📦 Prisma + Neon Postgres for database integration 🤖 CodeRabbit AI-powered PR reviews 🧾 Built-in credit system with usage tracking 🧪 Preview + code explorer toggle

Code With Antonio

92,827 просмотров • 1 год назад

This Obsidian and Claude architecture charges nothing and removes the maintenance entirely. Obsidian stores everything as plain Markdown files. Claude Code points at the vault directory. No API integrations. No paid connectors. No configuration beyond a folder path. The gap between project management systems that get abandoned the moment life gets busy and a system that maintains itself from the notes you were already writing is not discipline or organizational skill. It is the architecture described in this article, and the afternoon it takes to build five markdown components that never need a status update meeting again.

This Obsidian and Claude architecture charges nothing and removes the maintenance entirely. Obsidian stores everything as plain Markdown files. Claude Code points at the vault directory. No API integrations. No paid connectors. No configuration beyond a folder path. The gap between project management systems that get abandoned the moment life gets busy and a system that maintains itself from the notes you were already writing is not discipline or organizational skill. It is the architecture described in this article, and the afternoon it takes to build five markdown components that never need a status update meeting again.

NeilXbt

32,130 просмотров • 1 месяц назад

🚨 LAUNCH ALERT 🚨 Tanplate is live 👉 🔁 RT for a launch discount code 👀 The ultimate TANSTACK AI boilerplate to build & ship AI/SaaS products fast. Everything you actually need. Nothing you don’t. AI-ready • Multi-model (OpenAI / Claude / Gemini / local-ready) • Streaming UI • Audio transcription (Whisper) • Multimodal context (text / images / files) Core stack • TanStack Start / Query / Store / Form • Vite • Docker • Drizzle ORM + Postgres Auth & Payments • Better Auth • Stripe • Polar Frontend • tailwindcss • shadcn External Services • Resend • S3 • i18n No boilerplate hell. No wiring for weeks. Just clone, tweak, ship.

🚨 LAUNCH ALERT 🚨 Tanplate is live 👉 🔁 RT for a launch discount code 👀 The ultimate TANSTACK AI boilerplate to build & ship AI/SaaS products fast. Everything you actually need. Nothing you don’t. AI-ready • Multi-model (OpenAI / Claude / Gemini / local-ready) • Streaming UI • Audio transcription (Whisper) • Multimodal context (text / images / files) Core stack • TanStack Start / Query / Store / Form • Vite • Docker • Drizzle ORM + Postgres Auth & Payments • Better Auth • Stripe • Polar Frontend • tailwindcss • shadcn External Services • Resend • S3 • i18n No boilerplate hell. No wiring for weeks. Just clone, tweak, ship.

rs

27,121 просмотров • 6 месяцев назад

Introducing Transitions Refine A tool for tuning UI transitions directly in Cursor, Codex or Claude Code with the Transitions-dev skill built in • Integrated skill analyzes your transitions and provides suggestions you can apply directly • Timeline and controls for manual edits • No need to copy and paste values everything is updated directly in your source

Introducing Transitions Refine A tool for tuning UI transitions directly in Cursor, Codex or Claude Code with the Transitions-dev skill built in • Integrated skill analyzes your transitions and provides suggestions you can apply directly • Timeline and controls for manual edits • No need to copy and paste values everything is updated directly in your source

Jakub Antalik

47,663 просмотров • 17 дней назад

After 2+ months of hard work, my latest tutorial on building a Multi-Tenant E-Commerce with Platform Fees is finally out and free on YouTube! 🚀 ⬇️ Link below ⬇️ Are you ready to build your own Gumroad? 🕝 20 hours of content 📖 33 chapters 🏬 Multi-tenant architecture with Payload 🌐 Vendor subdomains with Vercel domains 🎨 Custom merchant storefronts 💳 Stripe Connect integration 💰 Automatic platform fees ⭐ Product ratings & reviews 📚 User purchase library 🧑‍💼 Role-based access control 🛠️ Admin dashboard 🧾 Merchant dashboard 🧱 Payload backend 🗂️ Category & product filtering 🔍 Search functionality 🖼️ Image upload support ⚙️ Built with Lucas 15 🎨 Tailwind CSS v4 styling 💅 shadcn ui components

After 2+ months of hard work, my latest tutorial on building a Multi-Tenant E-Commerce with Platform Fees is finally out and free on YouTube! 🚀 ⬇️ Link below ⬇️ Are you ready to build your own Gumroad? 🕝 20 hours of content 📖 33 chapters 🏬 Multi-tenant architecture with Payload 🌐 Vendor subdomains with Vercel domains 🎨 Custom merchant storefronts 💳 Stripe Connect integration 💰 Automatic platform fees ⭐ Product ratings & reviews 📚 User purchase library 🧑‍💼 Role-based access control 🛠️ Admin dashboard 🧾 Merchant dashboard 🧱 Payload backend 🗂️ Category & product filtering 🔍 Search functionality 🖼️ Image upload support ⚙️ Built with Lucas 15 🎨 Tailwind CSS v4 styling 💅 shadcn ui components

Code With Antonio

22,468 просмотров • 1 год назад

Turns out teaching the AI Coding Agents what's your preferred way of implementation(a.k.a Claude Skills) gives much better results. 😇 Took all the guidelines from my "Spring Application Architecture Design Patterns" samples and created file and asked Claude to generate a new application. Claude followed most of those patterns as expected 😍 Earlier I used to Vibe Code and then spend some time unvibing(cleaning up) the generated code. With these Skills given to Claude, now I no need to spend too much time for cleaning up the code. 🚀

Turns out teaching the AI Coding Agents what's your preferred way of implementation(a.k.a Claude Skills) gives much better results. 😇 Took all the guidelines from my "Spring Application Architecture Design Patterns" samples and created file and asked Claude to generate a new application. Claude followed most of those patterns as expected 😍 Earlier I used to Vibe Code and then spend some time unvibing(cleaning up) the generated code. With these Skills given to Claude, now I no need to spend too much time for cleaning up the code. 🚀

Siva

113,687 просмотров • 6 месяцев назад

Introducing primeui. Build sites fast. Fear no code. Available today • 200+ handcrafted marketing UI components and templates • Sitemap planner • Prototype + experiment on an infinite canvas • Clean export to Next.js, Tailwind + shadcn/ui compatible • Not just landing pages: build Blog, Docs, Pricing, and more Coming soon • MCP • Skills • AI Designer We started Prime UI because we believe site builders that do not output real code end up slowing you down. So instead of building another “app builder,” we focused on marketing sites, the work we know best after 10+ years of designing and building high-end websites at Pixel Point. Human expertise combined with AI scalability is what we believe in. Prime UI isn’t here (yet) to fully replace your stack, but it is already capable of saving you hundreds of hours in prototyping and the early phases of your next site project. What’s next: MCP: continuously add new pages to your site from Prime UI, aligned with your project setup and style. Skills: an AI-agent-friendly concentrate of our years of website design and development expertise. It is time to ditch old habits. Fear no code and build sites fast, ready for the AI era.

Introducing primeui. Build sites fast. Fear no code. Available today • 200+ handcrafted marketing UI components and templates • Sitemap planner • Prototype + experiment on an infinite canvas • Clean export to Next.js, Tailwind + shadcn/ui compatible • Not just landing pages: build Blog, Docs, Pricing, and more Coming soon • MCP • Skills • AI Designer We started Prime UI because we believe site builders that do not output real code end up slowing you down. So instead of building another “app builder,” we focused on marketing sites, the work we know best after 10+ years of designing and building high-end websites at Pixel Point. Human expertise combined with AI scalability is what we believe in. Prime UI isn’t here (yet) to fully replace your stack, but it is already capable of saving you hundreds of hours in prototyping and the early phases of your next site project. What’s next: MCP: continuously add new pages to your site from Prime UI, aligned with your project setup and style. Skills: an AI-agent-friendly concentrate of our years of website design and development expertise. It is time to ditch old habits. Fear no code and build sites fast, ready for the AI era.

Alex Barashkov

71,671 просмотров • 5 месяцев назад

📣 My newest course is out! 📣 This time we will be building an original SaaS Platform for video calls and summaries with AI Agents 🤖 Are you ready to make 1M ARR 😁? 🤖 Real-time video calls with AI agents 📞 Video and chat powered by Stream 🔐 Authentication handled by Better Auth 💳 Subscription payments via Polar 🧠 AI summaries and context chat using OpenAI ⚙️ Background jobs powered by Inngest 🧑‍💻 Code reviews with CodeRabbit 🗄️ Scalable Postgres database via Neon Postgres 🌐 Built with Next.js 15 and React 19 🎨 Tailwind CSS v4 and shadcn UI for styling 📱 Fully responsive and mobile-friendly 🚀 Ready for production deployment on Vercel

📣 My newest course is out! 📣 This time we will be building an original SaaS Platform for video calls and summaries with AI Agents 🤖 Are you ready to make 1M ARR 😁? 🤖 Real-time video calls with AI agents 📞 Video and chat powered by Stream 🔐 Authentication handled by Better Auth 💳 Subscription payments via Polar 🧠 AI summaries and context chat using OpenAI ⚙️ Background jobs powered by Inngest 🧑‍💻 Code reviews with CodeRabbit 🗄️ Scalable Postgres database via Neon Postgres 🌐 Built with Next.js 15 and React 19 🎨 Tailwind CSS v4 and shadcn UI for styling 📱 Fully responsive and mobile-friendly 🚀 Ready for production deployment on Vercel

Code With Antonio

31,277 просмотров • 1 год назад

🔊 Introducing Resonance, a full-stack AI voice platform like ElevenLabs No, this isn't my SaaS announcement, it's a completely free, open source tutorial 😎 🎤 Clone voices from audio samples or record your own 🎙️ Self-host an AI voice model with Modal 📦 Store audio with Cloudflare R2 🔐 Authentication & multi-tenant orgs with Clerk 🗄️ PostgreSQL database with Prisma ORM 💳 Pay-as-you-go billing with Polar 🪲 Each pull request reviewed with CodeRabbit 🚀 Learn to deploy on Railway 📊 Monitor errors and logs with Sentry 🎨 shadcn UI + Tailwind CSS v4

🔊 Introducing Resonance, a full-stack AI voice platform like ElevenLabs No, this isn't my SaaS announcement, it's a completely free, open source tutorial 😎 🎤 Clone voices from audio samples or record your own 🎙️ Self-host an AI voice model with Modal 📦 Store audio with Cloudflare R2 🔐 Authentication & multi-tenant orgs with Clerk 🗄️ PostgreSQL database with Prisma ORM 💳 Pay-as-you-go billing with Polar 🪲 Each pull request reviewed with CodeRabbit 🚀 Learn to deploy on Railway 📊 Monitor errors and logs with Sentry 🎨 shadcn UI + Tailwind CSS v4

Code With Antonio

95,100 просмотров • 4 месяцев назад

Tested DeepSeek V4 Flash on ZenMux today Tried a more practical approach instead of just chatting. → Asked it to build a SaaS landing page → Generated full HTML, CSS, JS → Ran the code → got a working UI It handled layout, components, and styling pretty smoothly. Iteration was simple too — just refine the prompt and improve the output. Also liked how easy it is to switch between models in the same place and test things side by side without changing setups. What stood out is how quickly you can go from idea → working frontend without jumping between tools. From a cost perspective, this kind of output is more than enough for a lot of routine dev tasks. Feels less like a “Claude killer” More like a “Claude bill killer.” If you want to try it yourself, I’ve added the link below 👇 Try it here: ZenMux

Tested DeepSeek V4 Flash on ZenMux today Tried a more practical approach instead of just chatting. → Asked it to build a SaaS landing page → Generated full HTML, CSS, JS → Ran the code → got a working UI It handled layout, components, and styling pretty smoothly. Iteration was simple too — just refine the prompt and improve the output. Also liked how easy it is to switch between models in the same place and test things side by side without changing setups. What stood out is how quickly you can go from idea → working frontend without jumping between tools. From a cost perspective, this kind of output is more than enough for a lot of routine dev tasks. Feels less like a “Claude killer” More like a “Claude bill killer.” If you want to try it yourself, I’ve added the link below 👇 Try it here: ZenMux

Shruti Codes

69,532 просмотров • 2 месяцев назад

Imagine being able to copy any website’s design in seconds 👀 Someone gave Claude Code this superpower: → Built an MCP that reads a site’s HTML/CSS → Pulls out the colors, fonts, layouts, and components → Recreates the UI so you can remix it Find a design you like. Grab the structure. Add your own style. Building clean UIs just got way easier 🚀 Follow Bethany Hyde for more AI & coding tips ⚡

Imagine being able to copy any website’s design in seconds 👀 Someone gave Claude Code this superpower: → Built an MCP that reads a site’s HTML/CSS → Pulls out the colors, fonts, layouts, and components → Recreates the UI so you can remix it Find a design you like. Grab the structure. Add your own style. Building clean UIs just got way easier 🚀 Follow Bethany Hyde for more AI & coding tips ⚡

Bethany Hyde

209,583 просмотров • 25 дней назад

I made this in 2 hours 🤯 Been playing with v0 and Cursor last night just to see how fast we can make an app. So i made something for people doing house listings 🏠 ◆ Add photos 📸 ◆ Generate descriptions of the photo 💭 ◆ Add appraisal report 📃 ◆ Generate the description of the property 📝 For the AI i used Langbase. Fast to setup, and you can try different models fast 🔥 And of course, the components as always, from shadcn Btw, code is going to be Open-Source. Vercel NextAuth.js Prisma Postgres shadcn Neon Postgres Resend Tailwind CSS v0 #opensource #buildinpublic #proptech

I made this in 2 hours 🤯 Been playing with v0 and Cursor last night just to see how fast we can make an app. So i made something for people doing house listings 🏠 ◆ Add photos 📸 ◆ Generate descriptions of the photo 💭 ◆ Add appraisal report 📃 ◆ Generate the description of the property 📝 For the AI i used Langbase. Fast to setup, and you can try different models fast 🔥 And of course, the components as always, from shadcn Btw, code is going to be Open-Source. Vercel NextAuth.js Prisma Postgres shadcn Neon Postgres Resend Tailwind CSS v0 #opensource #buildinpublic #proptech

CodeHagen

177,326 просмотров • 1 год назад