Tech Architecture of APITable

APITable mainly consist of multi packages to form app services:

web-server: build supercharged, SEO-friendly, and extremely user-facing static website and web application by using NextJS
- UI: provides extremely smooth, user-friendly, super-fast database-spreadsheet interface in <canvas> Rendering Engine
backend-server: handles HTTP requests about nodes, users, organizations, etc. Code under Java Spring Boot Framework
room-server: handles operations(OTJSON) of datasheets, communicates with Socket Server through gRPC, and also provides APIs for developers. Coding under TypeScript and NestJS framework.
nest-server: handles HTTP GET requests about datasheets, records, views, etc.
socket-server: establishes a long connection with clients through the WebSocket protocol, allowing for two-way communication and real-time collaboration, notifications, and other features
init-setting，Responsible for initializing the configuration of core services
init-appdata，Responsible for initializing data, including databases, system-wide images, text, etc.
MySQL: stores persistent data, such as datasheets, records, views, etc.
Redis: stores cache, such as log-in session, hot data, etc.
Minio OSS: stores uploaded files

Here’s different perspective of APITable's architecture.

App Services Architecture

Take a look at the complete architecture of the app's services.

graph TD;
  subgraph "APITable Architecture";
    subgraph "Infrastructure Layer";
      gateway --> backend-server;
      gateway --> room-server;
      room-server --> backend-server;
      gateway --> web-server
    end
    subgraph "Client Layer";
      web-client((Web Client)) --> gateway((Gateway\nNginx));
      iOS-app((iOS App)) --> gateway;
      android-app((Android App)) --> gateway;
    end

  end

Cloud Infrastructure

graph TD;
  subgraph "APITable Infrastructure";
      Client --> gateway
      gateway((Nginx\nGateway)) -->|HTTP| backend-server;
      gateway -->|Web Socket| socket-server;
      gateway -->|HTTP| web-server;
      
      web-server -->|HTTP| backend-server;;
      socket-server -->|Web Socket| room-server;
      backend-server -->|Read/Write| mysql((MySQL));
      backend-server -->|Read/Write| redis((Redis));
      backend-server -->|Read/Write| Minio-OSS((Minio-OSS));
      room-server --> backend-server;
      room-server -->|Read/Write| mysql((MySQL));
      room-server -->|Read/Write| redis((Redis));
      room-server -->|Read/Write| mq((RabbitMQ));
      


  end

Scalable Infrastructure

nest-server: is another mode of room-server. The code base is the same as room-server, but it is responsible for load balancing the getDatapack operations to prevent resource conflicts.

graph LR;
  subgraph "APITable Scalable Infrastructure";
      Client --> gateway
      gateway((Nginx\nGateway)) -->|HTTP| backend-servers;
      gateway -->|HTTP| web-servers;
      gateway -->|HTTP| nest-servers;
      gateway -->|Web Socket| socket-server;

      web-servers --> |HTTP| backend-servers;
      socket-server -->|Web Socket| room-servers;
      
      backend-servers -->|Read/Write| mysql((MySQL));
      backend-servers -->|Read/Write| redis((Redis));
      backend-servers -->|Read/Write| Minio-OSS((Minio-OSS));
      
      nest-servers --> mysql
      
      room-servers --> backend-servers;
      room-servers -->|Read/Write| mysql((MySQL));
      room-servers -->|Read/Write| redis((Redis));
      room-servers -->|Read/Write| mq((RabbitMQ));

      
      subgraph nest-servers;
        nest-server1;
        nest-server2;
      end
      
      subgraph backend-servers;
        backend-server1;
        backend-server2;
      end
      
      subgraph room-servers;
        room-server1;
        room-server2;
        room-server3;
        room-server4;
      end


  end