CodeJam

Welcome to CodeJam!

CodeJam is your all-in-one playground for writing and running code in multiple programming languages — instantly and effortlessly.

Whether you're experimenting with a new algorithm, testing a quick idea, or building your personal library of code snippets, CodeJam helps you do it all in one sleek and responsive interface.

Screenshots

🧱 Architecture

CodeJam is a collaborative web application designed to streamline coding challenges and team-based problem solving. It is built on a microservices architecture, containerized with Docker and orchestrated via Docker Compose.

Following a DevOps approach, the project integrates continuous integration, automated testing, and deployment pipelines to ensure reliability and scalability. This setup provides a production-like environment from development to release, facilitating collaboration and maintaining consistent code quality.

Docker Services

The application consists of 5 containerized services:

• frontend - React 18 + Vite + TypeScript + Apollo Client
• backend - GraphQL API (Node.js + TypeORM + TypeGraphQL + Apollo Server)
• code-execution - REST API (Express.js) for secure code execution in Docker containers
• db - PostgreSQL 17 database
• nginx - API Gateway and static file server

Layered Software Architecture

✨ Features

🔐 Authentication & User Management

• Guest Mode: Automatic guest user creation for trying the platform without sign-up
• User Registration: Email-based authentication with strong password requirements
  • Password: 12-40 characters, minimum 1 lowercase, 1 uppercase, 1 number, 1 special character
  • Username: 2-32 characters
  • Email validation (max 320 characters)
• Password Security: Argon2 password hashing
• JWT Authentication: Token-based authentication with secure cookie storage (HttpOnly, Secure, SameSite)
• User Roles: Guest, User (authenticated), Admin
• Account Management: Delete account (GDPR-compliant)

💻 Code Editor

• Monaco Editor: Professional code editor with syntax highlighting
• Language Support: JavaScript and TypeScript
• Theme Support: Dark/Light mode toggle with system preference detection
• Editor Themes: GitHub Dark and Dreamweaver options
• Responsive Layout: Resizable panels for flexible workspace
• Keyboard Shortcuts: Standard code editor shortcuts

⚡ Code Execution Engine

• Secure Sandboxing: Docker container-based isolation with Deno runtime (v2.3.1)
• Resource Limits:
  • Memory: 512MB per container
  • CPU: 0.5 cores
  • Process limit: max 100 child processes
  • Network: Disabled
  • Security: No root privileges, no privilege escalation
• Timeout Protection: 5-second execution timeout to prevent infinite loops
• Output Capture: Real-time execution result logging and display
• Error Handling: Comprehensive error reporting with status codes (SUCCESS, ERROR, TIMEOUT)

📝 Snippet Management

• Create Snippets: Name (1-60 characters), code content, and language selection
• Save Snippets: Auto-save functionality for authenticated users
• Edit & Rename: Update code, name, and language with automatic slug generation
• Delete Snippets: Remove snippets with confirmation dialogs
• Share Snippets: Public sharing via unique snippet ID with URL-friendly slugs
• List Management: View all your snippets in the sidebar with search/filter

💳 Subscription System

• Guest
  • 50 executions per day
  • Basic features
• Free Plan
  • 200 executions per day
  • Create unlimited snippets
  • Manage you snippets collection
• Premium Plans (⚠️ comming soon...):
  • Unlimited executions
  • Flexible pricing
  • Live share
  • And much more!
• Subscription Management:
  • Unlimited executions
  • Subscribe to premium plans
  • Unsubscribe with automatic plan downgrade
  • Track subscription status and expiration

🏁 Get Started

Clone the GitHub Project.

Create and setup the .env files located at the root of the project directory.

🏁 Development

Run the application

First make sur the Docker engine (daemon) is running in the background by opening Docker Desktop.

Then, run the following command to start the project in development mode:

docker compose up --build

Finally open a browser and visit the URL: http://localhost:8080

Connect to the application with one of the following user credentials (⚠️ development only!):

• user (free):

  username: codejamer
  email: codejamer@email.com
  password: My-Super-Password-123
  

• user (premium):

  username: codejamer+
  email: codejamer-premium@email.com
  password: My-Super-Premium-Password-123
  

• admin (premium):

  username: admin
  email: admin@email.com
  password: Root_123_codejam
  

Stop the application

To stop the containers, run:

docker compose down

or simply press Ctrl+C for a graceful stop.

Add a new service

See Confluence documentation.

🧪 Testing

Run backend tests

To run backend unit & integration tests:

cd backend
pnpm run test:db

Note: Due to the use of tsx to run TS files in Node and the use of ESM syntax ("type": "module" in package.json ), the option NODE_OPTIONS="$NODE_OPTIONS --experimental-vm-modules" need to be added to the pnpm script to activate ESM support with JEST tests (cf. documentation).

Run frontend tests

To run frontend unit & integration tests:

• in single-run mode:

  cd frontend
  pnpm run test

• in watch mode:

  cd frontend
  pnpm run test:watch

⛁ Database

Reset the database

1. Stop the container (see step #1).

2. Cleanup unused data (stopper containers, unused networks, dangling (not tagged nor referenced) images, unused images, and build cache), unused volumes (execept names ones) skipping confirmation prompts:

docker system prune --volumes -af

3. Then, manually delete the Docker named volume:

docker volume ls
docker volume rm codejam_dbdata

4. Initialize the database from a SQL dump file (see next section).

Populate the database with initial data

1. First, make sure the application is up and running (see Run the application).

2. Initialize the database from a SQL dump file:

cd ./backend
pnpm run seed:db

Migrations

See Confluence documentation.

📦 CI/CD

See Confluence documentation.

🚀 Deploy

VPS Configuration

See Confluence documentation.

Data backup and migration

See Confluence documentation.

Built with 💖 by

• Audrey
• Denis
• Ugo
• Vlad

and with