# Open-SEO Dependencies: Complete Tech Stack Guide

> Discover Open-SEO dependencies: a TanStack React architecture with Drizzle ORM, Better-Auth, and AI SDK. Explore the complete tech stack in our guide.

- Repository: [Every App/open-seo](https://github.com/every-app/open-seo)
- Tags: tech-stack-guide
- Published: 2026-07-29

---

**Open-SEO relies on a TanStack-first React architecture with Drizzle ORM, Better-Auth, and the AI SDK, all declared in the repository's [`package.json`](https://github.com/every-app/open-seo/blob/main/package.json).**

Open-SEO is a modern SEO platform developed by every-app that utilizes a comprehensive TypeScript dependency stack. Understanding these open-seo dependencies is crucial for developers contributing to the project or deploying custom instances. All production and development packages are centralized in the root [`package.json`](https://github.com/every-app/open-seo/blob/main/package.json) (specifically lines 73-115), which serves as the single source of truth for the application's technical requirements.

## Core UI and State Management

The frontend architecture centers on **React** and the **TanStack** ecosystem. The application uses `@tanstack/react-router` for routing, `@tanstack/react-query` for server-state management, `@tanstack/react-form` for form handling, and `@tanstack/react-table` for data tables.

In [`src/client/features/domain/hooks/useDomainOverviewQuery.ts`](https://github.com/every-app/open-seo/blob/main/src/client/features/domain/hooks/useDomainOverviewQuery.ts), the implementation demonstrates how `@tanstack/react-query` wraps API calls:

```typescript
import { useQuery } from "@tanstack/react-query";
import { fetchDomainOverview } from "@/client/api";

export function useDomainOverview(domain: string) {
  return useQuery(["domain", domain], () => fetchDomainOverview(domain));
}

```

Similarly, [`src/client/hooks/useSearchHistory.ts`](https://github.com/every-app/open-seo/blob/main/src/client/hooks/useSearchHistory.ts) manages client-side search history using React Query patterns.

## Database and ORM Layer

For data persistence, Open-SEO uses **Drizzle ORM** with support for both SQLite/D1 and PostgreSQL via the `drizzle-orm`, `@pg`, and `postgres` packages. The `dataforseo-client` package handles external SEO data fetching from DataForSEO.

The schema definition in [`src/db/schema.ts`](https://github.com/every-app/open-seo/blob/main/src/db/schema.ts) illustrates the Drizzle implementation:

```typescript
import { integer, text, sqliteTable } from "drizzle-orm/sqlite-core";

export const projects = sqliteTable("projects", {
  id: integer("id").primaryKey(),
  name: text("name").notNull(),
  createdAt: integer("created_at").notNull(),
});

```

## Authentication and Security

User sessions are managed by **Better-Auth**, integrated with `@cloudflare/workers-oauth-provider` and **JOSE** for JWT handling. This setup supports both Cloudflare Access integration and local development modes.

The configuration in [`src/lib/auth.ts`](https://github.com/every-app/open-seo/blob/main/src/lib/auth.ts) initializes the auth provider:

```typescript
import { createAuth } from "better-auth";

export const auth = createAuth({
  adapter: "cloudflare",
  secret: process.env.AUTH_SECRET,
});

```

## AI and LLM Integration

AI-assisted features rely on the **@ai-sdk** ecosystem, including `@ai-sdk/react` for frontend hooks and `@openrouter/ai-sdk-provider` for flexible model provider selection. The `@cloudflare/ai-chat` and `@cloudflare/think` packages enable Cloudflare-specific AI capabilities.

Usage patterns appear throughout AI-driven components:

```typescript
import { useChat } from "@ai-sdk/react";

export function useSeoSummary() {
  const chat = useChat({ model: "gpt-4o-mini" });
  return chat;
}

```

## Styling and UI Components

The interface uses **Tailwind CSS** for utility-first styling, augmented by **DaisyUI** for pre-built components and **Lucide React** for iconography.

## Data Processing Utilities

Open-SEO includes robust parsing capabilities through **Cheerio** (HTML manipulation), **fast-xml-parser** (XML), and **PapaParse** (CSV). Functional programming utilities come from **Remeda**, while **tldts** handles URL parsing and **Zod** provides runtime schema validation.

## Observability and Analytics

Usage tracking is implemented via **PostHog** JavaScript and Node SDKs (`posthog-js`, `posthog-node`). The integration appears in [`src/shared/billing.ts`](https://github.com/every-app/open-seo/blob/main/src/shared/billing.ts), which handles analytics alongside billing logic.

## Testing and Development Tools

The development workflow is supported by **Vitest** for unit testing, **Playwright** for end-to-end testing, and linting tools including **Oxlint** and **Knip** for unused code detection. **Portless** facilitates local development port management.

## Summary

- **Open-SEO** uses a TanStack-first React architecture with `@tanstack/react-query` for data fetching and `@tanstack/react-router` for navigation.
- **Drizzle ORM** abstracts database operations across SQLite/D1 and PostgreSQL, defined in [`src/db/schema.ts`](https://github.com/every-app/open-seo/blob/main/src/db/schema.ts).
- **Better-Auth** provides unified authentication with Cloudflare Workers integration, configured in [`src/lib/auth.ts`](https://github.com/every-app/open-seo/blob/main/src/lib/auth.ts).
- The **@ai-sdk** ecosystem powers AI features with support for OpenRouter and Cloudflare AI providers.
- All dependencies are declared in [`package.json`](https://github.com/every-app/open-seo/blob/main/package.json) lines 73-115, spanning UI, database, auth, AI, and development tools.

## Frequently Asked Questions

### What is the primary UI framework for Open-SEO?

Open-SEO uses **React** with the **TanStack** ecosystem, specifically `@tanstack/react-query` for server state management and `@tanstack/react-router` for routing. This combination provides type-safe, performant UI interactions throughout the application.

### How does Open-SEO interact with databases?

The application uses **Drizzle ORM** to abstract database operations across SQLite/D1 and PostgreSQL backends. Database schemas are defined in [`src/db/schema.ts`](https://github.com/every-app/open-seo/blob/main/src/db/schema.ts), enabling consistent query patterns regardless of the underlying database engine.

### Which authentication method does Open-SEO use?

Open-SEO implements **Better-Auth** with Cloudflare Workers OAuth integration, configured in [`src/lib/auth.ts`](https://github.com/every-app/open-seo/blob/main/src/lib/auth.ts). This setup supports both production Cloudflare Access flows and local development modes using JWT tokens via the **JOSE** library.

### What testing frameworks are included in Open-SEO?

The project includes **Vitest** for unit testing and **Playwright** for end-to-end browser testing. Additional development tools like **Oxlint** and **Knip** ensure code quality by catching linting errors and unused dependencies.