DotFlag

DotFlag is an open-source Capture The Flag (CTF) platform built with React + TypeScript on the frontend and .NET 8 + PostgreSQL on the backend. It provides a complete environment for hosting cybersecurity competitions, including real-time scoreboards, virtual container support, and a full admin panel.

• About
• Features
• Tech Stack
• Architecture & Data Model
• Use Case Diagram
• UML Diagrams
• Platform Screenshots
• Getting Started
• License

DotFlag is designed to be a self-hosted, extensible CTF platform suitable for university-level competitions and cybersecurity training. It follows a layered architecture to keep the codebase decoupled and maintainable.

The project follows a layered architecture with separation of concerns across four layers: Api, BusinessLayer, DataAccessLayer, and Domain.

The system is built around four core entities:

• One User can have many Submissions, one Challenge can have many Submissions
• One Team has many Users (members), a User belongs to at most one Team

The diagram below illustrates the three actor types and their allowed interactions with the platform.

High-level view of the system's layered architecture and external dependencies.

Domain Entities — core data models and their relationships.

Data Access Layer — EF Core context hierarchy and session management.

Challenge Submission Flow — user journey from browsing to solving a challenge.

Admin Panel Flow — admin authentication, role check, and management operations.

User Registration

User Login

Flag Submission

Admin Panel Operations

Docker Container Startup

Page	Preview
Home Page
Dashboard
About
Challenges List
Challenge Overview
Leaderboard
User Profile
Team
Admin — Challenges
Admin — Users
Admin — Docker

• Node.js 20+
• .NET 8 SDK
• PostgreSQL instance

git clone https://github.com/IvanGazul/DotFlag.git
cd DotFlag/frontend
npm install

By default the frontend runs with mock data so you can explore the UI without a backend.

To connect to a real backend, create a .env.local file inside the frontend/ folder (next to package.json). You can copy the provided template and edit it:

# from DotFlag/frontend
cp .env.example .env.local

Then set VITE_USE_MOCK=false in that file:

VITE_USE_MOCK=false

Now start the dev server:

npm run dev

Note: .env.local is git-ignored and will not be committed. Each developer must create their own copy locally.

cd DotFlag/backend

Update the connection string in appsettings.json to point to your PostgreSQL instance:

"ConnectionStrings": {
  "Default": "Host=localhost;Database=dotflag;Username=postgres;Password=yourpassword"
}

Apply migrations and run:

dotnet ef database update
dotnet run

This project is licensed under the MIT License.