CopilotKit / demo-spreadsheet

This is a demo that showcases using CopilotKit to build an Excel like web app.

Run the live demo

Want to see CopilotKit in action? Click the button below to try the live demo.

Deploy with Vercel

To deploy with Vercel, click the button below:

How to Build: A spreadsheet app with an AI-copilot

Learn how to create a powerful spreadsheet app using CopilotKit. This tutorial will guide you through the process step-by-step.

Tutorial: How to Build: A spreadsheet app with an AI-copilot

Getting Started

1. install the needed package:

npm i

2. Set the required environment variables:

copy .env.local.example to .env.local and populate the required environment variables.

⚠️ Important: Not all users have access to the GPT-4 model yet. If you don't have access, you can use GPT-3 by setting OPENAI_MODEL to gpt-3.5-turbo in the .env.local file.

3. Run the app

npm run dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

4. Use the Copilot

TODO add details what to do as a user

Zoom in on the CopilotKit code

1. Look for /api/copilotkit/route.ts and /api/copilotkit/tavily.ts - for the research agent integrated into the spreadsheet

2. Look for useCopilotReadable to see where frontend application context is being made accessible to the Copilot engine

3. Search for updateSpreadsheet, appendToSpreadsheet, and createSpreadsheet to see application interaction hooks made available to agents.

Learn More

To learn more about CopilotKit, take a look at the following resources:

• CopilotKit Documentation - learn about CopilotKit features and API.
• GitHub - Check out the CopilotKit GitHub repository.
• Discord - Join the CopilotKit Discord community.