Can I render custom React components based on agent actions?

Yes, this skill provides patterns for 'Generative UI' using the useRenderToolCall hook, which allows the agent to trigger specific UI components on the frontend when tools are called.

What is the primary role of Google ADK in this skill?

Google ADK (Agent Development Kit) serves as the backend framework for building agentic workflows, handling tool execution, and managing Gemini model interactions.

Which programming languages are supported?

The skill supports a hybrid architecture: Python (FastAPI) for the ADK backend and TypeScript/JavaScript (Next.js) for the CopilotKit frontend.

How does CopilotKit connect to the Google ADK backend?

CopilotKit connects to the ADK backend via the AG-UI protocol, typically over a WebSocket or FastAPI endpoint, allowing for real-time state sharing and chat interactions.

Does this skill support Model Context Protocol (MCP)?

Yes, it includes patterns for integrating MCP toolsets, allowing your Google ADK agents to use standardized tools from the MCP ecosystem.

Google ADK & CopilotKit Agent Builder

Name: Google ADK & CopilotKit Agent Builder
Author: rwxproject

byrwxproject

0•

数据科学与机器学习

Builds full-stack AI agents by integrating Google ADK backends with CopilotKit-powered React frontends and Gemini models.

This skill streamlines the development of production-ready AI agents by bridging the Google Agent Development Kit (ADK) with CopilotKit's rich UI components. It enables developers to implement complex agentic behaviors using Gemini models, manage shared state between Python backends and Next.js frontends via the AG-UI protocol, and create sophisticated generative UI experiences. Whether you are building multi-tool agents or human-in-the-loop workflows, this skill provides the architecture and implementation patterns needed for a seamless, full-stack agentic application.

主要功能

01Support for Gemini 2.5 and multi-tool agent architectures

02Full-stack integration between Google ADK (Python) and CopilotKit (Next.js)

03Built-in patterns for Model Context Protocol (MCP) tool integration

040 GitHub stars

05Custom Generative UI rendering for real-time tool outputs

06Seamless state synchronization using the AG-UI WebSocket protocol

使用场景

01Building interactive shopping assistants with real-time cart state synchronization

02Developing enterprise workflow agents requiring human-in-the-loop approvals and rich UI feedback

03Creating data dashboards where the AI agent generates custom charts based on tool calls

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add rwxproject/claude-skills google-adk-copilotkit

For use in Claude.ai and ChatGPT

Download Skill