Core Concepts

Deep dive into Optimus CMS architecture design, core modules, and key concepts.

Six-Layer Architecture Model

Optimus CMS adopts a six-layer architecture, from bottom-level API to top-level applications, with clear responsibilities at each layer.

Layer 6:
Admin Dashboard Sub-Application

Content management, user management, system configuration, data analytics

Layer 5:
AI Generation Sub-Application

Page generation, module generation, component generation, code assistant

Layer 4:
Base Application

Micro-frontend base, SSR, routing management, application communication

Layer 3:
UI Component Library

React components, dynamic content components, business components

Layer 2:
SDK Layer

Storage SDK, Request SDK, Business SDK, Dynamic Content SDK

Layer 1:
API Layer

RESTful API, authentication, business logic, database operations

💡 Why Layered Architecture?

  • • Clear separation of concerns, easy to understand and maintain
  • • Highly scalable, each layer can be scaled independently
  • • Technical flexibility, each layer can use different tech stacks
  • • Improved development efficiency, teams can work in parallel

Core Business Modules

👥Client User System

  • • User registration/login (username, email, phone)
  • • Third-party account binding (WeMade, Steam, Discord)
  • • User profile management
  • • Account security and permissions

🤝Partner System

  • • Multi-level referral system (supports unlimited levels)
  • • Team management (team statistics, hierarchical relationships)
  • • Channel management (referral links, channel data)
  • • Commission settlement and withdrawal

Points Engine

  • • Task configuration (code-based config, version management)
  • • Points calculation (real-time calculation, multiple rules)
  • • Points details (complete task logs)
  • • Points redemption and consumption

📋External Task System

  • • Task configuration (social sharing, content creation, etc.)
  • • Submission review (image upload, link verification)
  • • Points distribution (auto-distribute after approval)
  • • Task statistics and reports

🛒Order System

  • • Product management (dynamic product parameters)
  • • Order processing (payment callbacks, status transitions)
  • • Order queries (multi-dimensional filtering)
  • • Invoice management

📝Content Management

  • • Article management (rich text, version control)
  • • Category and tag management
  • • Scheduled publishing
  • • SEO optimization

Authentication Mechanism

Optimus CMS supports multiple authentication methods to suit different scenarios:

1. ClientUserGuard Authentication (Client Users)

Used for client user authentication, employs a signature mechanism to ensure request security.

// Request headers
client-uid: user_id
client-sign: md5(uid + timestamp + secret_key)
client-timestamp: unix_timestamp

Use Case: All client frontend APIs that require authentication

2. JWT Authentication (Admin Dashboard)

Used for admin dashboard authentication, based on JSON Web Token.

// Request headers
Authorization: Bearer <jwt_token>

Use Case: All admin dashboard APIs, file uploads, etc.

3. Public Access (No Authentication Required)

Some public APIs can be accessed without any authentication.

Use Case: User registration, public article lists, product lists, etc.

Data Flow Process

Understand how a typical API request flows through the system:

1
User Action

User clicks a button or triggers an event in the browser

2
Component Calls SDK

React component calls the corresponding SDK method

3
SDK Processes Request

SDK adds authentication info, processes parameters, sets timeout/retry

4
Send HTTP Request

Send request to API server via Axios

5
API Receives Request

NestJS Controller receives and validates request

6
Business Logic Processing

Service layer handles business logic, data validation

7
Database Operations

Query or update MySQL database via TypeORM

8
Return Response

Data is formatted and returned to client

9
SDK Processes Response

SDK caches data, handles errors, transforms format

10
Update UI

React component updates state and re-renders interface

Event-Driven Architecture

Optimus CMS adopts an event-driven architecture to achieve loose coupling between modules.

// Publish event
eventBus.emit('partner.registered', {
  userId: '123',
  partnerCode: 'LP123456'
});

// Listen to event and handle automatically
@OnEvent('partner.registered')
async handlePartnerRegistered(event) {
  // Automatically award registration bonus points
  await pointsEngine.awardPoints(event);
  // Send welcome email
  await mailService.sendWelcomeEmail(event);
}

Advantages

  • • Module decoupling, reduced dependencies
  • • Easy to extend new features
  • • Complete event logs
  • • Supports asynchronous processing

Common Events

  • • partner.registered
  • • user.login
  • • task.completed
  • • order.created

Technology Stack

Backend

  • Framework: NestJS 10.x
  • ORM: TypeORM 0.3.x
  • Database: MySQL 8.0+
  • Cache: Redis 6.x
  • Storage: MinIO / Aliyun OSS
  • Monitoring: Sentry

Frontend

  • Framework: Next.js 16 / React 19
  • Styling: Tailwind CSS 3.x
  • UI Library: Ant Design 5.x
  • State Management: React Context
  • HTTP: Axios
  • Build: Turbopack

DevOps

  • Containerization: Docker + Docker Compose
  • Reverse Proxy: Caddy
  • Package Manager: pnpm workspace
  • Code Standards: ESLint + Prettier

Testing

  • Unit Testing: Jest
  • E2E Testing: Playwright
  • API Testing: Supertest