System architecture

Fataplus is built on a modern, edge-first architecture using Cloudflare’s infrastructure for global performance and scalability.

Architecture overview

The platform consists of three main layers:

Tech stack

Frontend layer

The frontend is built with modern web technologies optimized for performance:

Astro 5.15+ - Static site generator with partial hydration
React - Interactive UI components with client-side hydration
Tailwind CSS - Utility-first CSS framework
Cloudflare Pages - Global CDN deployment with edge rendering

Astro’s partial hydration strategy ensures only interactive components load JavaScript, keeping the CRM fast and lightweight.

Backend layer

The backend runs entirely on Cloudflare’s edge network:

bknd 0.19.0 - Full-stack framework for Cloudflare Workers
Cloudflare Workers - Serverless edge compute platform
Cloudflare D1 - Distributed SQL database at the edge
Hono - Ultrafast web framework (used internally by bknd)
TypeScript - Type-safe development

AI integration

Intelligent features powered by Claude AI:

Claude Code API - For code analysis and generation
Custom AI models - Trained on AgriTech domain knowledge
Cloudflare Workers AI - Edge inference for low-latency responses

Design system

Figma API - Real-time design file synchronization
Cloudflare R2 - Object storage for design assets
Design tokens - Shared styling system across tenants

Multi-tenant architecture

Fataplus uses a subdomain-based multi-tenant model for client isolation:

Tenant isolation

Each tenant (client project) gets:

Dedicated subdomain: [tenant-name].fata.plus
Isolated data: Database-level tenant separation
Custom branding: Tenant-specific design system
Access control: OAuth2-based authentication per tenant

Tenant data is strictly isolated in the database layer. Cross-tenant queries are prevented by row-level security policies.

Domain structure

The platform uses multiple domains for different purposes:

Primary domains

Domain	Purpose	Infrastructure
`fata.plus`	Marketing website + CRM	Cloudflare Pages
`bknd.fata.plus`	Backend API	Cloudflare Workers
`*.fata.plus`	Tenant subdomains	Cloudflare Pages (dynamic routing)

Routing configuration

# DNS Configuration (Cloudflare)
fata.plus          -> CNAME proxy.cloudflare.com
*.fata.plus        -> CNAME proxy.cloudflare.com
bknd.fata.plus     -> Cloudflare Workers route

URL structure

# Marketing and main CRM
fata.plus/              # Marketing homepage
fata.plus/crm           # CRM dashboard
fata.plus/bootcamp      # UX/UI training platform

# Multi-tenant access
[tenant].fata.plus      # Client-specific CRM instance

