architecture
This document provides a comprehensive overview of the Intelligent IDE architecture, including system design, component interactions, and technical decisions.
The Intelligent IDE follows a modern full-stack architecture designed for scalability, maintainability, and educational collaboration.
┌─────────────────┐ ┌─────────────────┐ ┌─────────────────┐
│ VS Code │ │ Web Browser │ │ Mobile App │
│ Extension │ │ Interface │ │ (Future) │
└─────────┬───────┘ └─────────┬───────┘ └─────────┬───────┘
│ │ │
└──────────────────────┼──────────────────────┘
│
┌─────────────┴─────────────┐
│ API Gateway │
│ (FastAPI Backend) │
└─────────────┬─────────────┘
│
┌──────────────────────┼──────────────────────┐
│ │ │
┌─────┴─────┐ ┌─────┴─────┐ ┌─────┴─────┐
│PostgreSQL │ │ Redis │ │ Docker │
│ Database │ │ Cache │ │ Services │
└───────────┘ └───────────┘ └───────────┘
- Technology: TypeScript, VS Code Extension API
- Purpose: Primary user interface for developers
-
Components:
- Command handlers for user interactions
- Webview providers for custom UI components
- Service layers for backend communication
- Notification and status management
// Extension Architecture
extension.ts // Main entry point
├── commands/ // Command implementations
│ ├── loginCommand.ts // Authentication commands
│ ├── registerCommand.ts
│ └── updateCommand.ts
├── services/ // Backend integration
│ └── userService.ts // API communication
├── utils/ // Helper functions
│ └── responseParser.ts // Data processing
└── resources/ // Configuration
└── configs/
└── config.ts // API endpoints- Technology: Python 3.11+, FastAPI, SQLAlchemy
- Purpose: RESTful API server and business logic
- Design Pattern: Layered architecture with clear separation of concerns
# Backend Structure
intellide/
├── main.py # Application entry point
├── config.py # Configuration management
├── routers/ # API endpoints
│ ├── user.py # User management APIs
│ ├── course.py # Course management APIs
│ ├── course_directory.py # File management APIs
│ ├── course_student.py # Enrollment APIs
│ └── course_chat.py # Chat functionality APIs
├── database/ # Data layer
│ ├── database.py # Database connection
│ ├── model.py # SQLAlchemy models
│ └── startup.py # Database initialization
├── cache/ # Caching layer
│ ├── cache.py # Redis implementation
│ └── startup.py # Cache initialization
├── storage/ # File storage
│ ├── storage.py # File operations
│ └── startup.py # Storage initialization
└── utils/ # Utilities
├── auth.py # Authentication helpers
├── email.py # Email services
└── websocket.py # WebSocket handling- Purpose: Primary data storage for structured data
-
Features:
- ACID compliance for data integrity
- Complex queries for course management
- User relationship management
- Assignment and submission tracking
- Purpose: High-performance caching and session storage
-
Use Cases:
- User session management
- Real-time collaboration state
- Temporary data storage
- Email verification codes
- Purpose: Course materials and user uploads
- Implementation: Local file system with planned cloud storage
-
Features:
- Organized directory structures
- File versioning
- Access control
- Metadata management
The extension uses the Command Pattern to decouple UI actions from business logic:
// Command registration in package.json
"commands": [
{
"command": "intelligent-ide.login",
"title": "Login to Intelligent IDE"
}
]
// Command implementation
export function registerLoginCommand(context: vscode.ExtensionContext) {
const disposable = vscode.commands.registerCommand(
'intelligent-ide.login',
async () => {
// Command logic here
}
);
context.subscriptions.push(disposable);
}Data access is abstracted through repository patterns:
# Database model
class User(Base):
__tablename__ = "users"
id = Column(Integer, primary_key=True)
username = Column(String, unique=True)
email = Column(String, unique=True)
# Service layer
class UserService:
def __init__(self, db: Session):
self.db = db
def create_user(self, user_data: UserCreate) -> User:
# Business logic here
passFastAPI's dependency injection system provides clean separation:
# Dependency provider
def get_db():
db = SessionLocal()
try:
yield db
finally:
db.close()
# Route with injected dependencies
@router.post("/users/")
async def create_user(
user: UserCreate,
db: Session = Depends(get_db)
):
return UserService(db).create_user(user)- User provides credentials through VS Code extension
- Backend validates credentials and generates JWT token
- Token is stored securely in VS Code extension context
- All subsequent API calls include the token in headers
- Backend validates token on each request
- Password Hashing: bcrypt with salt
- JWT Tokens: 24-hour expiration, secure signing
- Input Validation: Pydantic models for request validation
- SQL Injection Prevention: SQLAlchemy ORM usage
- File Access Control: User-based permissions
# WebSocket connection management
class ConnectionManager:
def __init__(self):
self.active_connections: List[WebSocket] = []
async def connect(self, websocket: WebSocket):
await websocket.accept()
self.active_connections.append(websocket)
async def broadcast(self, message: str):
for connection in self.active_connections:
await connection.send_text(message)- Operational Transformation: For conflict resolution
- Real-time Synchronization: WebSocket-based updates
- Cursor Tracking: Live position sharing
- Document State: Centralized state management
- Stateless API: Enables multiple backend instances
- Database Connection Pooling: Efficient resource usage
- Cache Distribution: Redis cluster support
- Load Balancing: Ready for reverse proxy deployment
- Database Indexing: Optimized query performance
- Caching Strategy: Frequently accessed data cached
- Lazy Loading: On-demand resource loading
- Connection Reuse: HTTP connection pooling
# CI/CD Pipeline
Development → Testing → Staging → Production
↓ ↓ ↓ ↓
Unit Tests Integration Load Monitoring
Tests Tests- Development: Local development with Docker
- Testing: Automated testing environment
- Staging: Pre-production testing
- Production: Containerized deployment
- TypeScript: Type safety and better developer experience
- VS Code Extension API: Native integration with developer workflow
- Modern JavaScript: ES6+ features for clean, maintainable code
- FastAPI: High performance, automatic API documentation, type hints
- SQLAlchemy: Mature ORM with excellent PostgreSQL support
- Pydantic: Data validation and serialization
- Redis: High-performance caching and session storage
- PostgreSQL: ACID compliance, complex queries, JSON support
- Redis: In-memory performance for caching and real-time features
- Service Decomposition: Split monolith into focused services
- API Gateway: Centralized routing and authentication
- Service Discovery: Dynamic service location
- Event-Driven Architecture: Async communication between services
- Container Orchestration: Kubernetes deployment
- Cloud Storage: S3-compatible file storage
- Managed Databases: Cloud PostgreSQL and Redis
- CDN Integration: Global content delivery
- API-First Design: Mobile app can use same backend
- Progressive Web App: Web-based mobile interface
- Offline Capabilities: Local data synchronization
This architecture provides a solid foundation for the educational collaboration platform while maintaining flexibility for future enhancements and scaling requirements.
### ProjectOverview.md
```markdown
<!-- filepath: /Users/shimile/projects/team-project-25spring-36.wiki/ProjectOverview.md -->
# Project Overview
The team-project-25spring-36 is designed to create an intelligent IDE for educational purposes with interactive notebooks and collaborative features. This project aims to [describe the purpose and expected outcomes].
## Key Features
- Interactive Jupyter-style notebooks within VS Code
- Real-time collaborative editing capabilities
- Course and assignment management system
## Technologies Used
- Technology 1
- Technology 2
- Technology 3
<!-- filepath: /Users/shimile/projects/team-project-25spring-36.wiki/GettingStarted.md -->
# Getting Started
To get started with the team-project-25spring-36, follow these steps:
1. **Clone the repository**:
```bash
git clone https://github.com/SUSTech-CS304/team-project-25spring-36.git-
Install dependencies:
[installation command]
-
Run the project:
[run command]
- Modern web browser with VS Code
- Understanding of TypeScript and Python
- Basic knowledge of educational technology concepts
### TeamMembers.md
```markdown
<!-- filepath: /Users/shimile/projects/team-project-25spring-36.wiki/TeamMembers.md -->
# Team Members
| Name | Role | Contact Information |
|---------------|--------------------|---------------------|
| Member 1 | Role 1 | contact@intelligent-ide.project |
| Member 2 | Role 2 | contact@intelligent-ide.project |
| Member 3 | Role 3 | contact@intelligent-ide.project |
<!-- filepath: /Users/shimile/projects/team-project-25spring-36.wiki/Documentation.md -->
# Documentation
This section contains detailed documentation for the project, including:
- [API Documentation](APIDocumentation)
- [User Guides](UserGuides)
- [Technical Specifications](TechnicalSpecifications)<!-- filepath: /Users/shimile/projects/team-project-25spring-36.wiki/FAQs.md -->
# Frequently Asked Questions
## Question 1
Answer to question 1.
## Question 2
Answer to question 2.<!-- filepath: /Users/shimile/projects/team-project-25spring-36.wiki/Contact.md -->
# Contact
For any inquiries or issues, please reach out to:
- Project Lead: [Name] - contact@intelligent-ide.project
- Technical Support: [Name] - contact@intelligent-ide.project- Ensure that all links in the markdown files are correctly pointing to the respective files.
- Encourage team members to contribute to the wiki by adding their insights and updates.
- Regularly review and update the content to keep it relevant and useful.
This structure provides a comprehensive starting point for your team wiki, ensuring that all essential information is easily accessible.