A Next.js application that demonstrates how to build an AI assistant with virtual desktop control capabilities using the Cyberdesk API and Anthropic's Claude AI model.
- Interactive virtual desktop demo with streaming capabilities
- AI assistant chat interface powered by Claude 3.7 Sonnet
- Desktop control via AI (mouse clicks, keyboard input, screenshots)
- Bash command execution in the virtual environment
- Responsive design for both desktop and mobile devices
To get started with this project, first install the npm dependencies:
npm installCreate a .env.local file in the root directory with the following variables:
CYBERDESK_API_KEY=your_cyberdesk_api_key_here
ANTHROPIC_API_KEY=your_anthropic_api_key_here
You'll need to obtain a Cyberdesk API key to use the virtual desktop functionality.
Run the development server:
npm run devOpen http://localhost:3000 in your browser to view the application.
- The application provides an interface to launch a virtual desktop
- Once launched, you can interact with an AI assistant through the chat interface
- The AI can control the virtual desktop, take screenshots, and execute commands
- The virtual desktop stream is displayed in real-time
/src/app- Next.js app router pages and API routes/src/components- React components including the chat interface and desktop viewer/src/utils- Utility functions for interacting with the Cyberdesk API/src/lib- Shared libraries and helpers/src/styles- Global CSS and styling utilities
- Next.js - React framework for the frontend
- Cyberdesk - Virtual desktop infrastructure
- Assistant UI React - UI components for the chat interface
- AI SDK - Tools for working with AI models
- Anthropic Claude - AI model for the assistant
- Tailwind CSS - Utility-first CSS framework
This project is licensed under the MIT License - see the LICENSE file for details.
To learn more about the technologies used in this project, see the following resources: