|
|
# Coze Studio Frontend
|
|
|
|
|
|
This is the frontend project of Coze Studio, an AI Agent development platform built with monorepo architecture, based on React 18 and modern frontend technology stack.
|
|
|
|
|
|
## 🏗️ Project Architecture
|
|
|
|
|
|
### Core Technology Stack
|
|
|
- **Framework**: React 18 + TypeScript
|
|
|
- **Build Tool**: Rsbuild
|
|
|
- **Package Manager**: Rush + PNPM
|
|
|
- **Routing**: React Router v6
|
|
|
- **State Management**: Zustand
|
|
|
- **UI Components**: @coze-arch/coze-design
|
|
|
- **Internationalization**: @coze-arch/i18n
|
|
|
|
|
|
### Directory Structure
|
|
|
|
|
|
```
|
|
|
frontend/
|
|
|
├── apps/ # Application layer
|
|
|
│ └── coze-studio/ # Main application
|
|
|
├── packages/ # Core packages
|
|
|
│ ├── agent-ide/ # AI Agent development environment
|
|
|
│ ├── arch/ # Architecture infrastructure
|
|
|
│ ├── common/ # Common components and utilities
|
|
|
│ ├── components/ # UI component library
|
|
|
│ ├── data/ # Data layer
|
|
|
│ ├── devops/ # DevOps tools
|
|
|
│ ├── foundation/ # Foundation infrastructure
|
|
|
│ ├── project-ide/ # Project development environment
|
|
|
│ ├── studio/ # Studio core features
|
|
|
│ └── workflow/ # Workflow engine
|
|
|
├── config/ # Configuration files
|
|
|
│ ├── eslint-config/ # ESLint configuration
|
|
|
│ ├── rsbuild-config/ # Rsbuild build configuration
|
|
|
│ ├── ts-config/ # TypeScript configuration
|
|
|
│ ├── postcss-config/ # PostCSS configuration
|
|
|
│ ├── stylelint-config/ # Stylelint configuration
|
|
|
│ ├── tailwind-config/ # Tailwind CSS configuration
|
|
|
│ └── vitest-config/ # Vitest testing configuration
|
|
|
└── infra/ # Infrastructure tools
|
|
|
├── idl/ # Interface Definition Language tools
|
|
|
├── plugins/ # Build plugins
|
|
|
└── utils/ # Utility libraries
|
|
|
```
|
|
|
|
|
|
## 🚀 Quick Start
|
|
|
|
|
|
### Prerequisites
|
|
|
- Node.js >= 21
|
|
|
- PNPM 8.15.8
|
|
|
- Rush 5.147.1
|
|
|
|
|
|
### Install Dependencies
|
|
|
```bash
|
|
|
# Run in project root directory
|
|
|
rush install
|
|
|
# update
|
|
|
rush update
|
|
|
```
|
|
|
|
|
|
### Development Mode
|
|
|
```bash
|
|
|
# Start development server
|
|
|
cd apps/coze-studio
|
|
|
npm run dev
|
|
|
# or use rushx
|
|
|
rushx dev
|
|
|
```
|
|
|
|
|
|
### Production Build
|
|
|
```bash
|
|
|
# Build application
|
|
|
cd apps/coze-studio
|
|
|
npm run build
|
|
|
# or use rushx
|
|
|
rushx build
|
|
|
```
|
|
|
|
|
|
## 📦 Core Modules
|
|
|
|
|
|
### Agent IDE
|
|
|
- **agent-ide**: AI Agent integrated development environment
|
|
|
- **prompt**: Prompt editor
|
|
|
- **tool**: Tool configuration management
|
|
|
- **workflow**: Workflow integration
|
|
|
|
|
|
### Architecture Layer (arch)
|
|
|
- **bot-api**: API interface layer
|
|
|
- **bot-hooks**: React Hooks library
|
|
|
- **foundation-sdk**: Foundation SDK
|
|
|
- **i18n**: Internationalization support
|
|
|
- **bot-flags**: Feature flags management
|
|
|
- **web-context**: Web context utilities
|
|
|
|
|
|
### Workflow Engine (workflow)
|
|
|
- **fabric-canvas**: Canvas rendering engine
|
|
|
- **nodes**: Node component library
|
|
|
- **sdk**: Workflow SDK
|
|
|
- **playground**: Debug runtime environment
|
|
|
|
|
|
### Data Layer (data)
|
|
|
- **knowledge**: Knowledge base management
|
|
|
- **memory**: Memory system
|
|
|
- **common**: Common data processing
|
|
|
|
|
|
## 🔧 Development Standards
|
|
|
|
|
|
### Code Quality
|
|
|
- Code formatting with ESLint + Prettier
|
|
|
- TypeScript strict mode
|
|
|
- Unit test coverage requirements
|
|
|
- Team-based tier management (level-1 to level-4)
|
|
|
|
|
|
### Team Collaboration
|
|
|
- Rush-based monorepo management
|
|
|
- Workspace dependency management
|
|
|
- Unified build and release process
|
|
|
|
|
|
## 📄 License
|
|
|
|
|
|
Apache License 2.0 |