# Backend API
bknd.fata.plus/api/*    # RESTful API endpoints
bknd.fata.plus/admin    # Admin panel (bknd UI)
bknd.fata.plus/ws/*     # WebSocket connections

Data architecture

Database schema

The platform uses Cloudflare D1 (SQLite at the edge) with the following structure:

-- Tenant isolation
CREATE TABLE tenants (
  id TEXT PRIMARY KEY,
  name TEXT NOT NULL,
  subdomain TEXT UNIQUE NOT NULL,
  created_at DATETIME DEFAULT CURRENT_TIMESTAMP
);

-- Multi-tenant data with foreign key isolation
CREATE TABLE projects (
  id TEXT PRIMARY KEY,
  tenant_id TEXT NOT NULL,
  name TEXT NOT NULL,
  FOREIGN KEY (tenant_id) REFERENCES tenants(id)
);

CREATE TABLE clients (
  id TEXT PRIMARY KEY,
  tenant_id TEXT NOT NULL,
  name TEXT NOT NULL,
  FOREIGN KEY (tenant_id) REFERENCES tenants(id)
);

The bknd framework automatically manages migrations and provides a visual admin interface at /admin for database management.

Data storage

D1 Database: Structured data (clients, projects, users)
R2 Bucket: Media and design assets
KV Store: Session management and caching
Durable Objects: Real-time collaboration features

API architecture

The backend API is built with the bknd framework running on Cloudflare Workers:

Core configuration

// backend-integration/fataplus-bknd-backend/src/index.ts
import { serve } from "bknd/adapter/cloudflare";

const config = {
  d1: {
    session: true,  // Enable session management
  },
  auth: true,       // Enable authentication
  ui: {
    enabled: true,
    path: "/admin",  // Admin panel path
  },
  cors: {
    origins: [
      "http://localhost:3000",
      "https://fata.plus",
      "https://www.fata.plus"
    ],
    credentials: true,
  },
};

const app = serve(config);
export default app;

API endpoints

The bknd framework provides automatic CRUD endpoints:

# Entity operations (auto-generated)
GET    /api/data/projects          # List all projects
POST   /api/data/projects          # Create project
GET    /api/data/projects/:id      # Get project
PUT    /api/data/projects/:id      # Update project
DELETE /api/data/projects/:id      # Delete project

# Authentication
POST   /api/auth/login             # User login
POST   /api/auth/logout            # User logout
GET    /api/auth/me                # Current user

# Admin
GET    /admin                      # Admin UI panel

MCP (Model Context Protocol)

The backend implements MCP for AI agent integration:

// Custom MCP endpoint for AI tools
if (url.pathname === '/api/system/mcp') {
  // Handle MCP initialization
  if (body.method === 'initialize') {
    return new Response(JSON.stringify({
      protocolVersion: "2025-06-18",
      capabilities: {
        tools: {},
        resources: {},
        logging: {}
      },
      serverInfo: {
        name: "bknd",
        version: "0.19.0"
      }
    }));
  }
}

Security architecture

Authentication and authorization

OAuth2 - Standard authentication protocol
Cloudflare Access - Zero Trust network access
Session management - Secure, httpOnly cookies
Row-level security - Tenant isolation at database level

Data protection

CORS policies - Restricted to authorized domains
WAF (Web Application Firewall) - Automatic threat protection
DDoS mitigation - Cloudflare network protection
SSL/TLS - End-to-end encryption

All API requests require authentication. The bknd framework handles token validation and session management automatically.

Performance optimization

Edge computing

Global distribution - Cloudflare’s 300+ data centers
Edge caching - Static assets cached globally
Smart routing - Requests routed to nearest edge location
Zero cold starts - Workers runtime always warm

Frontend optimization

Partial hydration - Only interactive components load JS
Image optimization - Cloudflare Images for automatic optimization
Code splitting - Astro automatically splits bundles
Prefetching - Critical resources preloaded

Metrics

Core Web Vitals - >90 Lighthouse score
TTFB - <200ms (Time to First Byte)
FCP - <1s (First Contentful Paint)
TTI - <3s (Time to Interactive)

Deployment architecture

The platform uses Cloudflare’s infrastructure for deployment:

Frontend deployment

# Build the Astro frontend
npm run build

# Deploy to Cloudflare Pages
npm run deploy:pages

Backend deployment

# Deploy Workers
cd backend-integration/fataplus-bknd-backend
wrangler deploy

Environment configuration

# wrangler.toml
name = "fataplus-crm"
compatibility_date = "2025-11-12"
compatibility_flags = ["nodejs_compat"]

# D1 Database binding
[[d1_databases]]
binding = "DB"
database_name = "fataplus-crm-db"
database_id = "your-database-id"

# R2 Bucket binding
[[r2_buckets]]
binding = "BUCKET"
bucket_name = "fataplus-media"

Monitoring and observability

Analytics

Cloudflare Analytics - Traffic and performance metrics
Web Vitals - Real user monitoring
Custom events - Business metric tracking

Logging

# Enable observability in wrangler.toml
[observability]
enabled = true

Error tracking

Worker exceptions - Automatic error logging
Client-side errors - JavaScript error tracking
API monitoring - Endpoint health checks

Scalability

The architecture is designed to scale automatically:

Horizontal scaling - Workers auto-scale to demand
Database scaling - D1 replicates data globally
Asset delivery - R2 scales storage infinitely
No infrastructure management - Fully serverless

Cloudflare Workers can handle millions of requests per second with no configuration changes. The platform automatically scales based on traffic.

Development workflow

Local development

# Run full stack locally
npm run dev:full

# Frontend only (Astro)
npm run dev

# Backend only (Workers)
npm run dev:backend

Type safety

# Generate TypeScript types from D1 schema
cd backend-integration/fataplus-bknd-backend
npm run typegen

Testing

# Run linter
npm run lint

# Type checking
npm run type-check

# Build verification
npm run build

Next steps

API Reference

Explore API endpoints

Deployment Guide

Deploy to Cloudflare

Multi-Tenant

Multi-tenant architecture

Security

Review security best practices

​System architecture

​Architecture overview

​Tech stack

​Frontend layer

​Backend layer

​AI integration

​Design system

​Multi-tenant architecture

​Tenant isolation

​Domain structure

​Primary domains

​Routing configuration

​URL structure

​Data architecture

​Database schema

​Data storage

​API architecture

​Core configuration

​API endpoints

​MCP (Model Context Protocol)

​Security architecture

​Authentication and authorization

​Data protection

​Performance optimization

​Edge computing

​Frontend optimization

​Metrics

​Deployment architecture

​Frontend deployment

​Backend deployment

​Environment configuration

​Monitoring and observability

​Analytics

​Logging

​Error tracking

​Scalability

​Development workflow

​Local development

​Type safety

​Testing

​Next steps

API Reference

Deployment Guide

Multi-Tenant

Security

System architecture

Architecture overview

Tech stack

Frontend layer

Backend layer

AI integration

Design system

Multi-tenant architecture

Tenant isolation

Domain structure

Primary domains

Routing configuration

URL structure

Data architecture

Database schema

Data storage

API architecture

Core configuration

API endpoints

MCP (Model Context Protocol)

Security architecture

Authentication and authorization

Data protection

Performance optimization

Edge computing

Frontend optimization

Metrics

Deployment architecture

Frontend deployment

Backend deployment

Environment configuration

Monitoring and observability

Analytics

Logging

Error tracking

Scalability

Development workflow

Local development

Type safety

Testing

Next steps