ai-app

Solid

Full-stack AI application generator with Next.js, AI SDK, and ai-elements. Use when creating chatbots, agent dashboards, or custom AI applications. Triggers: chatbot, chat app, agent dashboard, AI application, Next.js AI, useChat, streamText, ai-elements, build AI app, create chatbot

AI & Automation 39 stars 14 forks Updated yesterday MIT

Install

Quality Score: 86/100

Stars 20%

53

Recency 20%

100

Frontmatter 20%

70

Documentation 15%

100

Issue Health 10%

80

License 10%

100

Description 5%

100

Skill Content

# AI App Generator Build full-stack AI applications with Next.js, AI SDK, and ai-elements. ## Quick Start ### 1. Scaffold Project ```bash bunx --bun shadcn@latest create --preset "https://ui.shadcn.com/init?base=radix&style=nova&baseColor=neutral&theme=neutral&iconLibrary=lucide&font=geist-sans&menuAccent=subtle&menuColor=default&radius=default" --template next my-ai-app cd my-ai-app ``` ### 2. Install Dependencies ```bash bun add ai @ai-sdk/react @ai-sdk/anthropic zod bunx --bun ai-elements@latest ``` ### 3. Configure Environment ```bash # .env.local - Choose your provider ANTHROPIC_API_KEY=sk-ant-... # OPENAI_API_KEY=sk-... # GOOGLE_GENERATIVE_AI_API_KEY=... ``` ### 4. Generate Application Based on user requirements, generate: - **Chatbot**: See [references/chatbot.md](references/chatbot.md) - **Agent Dashboard**: See [references/agent-dashboard.md](references/agent-dashboard.md) - **Custom**: Combine patterns as needed ## Application Types ### Chatbot Simple conversational AI with streaming responses. | Feature | Implementation | |---------|----------------| | Chat UI | Conversation + Message + PromptInput | | API | streamText + toUIMessageStreamResponse | | Extras | Reasoning, Sources, File attachments | ### Agent Dashboard Multi-agent interface with tool visualization. | Feature | Implementation | |---------|----------------| | Agents | ToolLoopAgent with tools | | UI | Dashboard layout + Tool components | | API | createAgentUIStreamResponse | | Extras |...

Details

Author: laguagu
Repository: laguagu/claude-code-nextjs-skills
Created: 4 months ago
Last Updated: yesterday
Language: TypeScript
License: MIT

Integrates with

OpenAI · AI Anthropic · AI Vercel · Cloud Next.js · Frontend

Similar Skills

Semantically similar based on skill content — not just same category

AI & Automation Solid

ai-elements

Build AI chat interfaces with pre-built shadcn-style components (Message, Conversation, PromptInput, Reasoning, Sources, Tool, Artifact, CodeBlock, Branch, Suggestions, Task, Image, ChainOfThought, InlineCitation, WebPreview, and more). Use when adding AI chat UI to a Next.js + AI SDK app, installing AI Elements components via the CLI (`bun x ai-elements@latest add <name>` or `npx shadcn@latest add @ai-elements/<name>`), composing message displays with markdown, building prompt inputs with attachments, or rendering streaming reasoning and tool output.

39 Updated yesterday

AI & Automation Solid

ai-elements

Build AI chat interfaces using ai-elements components — conversations, messages, tool displays, prompt inputs, and more. Use when the user wants to build a chatbot, AI assistant UI, or any AI-powered chat interface.

396 Updated yesterday

AI & Automation Solid

ai-chat-application

Complete guide to building AI chat applications with Vercel AI SDK. Orchestrates streaming routes, useChat integration, tool architecture, message handling, and UX patterns. Use when building production AI chatbots or assistants. Triggers on build AI chat, create chatbot, AI assistant, Vercel AI SDK app, chat application.

364 Updated today

AI & Automation Listed

nextjs-chatbot

Advanced patterns for production Next.js web chatbots built with AI SDK 6 + ai-elements. Covers tool calling with human-in-the-loop (HITL) approval, PostgreSQL session persistence, GDPR consent gating, SQL-first search, per-tool UI rendering, popup widget embedding, message feedback, follow-up suggestions, scope enforcement, and evals. Use when building a customer support bot, conversational interface, or any web chatbot needing tool approval, database sessions, or custom tool output components. Not a scaffolding tool — use `/ai-app` to scaffold from scratch, `/ai-sdk-6` for general SDK questions, `/ai-elements` for chat UI components, `/vercel:chat-sdk` for multi-platform (Slack/Teams/Discord) bots.

39 Updated yesterday

AI & Automation Listed

ai-elements

Create new AI chat interface components for the ai-elements library following established composable patterns, shadcn/ui integration, and Vercel AI SDK conventions. Use when creating new components in packages/elements/src or when the user asks to add a new component to ai-elements.

335 Updated today