OpenSEO Tech Stack Explained: Cloudflare Workers, React 19, and Drizzle ORM Architecture

OpenSEO is a full-stack TypeScript SEO platform built on Cloudflare Workers with React 19, Drizzle ORM, and TanStack Server Functions, designed for edge deployment and AI agent integration.

This open-source SEO tool from every-app/open-seo combines a serverless edge runtime with a modern React frontend to deliver keyword research, rank tracking, and site audits. The architecture prioritizes type safety, dual-database portability, and extensibility through Model-Context-Protocol (MCP) endpoints that AI agents can consume.

Runtime and Hosting: Cloudflare Workers Edge Platform

The OpenSEO tech stack centers on Cloudflare Workers as its execution environment. The core MCP API is deployed as a serverless worker, enabling global edge distribution without managed server infrastructure.

In package.json, the Cloudflare dependency is pinned at "cloudflare": "^5.2.0" alongside wrangler for deployment management. The worker entry point lives at src/start.ts, which initializes the TanStack Server Functions layer and routes incoming requests through the generated route tree.

This edge-first approach eliminates cold starts for SEO data queries and places compute close to users worldwide. For teams preferring containerized deployments, OpenSEO also supports Docker self-hosting with the same codebase.

Database Layer: Drizzle ORM with Dual Dialect Support

Drizzle ORM provides the data persistence abstraction, configured for both Cloudflare D1 (SQLite) and PostgreSQL backends.

The package.json specifies "drizzle-orm": "^0.45.2" with companion tooling via drizzle-kit. Schema definitions in src/db/schema.ts use Drizzle's type-safe table builders:

import { sqliteTable, integer, text } from 'drizzle-orm/sqlite-core';

export const projects = sqliteTable('projects', {
  id: integer('id').primaryKey({ autoIncrement: true }),
  name: text('name').notNull(),
  domain: text('domain'),
  createdAt: integer('created_at', { mode: 'timestamp' }).notNull(),
});

Migration configurations split by dialect: drizzle.config.ts targets D1/SQLite for development, while drizzle-pg.config.ts handles production PostgreSQL. This dual-dialect design lets developers run locally with zero external database dependencies, then scale to managed Postgres without code changes.

Backend Framework: TanStack Server Functions

The OpenSEO tech stack replaces traditional backend frameworks with TanStack Server Functions (@tanstack/react-start at ^1.168.26).

This architecture colocates API logic with frontend routes, compiling server functions to Cloudflare Worker handlers. Key responsibilities include:

• Routing: src/routeTree.gen.ts contains the generated type-safe route tree
• Middleware: src/middleware/ensureUser.ts validates Cloudflare Access headers or local API keys
• Request parsing: Zod-validated DTOs enforce contracts between client and worker

The server function pattern eliminates API endpoint boilerplate—business logic written in route files automatically becomes callable HTTP endpoints.

Frontend Stack: React 19, Tailwind CSS 4, and DaisyUI

The OpenSEO UI layer consists of three tightly integrated technologies:

Technology	Version	Role
React 19	^19.0.0	Core component runtime with concurrent features
Tailwind CSS 4	^4.1.16	Utility-first styling engine
DaisyUI	^5.5.5	Pre-built component themes and design tokens

This combination delivers a component-driven interface without custom CSS maintenance. The Tailwind 4 upgrade provides performance improvements in build times and CSS output size compared to version 3.

Data Management: TanStack Query and Router

State management in OpenSEO relies entirely on TanStack Query 5 (^5.101.2) for server-state synchronization and TanStack Router 1 (^1.170.16) for client-side navigation.

TanStack Query handles:

• Background refetching of SEO data
• Stale-while-revalidate caching strategies
• Optimistic updates for user actions

TanStack Router provides:

• Type-safe URL parameters and search query handling
• Route-level data loading
• Deep-linking support for filtered views

TanStack React Form (^1.33.0) rounds out the data layer with declarative form handling for keyword inputs, project configurations, and filter controls.

AI Integration: MCP Server and SDK Providers

A distinguishing feature of the OpenSEO tech stack is native AI agent integration through the Model-Context-Protocol (MCP).

Relevant packages in package.json:

• @ai-sdk/react (^3.0.211) for streaming AI responses in the UI
• @openrouter/ai-sdk-provider (^2.9.0) for multi-model LLM access
• Cloudflare AI Chat bindings for edge inference

The MCP server exposes reusable "skills" that external agents like Claude Code, OpenClaw, and Hermes can invoke. This transforms OpenSEO from a standalone application into an orchestrable component within larger AI workflows.

SEO Data Sources and Authentication

DataForSEO client (dataforseo-client at ^2.0.19) provides the underlying data for keyword research, SERP tracking, backlinks analysis, and site audits. The client abstracts DataForSEO's REST API into typed methods callable from server functions.

For access control, Better-Auth (@better-auth/api-key at 1.6.22) implements API-key authentication. This lightweight approach suits self-hosted deployments where OAuth complexity is undesirable—clients pass keys via headers, validated in src/middleware/ensureUser.ts.

Build Tooling: TypeScript 5.9 and Vite 7

The entire OpenSEO codebase compiles with TypeScript 5.9 and bundles through Vite 7 (vite.config.ts). Vite handles:

• Worker and client bundle splitting
• Hot module replacement for local development
• Production optimization with tree-shaking

Development scripts in package.json include dialect-specific database commands: db:generate:d1 for SQLite schemas and db:generate:pg for PostgreSQL.

Summary

• OpenSEO runs on Cloudflare Workers with TypeScript throughout the stack
• Drizzle ORM enables dual-database portability across D1/SQLite and PostgreSQL
• TanStack Server Functions replace traditional API frameworks with colocated server logic
• React 19 + Tailwind CSS 4 + DaisyUI power the component-driven UI
• TanStack Query and Router manage data synchronization and navigation
• MCP server architecture allows AI agents to consume SEO capabilities as reusable skills
• DataForSEO integration provides keyword, rank, and backlink data
• Better-Auth API keys secure self-hosted deployments

Frequently Asked Questions

What database does OpenSEO use?

OpenSEO supports both Cloudflare D1 (SQLite) and PostgreSQL through Drizzle ORM's dialect abstraction. The same schema definitions in src/db/schema.ts compile to either backend, letting developers start with D1 for simplicity and migrate to PostgreSQL for production scale.

Can OpenSEO run without Cloudflare?

Yes. While optimized for Cloudflare Workers, the OpenSEO tech stack includes Docker support for self-hosted deployments. The codebase detects runtime environment and adjusts database connections accordingly, making edge-optional rather than edge-required.

How does OpenSEO integrate with AI agents?

OpenSEO exposes an MCP (Model-Context-Protocol) server endpoint that packages SEO functionality as consumable "skills." AI agents authenticate via API keys and invoke these skills through structured requests, receiving JSON responses for keyword data, audits, and rankings that they can incorporate into larger workflows.

What makes OpenSEO different from other SEO tools?

The type-safe, edge-native architecture distinguishes OpenSEO—every layer from database schema to API routes to UI components shares TypeScript definitions. Combined with AI agent programmability via MCP and dual-database flexibility, this creates an extensible platform rather than a closed SaaS product.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}