Skip to content

Latest commit

 

History

History
284 lines (223 loc) · 8.5 KB

File metadata and controls

284 lines (223 loc) · 8.5 KB

PythonIDE-Clean: Educational Python IDE Platform

A secure, multi-user web-based Python IDE designed for educational institutions Built with Vue3 + Python3.10 + Tornado6.1 + SQLite Supporting 60+ concurrent students with isolated workspaces

🎯 Project Overview

PythonIDE-Clean is a comprehensive web-based Python development environment specifically designed for educational use in colleges and universities. It provides a secure, isolated coding environment where students can write, execute, and submit Python assignments while professors can manage course materials and grade submissions.

✨ Key Features

Core IDE Functionality

  • Multi-file code editor with syntax highlighting and auto-completion
  • Real-time Python code execution with output streaming
  • File management system - Create, read, update, delete files and folders
  • Multiple file type support:
    • Python files (.py) with syntax highlighting
    • Markdown files (.md) with live preview
    • CSV files with built-in viewer
    • Media files (images, PDFs) with preview support
  • Advanced editor features:
    • Find and replace functionality
    • Code tabs for multiple file editing
    • Keyboard shortcuts
    • Customizable settings
    • Word wrap toggle

Security & Multi-User Support

  • User authentication system with secure session management
  • Role-based access control (Students and Professors)
  • Isolated user workspaces - Each student has their own directory
  • File permission system preventing unauthorized access
  • Resource-limited code execution (CPU, memory, timeout limits)
  • SQLite database for user management and file metadata

Educational Features

  • Assignment submission system with unique submission IDs
  • Professor dashboard for viewing all student work
  • Grading interface for professors
  • Lecture notes distribution (read-only for students)
  • Organized directory structure:
    /projects/ide/
    ├── Local/           # Student personal workspaces
    │   ├── sa9082/      # Individual student directory
    │   └── jd1234/      # Another student's directory
    ├── Lecture Notes/   # Professor uploads, student read-only
    ├── Assignments/     # Assignment materials and submissions
    └── Tests/          # Test materials and submissions
    

UI Components

  • Split-pane interface with resizable panels
  • Project tree navigation with VSCode-style icons
  • Interactive console with REPL support
  • Unified console for output management
  • Top menu with common actions
  • Dialogs for file operations, uploads, and settings

🏗️ Architecture

Tech Stack

  • Frontend: Vue 3, Vuex, CodeMirror, Element Plus UI
  • Backend: Python 3.10, Tornado WebSocket Server
  • Database: SQLite for user management and metadata
  • Authentication: bcrypt password hashing, session-based auth
  • File Storage: Local filesystem with permission validation

System Requirements

  • Capacity: Supports 60+ concurrent users
  • Performance: <500ms response time for file operations
  • Security: Directory-based isolation, resource limits
  • Reliability: Transaction-based file operations, automatic cleanup

🚀 Installation & Setup

Prerequisites

  • Node.js 16.13.2+
  • npm 8.1.2+
  • Python 3.10+
  • SQLite 3

Quick Start

1. Clone and Install Dependencies

# Clone the repository
git clone <repository-url>
cd PythonIDE-Clean

# Install frontend dependencies
npm install

# Install backend dependencies
cd server
pip install -r requirements.txt
cd ..

2. Database Setup

# Initialize database schema
cd server
sqlite3 ide.db < migrations/001_initial_schema.sql

# Create initial users
python migrations/create_users.py

# Set up directory structure
python migrations/setup_directories.py
cd ..

3. Run Development Environment

# Terminal 1: Start backend server
cd server
python server.py --port 10086

# Terminal 2: Start frontend development server
npm run serve

# Access the application
# Frontend: http://localhost:8080
# Backend: http://localhost:10086

4. Production Build

# Build frontend for production
npm run build

# The built files will be in the dist/ directory
# Backend will automatically serve these files

