add-to-existing-project

Detect an existing React project's tech stack and automate Tambo integration and provider wiring.

11.2k|562|Updated Jun 15, 2024
One-click install
npx skills add https://github.com/tambo-ai/tambo --skill add-to-existing-project
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: add-to-existing-project
Source: https://github.com/tambo-ai/tambo/tree/main/plugins/tambo/skills/add-to-existing-project
Command: npx skills add https://github.com/tambo-ai/tambo --skill add-to-existing-project

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Integrates Tambo into existing React projects by automatically detecting the tech stack and adapting installation, so teams can adopt generative UI without starting from scratch or rewriting components.

Core Features & Use Cases

  • Tech-stack detection: Analyzes package.json and project structure to tailor the integration.
  • Provider setup adaptation: Configures TamboProvider to align with existing app patterns.
  • Component registry: Guides registering existing components with the Tambo component registry.

Quick Start

Run the Add-To-Existing-Project flow to detect your setup, install needed dependencies, and wire up the provider and registry with minimal changes. The steps are designed to work with common React configurations like Next.js, Vite, and CRA.

Frequently Asked Questions about add-to-existing-project

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add a generative UI provider to an existing React app?

To add a generative UI provider to an existing React app, the integration process detects your tech stack from package.json and automates dependency installation, provider wiring, and component registration to minimize manual setup.

Can I integrate Tambo into an existing Vite or Next.js project without rewriting components?

Yes, you can integrate Tambo into an existing Vite or Next.js project without rewriting components. The integration detects your specific React stack and adapts the provider configuration to align with your current app patterns.

What is the best way to register existing React components with Tambo?

The best way to register existing React components with Tambo is through the guided component registry setup, which configures your provider and registers your current components during the automated integration process.

Do I need to manually configure the TamboProvider when integrating into a React project?

You do not need to manually configure the TamboProvider when integrating into a React project. The setup automatically analyzes your project structure and generates a provider configuration tailored to your existing app.

Does adding Tambo to a React project require a specific framework?

Adding Tambo to a React project does not require a specific framework. The setup applies across common React stacks including Next.js, Vite, and Create React App by analyzing your package.json to tailor the integration.

Why does the React integration process require analyzing package.json?

The React integration process requires analyzing package.json to perform tech-stack detection, which identifies your specific frameworks and dependencies to accurately tailor provider setup and dependency installation for your project.