AutoGen UI 项目教程

1. 项目目录结构及介绍

AutoGen UI 项目的目录结构如下：

autogen-ui/
├── docs/
│   └── images/
├── frontend/
├── notebooks/
├── .gitignore
├── LICENSE
├── MANIFEST.in
├── README.md
├── package.json
├── pyproject.toml
├── setup.py
└── yarn.lock

目录结构介绍

• docs/: 包含项目文档的图片资源。
• frontend/: 前端代码目录，使用 Next.js 构建。
• notebooks/: 可能包含 Jupyter Notebook 文件，用于数据分析或演示。
• .gitignore: Git 忽略文件，指定哪些文件或目录不需要被 Git 管理。
• LICENSE: 项目的开源许可证文件，本项目使用 MIT 许可证。
• MANIFEST.in: 用于指定在打包时需要包含的非 Python 文件。
• README.md: 项目的介绍文件，包含项目的基本信息和使用说明。
• package.json: 前端项目的依赖管理文件。
• pyproject.toml: Python 项目的配置文件，定义项目的构建系统和依赖。
• setup.py: Python 项目的安装脚本，用于安装项目的依赖和打包项目。
• yarn.lock: 前端项目的依赖锁定文件，确保依赖版本的一致性。

2. 项目启动文件介绍

项目的启动文件主要位于 frontend/ 目录下，使用 Next.js 框架构建。启动项目的前端部分可以通过以下命令：

cd frontend
yarn install
yarn dev

后端部分的启动文件可以通过以下命令：

export OPENAI_API_KEY=<your_key>
autogenui --port 8081

启动后端服务器后，可以通过 http://localhost:8081 访问项目。

3. 项目的配置文件介绍

3.1 pyproject.toml

pyproject.toml 是 Python 项目的配置文件，定义了项目的构建系统和依赖。以下是一个示例：

[build-system]
requires = ["setuptools>=42", "wheel"]
build-backend = "setuptools.build_meta"

[project]
name = "autogenui"
version = "0.1.0"
description = "Web UI for AutoGen"
authors = [
    { name="Victor Dibia", email="[e-mail]" }
]
dependencies = [
    "fastapi",
    "next.js",
    "openai"
]

3.2 setup.py

setup.py 是 Python 项目的安装脚本，用于安装项目的依赖和打包项目。以下是一个示例：

from setuptools import setup, find_packages

setup(
    name="autogenui",
    version="0.1.0",
    description="Web UI for AutoGen",
    author="Victor Dibia",
    author_email="[e-mail]",
    packages=find_packages(),
    install_requires=[
        "fastapi",
        "next.js",
        "openai"
    ],
)

3.3 package.json

package.json 是前端项目的依赖管理文件，定义了项目的前端依赖和脚本。以下是一个示例：

{
  "name": "autogenui",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "next": "latest",
    "react": "latest",
    "react-dom": "latest"
  }
}

通过以上配置文件，可以管理和启动 AutoGen UI 项目的前端和后端部分。