# Run production server
cd server
python server.py --port 10086

# Access at: http://localhost:10086

👥 User Management

Default Credentials

  • Professor: username: professor, password: ChangeMeASAP2024!
  • Students: username: {student_id}, password: {student_id}2024

User Roles & Permissions

Role Permissions
Student • Full access to personal workspace (Local/{username}/)
• Read-only access to Lecture Notes
• Submit assignments in designated folders
• Execute Python code with resource limits
Professor • Full access to all directories
• Upload lecture materials
• View all student submissions
• Grade assignments with feedback

📁 Project Structure

PythonIDE-Clean/
├── src/                    # Frontend source code
│   ├── components/         # Vue components
│   │   └── element/
│   │       └── pages/ide/  # IDE components
│   ├── store/             # Vuex state management
│   └── assets/            # Icons, styles, themes
├── server/                # Backend source code
│   ├── auth/             # Authentication system
│   ├── command/          # Command processors
│   ├── handlers/         # WebSocket handlers
│   ├── migrations/       # Database migrations
│   └── projects/ide/     # User file storage
├── dist/                 # Production build output
└── public/               # Static assets

🔒 Security Features

  • Authentication: Session-based with bcrypt password hashing
  • Authorization: Role-based access control (RBAC)
  • File Isolation: Directory-based permissions
  • Path Validation: Prevents directory traversal attacks
  • Resource Limits:
    • Execution timeout: 30 seconds
    • Memory limit: 128MB per execution
    • File size limit: 10MB
  • WebSocket Security: Authenticated connections only

📊 Performance Specifications

Metric Target Current
Concurrent Users 60+ ✅ Supported
File Operation Response <500ms ✅ Achieved
Code Execution Timeout 30s max ✅ Enforced
Memory per Execution 128MB ✅ Limited
WebSocket Connections 100+ ✅ Stable

🧪 Testing

# Run unit tests
python -m pytest tests/

# Run load test (60 concurrent users)
python tests/load_test.py --users 60

# Test authentication flow
python tests/test_auth.py

# Test file permissions
python tests/test_permissions.py

📝 Migration from Single-User

Detailed migration plan available in MIGRATION_PLAN.md. Key phases:

  1. Phase 1: Database & Authentication setup
  2. Phase 2: File system migration
  3. Phase 3: Backend updates for multi-user
  4. Phase 4: Frontend authentication integration
  5. Phase 5: Testing & validation
  6. Phase 6: Production deployment

🔧 Configuration

Environment Variables

# Server configuration
IDE_PORT=10086
IDE_HOST=0.0.0.0
IDE_ENV=production

# Database
DATABASE_PATH=/server/ide.db

# Security
SESSION_TIMEOUT=86400
MAX_FILE_SIZE=10485760
MAX_EXECUTION_TIME=30

🚦 Monitoring & Maintenance

Health Checks

# Check server status
curl http://localhost:10086/health

# View active sessions
sqlite3 server/ide.db "SELECT * FROM sessions WHERE expires_at > datetime('now');"

# Monitor WebSocket connections
python server/monitor.py

Backup & Recovery

# Backup database and files
tar -czf backup_$(date +%Y%m%d).tar.gz server/projects/ide/ server/ide.db

# Restore from backup
tar -xzf backup_20240101.tar.gz

📚 Documentation

  • CLAUDE.md - Detailed project context and requirements
  • MIGRATION_PLAN.md - Step-by-step migration guide
  • P5JS_EDITOR_COMPLETE_ANALYSIS.md - Reference architecture analysis

🤝 Contributing

This project is designed for educational use at colleges. For bug reports or feature requests, please contact the development team.

📄 License

This project is proprietary software for educational institutions. All rights reserved.

👨‍💻 Contact

Project Lead: Sachin Adlakha
Target Deployment: College Internal Server
User Base: 60+ students, 2+ professors
Course: Introductory Python Programming