Code Monkey home page Code Monkey logo

online_judge's Introduction

Online_Judge

Design Document: Full Stack Online Judge using MERN Stack

Problem Statement:

Creating a Minimum Viable Product (MVP) for an Online Judge platform using the MERN (MongoDB, Express.js, React.js, Node.js) stack. The platform allows users to participate in coding challenges, submit solutions, and receive automated evaluations.

Overview:

The MVP Online Judge platform enables user registration, problem listing, problem details viewing, code submission, solution evaluation, and leaderboard display. It focuses on simplicity and usability, catering to users with basic coding skills. Mainly the focus would be to first implement a basic system where people can submit code in a selected set of programming languages which the system supports and get scored/evaluated based on it.

Features:

  1. User Registration

    • Users can register by providing basic details such as name, email, and password.
    • Simplified registration process without email verification for faster onboarding.
  2. Problem Listing:

    • The platform displays a curated list of coding problems for users to solve.
    • Each problem is categorized by difficulty level to guide users.
  3. Problem Details Viewing:

    • Users can view detailed descriptions of each problem, including the statement and input/output specifications.
  4. Code Submission:

    • Users can submit their solutions to the provided problems.
    • Solutions can be entered directly into a text editor on the platform.
  5. Solution Evaluation:

    • Submitted solutions are automatically evaluated against predefined test cases.
    • Verdicts (e.g., "Accepted," "Wrong Answer", β€œTLE”) are generated based on evaluation results.
  6. Leaderboard:

    • An optional feature displays a simple leaderboard ranking users based on their solved problems.
    • Users can see their ranking relative to other participants.

Challenges:

  1. Concurrent Requests Handling:

    • To ensure smooth performance during peak usage, asynchronous processing and submission queuing are implemented.
    • Each submission is acknowledged immediately, maintaining fairness and user experience.
  2. Security and Code Execution Efficiency:

    • Containerization using Docker isolates code execution environments, enhancing security and efficiency.
    • Resource limits and time constraints prevent abuse and ensure timely evaluations.

High-Level Design:

1. Database Design:

  • MongoDB is used for data storage with collections for users, problems, test cases, and solutions.
  • Document structures are simple and intuitive, focusing on essential fields for MVP functionality.

Collections:

  • Users
    • userId: String (Unique identifier for each user)
    • password: String (Hashed password for user authentication)
    • email: String (User's email address)
    • fullName: String (User's full name)
    • dob: Date (User's date of birth)
  • Problems
    • problemId: String (Unique identifier for each problem)
    • name: String (Name/title of the problem)
    • statement: String (Description/statement of the problem)
    • code: String (Code snippet or template for the problem, if applicable)
    • difficulty: String (Optional field indicating the difficulty level of the problem)
  • Test Cases
    • testCaseId: String (Unique identifier for each test case)
    • problemId: String (Foreign key referencing the associated problem)
    • input: String (Input data for the test case)
    • output: String (Expected output for the given input)
  • Submissions
    • submissionId: String (Unique identifier for each solution)
    • problemId: String (Foreign key referencing the associated problem)
    • userId: String (Foreign key referencing the user who submitted the solution)
    • verdict: String (Verdict/result of the solution evaluation, e.g., "Accepted," "Wrong Answer")
    • submittedAt: Date (Timestamp indicating when the solution was submitted)

2. Web Server Design:

  • Express.js handles API endpoints for user management, problem listing, submission handling, and leaderboard display at the backend.
  • Using JWT Tokens for authentication and later down the line using OAuth directly.
  • React.js frontend provides a simple user interface with screens for:
    • Problem listing
    • Problem details viewing
    • Code submission.
  • Using UI Library like Chakra UI for components to be minimalistic and user-friendly, facilitating easy navigation and interaction.

3. Code Evaluation System:

  • Scores will be evaluated for each submission upon which the ranking would be calculated with a simple table sorted by the scores, submittedAt time and other factors.
  • Docker to be used for isolation of compilation of each submission
  • Docker containers are employed to isolate code execution environments.
  • Pre-configured containers for popular programming languages ensure compatibility and efficiency.
  • Time limits and resource constraints prevent excessive resource consumption and execution delays.

Future Work:

  • Caching & Plagiarism Checking

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.