MCPcopy Index your code
hub / github.com/ag2ai/ag2studio

github.com/ag2ai/ag2studio @main

Chat with this repo
repository ↗ · DeepWiki ↗ · + Follow
391 symbols 1,009 edges 52 files 87 documented · 22%
What it actually does AI analysis from the code graph — generated when you open this
loading…
README

AG2 Studio

PyPI version

ARA

AG2 Studio is an AG2-powered AI app (user interface) to help you rapidly prototype AI agents, enhance them with skills, compose them into workflows and interact with them to accomplish tasks. It is built on top of the AG2 framework, which is a toolkit for building AI agents.

Note: AG2 Studio is a sample application to demonstrate an example of end user interfaces built with AG2. It is not meant to be a production-ready app.

Project Structure:

  • ag2studio/ code for the backend classes and web api (FastAPI)
  • frontend/ code for the webui, built with Next.js and TailwindCSS

Installation

The first step is to install Node.js.

Then, there are two ways to install AG2 Studio - from PyPi or from source. We recommend installing from PyPi unless you plan to modify the source code.

  1. Option 1: Install from PyPi

    We recommend using a virtual environment (e.g., conda) to avoid conflicts with existing Python packages. With Python 3.10 or newer active in your virtual environment, use pip to install AG2 Studio:

    bash pip install -U ag2studio

  2. Option 2: Install from Source

    Note: This approach requires some familiarity with building interfaces with Next.js and React.

    If you prefer to install from source, ensure you have Python 3.10+ and Node.js (version above 20) installed. Here's how you get started:

    • Clone the AG2 Studio repository and install its Python dependencies:

    bash pip install -e .

    • Navigate to the frontend directory, install dependencies, and build the UI.

    For MacOS/Linux/Windows:

    bash yarn install

    Then, for MacOS/Linux:

    bash yarn build

    Or, for Windows:

    yarn build-windows

Running the Application

Once installed, run the web UI by entering the following in your terminal:

ag2studio ui --port 8081

This will start the application on the specified port. Open your web browser and go to http://localhost:8081/ to begin using AG2 Studio.

First Step

You will need to set your API keys for your models before you can use them.

The default workflows use the gpt-4o-mini model, be sure to set the key and test it under the Models section for that model before running the Default or Travel Planning workflows.

Parameters

AG2 Studio also takes several parameters to customize the application:

  • --host <host> argument to specify the host address. By default, it is set to localhost. Y
  • --appdir <appdir> argument to specify the directory where the app files (e.g., database and generated user files) are stored. By default, it is set to the a .ag2studio directory in the user's home directory.
  • --port <port> argument to specify the port number. By default, it is set to 8080.
  • --reload argument to enable auto-reloading of the server when changes are made to the code. By default, it is set to False.
  • --database-uri argument to specify the database URI. Example values include sqlite:///database.sqlite for SQLite and postgresql+psycopg://user:password@localhost/dbname for PostgreSQL. If this is not specified, the database URIL defaults to a database.sqlite file in the --appdir directory.

Now that you have AG2 Studio installed and running, you are ready to explore its capabilities, including defining and modifying agent workflows, interacting with agents and sessions, and expanding agent skills.

Contribution Guide

We welcome contributions to AG2 Studio. We recommend the following general steps to contribute to the project:

  • Review the overall AG2 project contribution guide
  • Please initiate a discussion on the roadmap issue or a new issue to discuss your proposed contribution.
  • Submit a pull request with your contribution!
  • If you are modifying AG2 Studio, it has its own devcontainer. See instructions in .devcontainer/README.md to use it
  • Please use the tag studio for any issues, questions, and PRs related to Studio

FAQ

Please refer to the AG2 Studio FAQs page for more information.

Acknowledgements

AG2 Studio is Based on the AG2 (Formerly AutoGen) project. It was adapted from a research prototype built in October 2023 (original credits: Gagan Bansal, Adam Fourney, Victor Dibia, Piali Choudhury, Saleema Amershi, Ahmed Awadallah, Chi Wang).

Extension points exported contracts — how you extend this code

CodeProps (Interface)
(no doc)
frontend/src/components/atoms.tsx
IProps (Interface)
(no doc)
frontend/src/components/atoms.tsx
CodeViewProps (Interface)
(no doc)
frontend/src/components/atoms.tsx
ICodeProps (Interface)
(no doc)
frontend/src/components/atoms.tsx
IMessage (Interface)
(no doc)
frontend/src/components/types.ts

Core symbols most depended-on inside this repo

fetchJSON
called by 38
frontend/src/components/utils.ts
truncateText
called by 20
frontend/src/components/utils.ts
getServerUrl
called by 18
frontend/src/components/utils.ts
get
called by 18
ag2studio/database/dbmanager.py
link
called by 18
ag2studio/database/dbmanager.py
onControlChange
called by 13
frontend/src/components/views/builder/utils/agentconfig.tsx
timeAgo
called by 12
frontend/src/components/utils.ts
fetchTargetAgents
called by 9
frontend/src/components/views/builder/utils/selectors.tsx

Shape

Function 278
Method 34
Route 32
Class 28
Interface 19

Languages

TypeScript59%
Python41%

Modules by API surface

ag2studio/web/app.py71 symbols
frontend/src/components/atoms.tsx34 symbols
frontend/src/components/views/builder/utils/selectors.tsx33 symbols
frontend/src/components/utils.ts28 symbols
ag2studio/datamodel.py20 symbols
ag2studio/utils/utils.py17 symbols
ag2studio/workflowmanager.py15 symbols
frontend/src/components/views/playground/chatbox.tsx13 symbols
frontend/src/components/types.ts12 symbols
ag2studio/chatmanager.py12 symbols
ag2studio/database/dbmanager.py11 symbols
frontend/src/components/views/builder/workflow.tsx10 symbols

For agents

$ claude mcp add ag2studio \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact