Back to Skills

chatbot-widget-creator

majiayu000
Updated 8 days ago
15 views
58
9
58
View on GitHub
Otheraitesting

About

This skill creates a production-ready ChatGPT-style chatbot widget for frontend integration. It includes critical features like infinite re-render protection, text selection "Ask AI" functionality, and ready integration with RAG backends and SSE streaming. Use it to quickly deploy a battle-tested, monitored chat interface.

Quick Install

Claude Code

Recommended
Primary
npx skills add majiayu000/claude-skill-registry -a claude-code
Plugin CommandAlternative
/plugin add https://github.com/majiayu000/claude-skill-registry
Git CloneAlternative
git clone https://github.com/majiayu000/claude-skill-registry.git ~/.claude/skills/chatbot-widget-creator

Copy and paste this command in Claude Code to install this skill

GitHub Repository

majiayu000/claude-skill-registry
Path: skills/data/chatbot-widget-creator
0

Related Skills

chatbot-widget-creator

Other

This skill generates a production-ready ChatGPT-style chatbot widget with built-in solutions for common frontend issues. It provides infinite re-render protection, text selection "Ask AI" functionality, and integrated support for streaming SSE and RAG backends. Use it to quickly implement a monitored, performant chat interface in your web application.

View skill

react-patterns

Other

This skill provides expert guidance on React 19's latest patterns, including Server Components, Actions, and hooks like `useOptimistic`. Use it for component architecture, state management, and performance optimization when building modern React applications. It proactively assists with implementing concurrent features, Suspense, and TypeScript development.

View skill

react-patterns

Other

This skill provides expert guidance on React 19's latest patterns, including Server Components, Actions, and concurrent features like `useOptimistic` and Suspense. Use it for component architecture, state management, performance optimization, and implementing modern TypeScript development. It's your go-to resource for any React 19 development question or code review.

View skill

typescript-docs

Other

This skill generates comprehensive TypeScript documentation using JSDoc and TypeDoc for API references, architectural decision records (ADRs), and framework-specific examples. Use it to automatically document modules, create multi-layered documentation for different audiences, or set up documentation for projects using NestJS, Express, React, Angular, or Vue.

View skill