Core Dependencies for the Kaneo Project: Monorepo Stack Breakdown

Kaneo relies on a TypeScript-first monorepo architecture powered by Hono and Drizzle ORM for the backend, React with TanStack libraries for the frontend, and shared internal packages for cross-cutting concerns like email and permissions.

Kaneo is an open-source project management platform structured as a modern TypeScript monorepo. Examining the core dependencies for Kaneo reveals a carefully curated stack split across three distinct workspaces—root configuration, backend API, and web frontend—designed for maximum type safety and minimal runtime overhead.

Root Workspace Configuration

The monorepo root manages orchestration-level dependencies. In package.json, the primary runtime dependency is dotenv-mono, which loads environment variables from a single .env file shared across all workspaces. This eliminates duplicate configuration files and ensures consistent secrets management between the API and web layers.

Backend API Dependencies

The backend in apps/api/package.json forms the core of Kaneo's server-side architecture using a lightweight, edge-ready stack.

Web Framework and Routing

The API builds on Hono, a minimalist web framework optimized for serverless environments. Key packages include:

• hono – Core framework for routing and middleware
• @hono/node-server – Node.js-specific server implementation
• @hono/node-ws – WebSocket support for real-time features
• @hono/standard-validator – Request validation middleware
• hono-openapi – Decorators for generating OpenAPI specifications from route handlers

Database Layer

Kaneo uses Drizzle ORM for type-safe database operations with PostgreSQL:

• drizzle-orm – TypeScript ORM with SQL-like query syntax
• drizzle-kit – Migration and schema management toolkit
• pg – Native PostgreSQL driver for Node.js

Authentication and Security

User authentication leverages Better Auth with additional API key support:

• better-auth – Modular authentication framework
• @better-auth/api-key – Plugin for API key generation and validation

Validation and Utilities

Incoming data is validated using Valibot (preferred for tree-shaking efficiency) with Zod maintained for compatibility:

• valibot – Lightweight schema validation library
• zod – TypeScript-first schema validation
• @paralleldrive/cuid2 – Collision-resistant ID generation
• ioredis – Redis client used primarily for WebSocket pub/sub messaging

Frontend Web Dependencies

The frontend in apps/web/package.json implements a modern React architecture with compile-time optimized tooling.

Core Framework and Build Tools

• react and react-dom – UI component library
• vite – Development server and production bundler

Styling and UI Primitives

• tailwindcss and @tailwindcss/vite – Utility-first CSS framework with Vite integration
• @radix-ui/* – Unstyled, accessible headless components (accordion, dialog, dropdown menu, etc.)
• sonner – Opinionated toast notification system

State Management and Routing

Data fetching and navigation rely on TanStack libraries:

• @tanstack/react-query – Server-state synchronization and caching
• @tanstack/react-router – Type-safe, file-based routing solution

Content Editing

• @tiptap/react and related extensions – Extensible rich-text editor framework for WYSIWYG content

Validation

• zod – Schema validation shared with the backend to ensure type consistency across the API boundary

Shared Internal Packages

The monorepo includes custom packages consumed by both frontend and backend:

Email System (packages/email)

Wraps nodemailer with React Email components for type-safe transactional email templates. This allows shared JSX-based email rendering between the API (for sending) and development tools.

Permissions (packages/permissions)

Built on top of better-auth, this package provides reusable authorization helpers for checking user roles and access rights across the application.

Implementation Examples

The following examples demonstrate how these dependencies interact in production code.

Backend Route with Validation and Database Access

In apps/api/src/index.ts, Hono routes combine Valibot validation with Drizzle ORM:

import { Hono } from "hono";
import { validator } from "hono-openapi";
import * as v from "valibot";
import { db } from "@/database"; // drizzle-orm instance
import { createId } from "@paralleldrive/cuid2";

const api = new Hono()
  .post(
    "/projects",
    validator("json", v.object({ name: v.string() })),
    async (c) => {
      const { name } = c.req.valid("json");
      const project = await db
        .insert(projectsTable)
        .values({ id: createId(), name })
        .returning()
        .get();
      return c.json(project, 201);
    },
  );

export default api;

This utilizes hono, hono-openapi, valibot, drizzle-orm, and @paralleldrive/cuid2 to handle HTTP routing, OpenAPI documentation, input validation, database persistence, and ID generation.

Frontend Data Fetching

The web layer consumes this API using TanStack Query, as seen in apps/web/src/hooks/queries/useProjects.ts:

import { useQuery } from "@tanstack/react-query";

export function useProjects() {
  return useQuery({
    queryKey: ["projects"],
    queryFn: async () => {
      const res = await fetch(import.meta.env.VITE_API_URL + "/projects");
      if (!res.ok) throw new Error("Failed to load projects");
      return res.json();
    },
  });
}

This pattern leverages @tanstack/react-query for caching and Vite's environment variable system.

Email Integration

Shared email functionality from packages/email/src/index.ts enables consistent transactional messaging:

import { sendEmail } from "@kaneo/email";
import { Welcome } from "./templates/Welcome";

export async function sendWelcome(to: string, name: string) {
  await sendEmail({
    to,
    subject: "Welcome to Kaneo!",
    html: Welcome({ name }), // React-email component
  });
}

Summary

• Backend Stack: Hono framework with Drizzle ORM for PostgreSQL, Better Auth for security, Valibot/Zod for validation, and Redis for pub/sub messaging.
• Frontend Stack: React with Vite bundler, Tailwind CSS for styling, TanStack Query and Router for data and navigation, and Tiptap for rich-text editing.
• Shared Infrastructure: Root-level dotenv-mono for configuration, plus internal @kaneo/email and @kaneo/permissions packages for cross-cutting concerns.
• Type Safety: End-to-end TypeScript with schema validation shared between frontend and backend through Zod.

Frequently Asked Questions

What backend framework does Kaneo use?

Kaneo uses Hono, a lightweight, edge-compatible web framework for Node.js. The specific implementation relies on @hono/node-server for HTTP handling and @hono/node-ws for WebSocket support, providing a minimal overhead alternative to Express or Fastify.

Why does Kaneo use both Valibot and Zod for validation?

Kaneo primarily uses Valibot for backend validation due to its smaller bundle size and tree-shaking capabilities, while maintaining Zod in specific contexts for backward compatibility and shared schema definitions with the frontend. This dual approach optimizes for performance without breaking existing type contracts.

How does Kaneo handle real-time features?

Real-time functionality is implemented through WebSockets using @hono/node-ws on the backend, with Redis (ioredis) serving as the pub/sub broker for horizontal scaling. This architecture allows multiple API instances to broadcast messages to connected clients across a distributed deployment.

What database does Kaneo support?

Kaneo is built specifically for PostgreSQL, utilizing the pg driver alongside Drizzle ORM for type-safe queries and migrations. The schema definitions in apps/api/src/database/schema.ts define table structures using Drizzle's TypeScript API, ensuring compile-time safety for all database operations.

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