shubh-vedi

React Agno AI App — AI skill for Claude Code

AI community

⚡ Full-stack AI chat app with Agno Agent Skills, Claude Sonnet 4.6 via OpenRouter, Tavily web search, and Neubrutalism UI.

How to install React Agno AI App

This entry records only its repository, not the path inside it, so there is no exact command to give. Open shubh-vedi/react-agno-ai-app and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What React Agno AI App does

⚡ Full-stack AI chat app with Agno Agent Skills, Claude Sonnet 4.6 via OpenRouter, Tavily web search, and Neubrutalism UI.

Alternatives in AI

Artifacts Builder — Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web tech 97.5k ★
Chat Ollama — ChatOllama is an open source agentic app for running AI agents across local and hosted models 3.5k ★
Claude Skill Web Clone — Methodology for faithfully cloning any website (static / React / WebGL) — without copying AI-hallucinated code 969 ★

README

⚡ Agno AI — Full-Stack AI Chat App

A full-stack AI chat application built with **Agno Agent Skills**, **Claude Sonnet 4.6** via OpenRouter, and **Tavily** for real-time web search. Features a bold **Neubrutalism** UI design.

![Agno AI Home](assets/screenshot-home.png)

✨ Features

🤖 Agno Agent Skills — Modular, hot-reloadable AI skills framework
🧠 Claude Sonnet 4.6 — Anthropic's latest model via OpenRouter
🔍 Tavily Web Search — Real-time web search powered by Tavily
📡 Streaming Responses — Real-time token-by-token SSE streaming
🎨 Neubrutalism UI — Bold borders, hard shadows, colorful cards
⚡ One-Command Startup — Run everything with ./start.sh
💬 Markdown Rendering — Code blocks, bold, lists, tables in chat
🔄 New Chat — Clear conversations with one click

🛠️ Tech Stack

Layer	Technology
AI Framework	Agno (Skills + Agents)
LLM	Claude Sonnet 4.6 via OpenRouter
Web Search	Tavily
Backend	FastAPI + Uvicorn
Frontend	React 19 + Vite
Styling	Vanilla CSS (Neubrutalism)
Streaming	Server-Sent Events (SSE)

📁 Project Structure

react-agno-ai-app/
├── backend/
│   ├── main.py              # FastAPI server with SSE streaming
│   ├── agents.py            # Agno agent with Claude Sonnet 4.6
│   ├── skills/              # Modular AI skill directories
│   │   └── sample-skill/
│   │       └── SKILL.md     # Skill definition file
│   ├── requirements.txt     # Python dependencies
│   ├── .env                 # API keys (create from .env.example)
│   └── .env.example         # Environment template
├── frontend/
│   ├── src/
│   │   ├── App.jsx          # Main app with sidebar + chat layout
│   │   ├── App.css          # Neubrutalism design system
│   │   ├── index.css        # Base reset styles
│   │   └── components/
│