CodeLearning

Overview

CodeLearning is an e-learning and competitive programming platform that helps learners build programming skills through video-based courses and exercises. It includes an Online Judge for practicing data structures and algorithms, along with ICPC-style programming contests featuring structured rules, real-time rankings, and competitive workflows.

Key Features

Feature	Description
Online Judge & Automated Grading	In-browser code editor supporting C++, Java, Python, and JavaScript. Users write, test, and submit code to receive instant verdicts (Accepted, Wrong Answer, Time Limit Exceeded, etc.) with real-time testcase progress tracking.
Competitive Contests	Hosts ICPC-style programming contests with automated timers, penalty-based scoring, and live leaderboards featuring a freeze phase during the final minutes to maintain competitive suspense.
Interactive Courses & E-Learning	Structured curriculum organized into chapters, video lectures, and quizzes. Hands-on coding exercises are integrated directly alongside lessons with personal learning progress tracking.
Cart, Wallet & Payments	Multi-item shopping cart with voucher discounts, direct bank transfer via VietQR dynamic QR codes, and an internal virtual wallet for balance top-ups and one-click checkout.
Authentication & Role-Based Portals	Supports email/password login and Google Single Sign-On (SSO), providing role-based workflows and permission controls for Students, Instructors, and Administrators.
Automated Notifications & Emails	Sends automated email notifications for account confirmations, course enrollments, payment receipts, and platform announcements.
Automated Testcase Generator	Enables instructors to generate comprehensive test suites automatically using an input generator script and a reference solution.

System Architecture

%%{init: {'flowchart': {'curve': 'linear'}, 'themeVariables': {'clusterBkg': '#161a1d', 'clusterBorder': '#161a1d'}}}%%
flowchart TD
    subgraph ClientTier [" "]
        FE["Frontend"]
    end

    subgraph CoreTier [" "]
        BE["Backend"]
    end

    subgraph ServiceRow [" "]
        direction LR
        PAYOS["PayOS"]
        JUDGE0["Judge0"]
        RABBIT["RabbitMQ"]
    end

    subgraph StorageAndEmailRow [" "]
        direction LR
        DB[("PostgreSQL")]
        SENDGRID["SendGrid"]
    end

    %% Client Communication
    FE <--> |"REST API / WebSocket STOMP"| BE

    %% External & Execution Services
    BE <--> |"Checkout Links / Payment Webhooks"| PAYOS
    BE <--> |"Batch Submissions / Verdict Webhooks"| JUDGE0
    BE ---> |"AMQP Event Publishing"| RABBIT
    RABBIT ---> |"Worker Email Dispatch"| SENDGRID

    %% Data and email delivery
    BE <--> |"JDBC / Transactions & Locks"| DB

Loading

Getting Started

Prerequisites

Ensure the following tools are installed on your environment:

• Docker and Docker Compose (Required for containerized runtime)
• JDK 21 (Required for local backend development)
• Node.js 20+ and npm (Required for local frontend development)

1. Environment Configuration

Backend Configuration (backend/.env):

Create a .env file in the backend/ directory:

# POSTGRES DATABASE
DB_HOST=localhost
DB_PORT=5432
DB_NAME=codelearning
DB_USERNAME=postgres
DB_PASSWORD=your_secure_password

# REDIS CACHE
REDIS_HOST=localhost
REDIS_PORT=6379

# RABBITMQ
RABBITMQ_HOST=localhost
RABBITMQ_PORT=5672
RABBITMQ_USERNAME=guest
RABBITMQ_PASSWORD=guest

# SECURITY & JWT
JWT_SIGNER_KEY=your_super_secret_32_characters_key_here

# CLOUDINARY CONFIGURATION
CLOUDINARY_CLOUD_NAME=your_cloudinary_name
CLOUDINARY_API_KEY=your_cloudinary_key
CLOUDINARY_API_SECRET=your_cloudinary_secret

#PAYOS CONFIGURATION
PAYOS_CLIENT_ID=your_payos_client_id
PAYOS_API_KEY=your_payos_api_key
PAYOS_CHECKSUM_KEY=your_payos_checksum_key

# JUDGE0 SANDBOX (OJ)
JUDGE0_API_URL=http://localhost:2358
JUDGE0_WEBHOOK_URL=http://your-ip-or-domain:8080/codelearning/online-judge/webhooks/submissions (Ngrok)

# SENDGRID CONFIGURATION
SENDGRID_API_KEY=your_sendgrid_api_key
SENDGRID_WEBHOOK_PUBLIC_KEY=your_sendgrid_webhook_public_key
SENDGRID_FROM_EMAIL=your_sendgrid_from_email
SENDGRID_FROM_NAME=your_sendgrid_from_name

Frontend Configuration (frontend/.env):

Create a .env file in the frontend/ directory:

VITE_API_BASE_URL=http://localhost:8080/codelearning
VITE_GOOGLE_CLIENT_ID=your_google_oauth_client_id

2. Running with Docker Compose (Recommended)

Docker Compose is configured with service healthchecks. Infrastructure components (PostgreSQL, Redis, RabbitMQ, and Judge0) start and verify health before launching the Spring Boot backend and React frontend.

Development Environment:

docker compose -f docker-compose.dev.yml --profile backend --profile frontend --profile judge0 up -d

Production Environment:

docker compose -f docker-compose.prod.yml --profile backend --profile frontend --profile judge0 up -d

3. Running Locally

To run the application manually for development or debugging:

Step 1: Start Supporting Infrastructure

docker compose -f docker-compose.dev.yml up -d db redis rabbitmq judge0-server judge0-workers judge0-db judge0-redis

Step 2: Start the Backend

cd backend
./mvnw clean package -DskipTests
./mvnw spring-boot:run

The API will be available at http://localhost:8080/codelearning.

Step 3: Start the Frontend

cd frontend
npm install
npm run dev

The frontend application will be available at http://localhost:5173.