Skip to main content

Architecture Overview

SecurAtlas is a GRC (Governance, Risk, and Compliance) platform built as a pnpm monorepo deployed on Vercel with a Supabase backend.

Frontend

Next.js 15 App Router, TypeScript, Tailwind CSS 4, React 19

Backend

Supabase (PostgreSQL 17, Auth, Storage, Edge Functions)

Hosting

Vercel (web app), Supabase (database, functions, storage)

AI

Anthropic Claude for evidence classification and assessment analysis

Monorepo Structure

securatlas/
├── apps/
│   └── web/                  # Next.js 15 application
│       ├── app/              # App Router pages and layouts
│       ├── components/       # React components
│       ├── lib/              # Utilities, Supabase clients, actions
│       └── config/           # App configuration
├── packages/
│   ├── ui/                   # Shared UI component library
│   ├── billing/              # Stripe billing logic
│   ├── features/             # Feature modules (auth, accounts, etc.)
│   └── supabase/             # Supabase client and type generation
├── supabase/
│   ├── functions/            # Deno Edge Functions
│   ├── migrations/           # SQL migration files
│   └── config.toml           # Supabase project configuration
└── pnpm-workspace.yaml

Core Technologies

Next.js 15 App Router

The frontend uses the App Router with React Server Components by default. Client components are explicitly marked with "use client". Server Actions handle mutations.

TypeScript

Strict TypeScript throughout. Supabase types are auto-generated from the database schema using supabase gen types typescript.

Tailwind CSS 4

Styling uses Tailwind CSS 4 with the new CSS-first configuration approach. The design system is built on top of shadcn/ui components.

Supabase

128+ tables with Row Level Security (RLS) on all tenant-scoped tables. Key extensions: pg_cron, pg_net, pgsodium, supabase_vault.

MakerKit Framework

The application scaffolding is based on MakerKit, providing:
  • Authentication flows and session management
  • Multi-tenancy primitives (accounts, memberships, roles)
  • Billing integration with Stripe
  • Admin dashboard scaffolding
MakerKit provides the foundation, but SecurAtlas extends it significantly with custom GRC modules, the integration engine, and the risk scoring system.

Stripe

Billing uses Stripe Subscriptions with per-tenant and per-partner plans. Webhooks handle subscription lifecycle events. See the billing tables (billing_customers, subscriptions, orders) for the data model.

Anthropic Claude

AI capabilities powered by Claude:
  • Evidence classification: Automatically tags and categorizes uploaded evidence against controls
  • Assessment analysis: Processes assessment questionnaire responses
  • API calls routed through server-side only; the ANTHROPIC_API_KEY is never exposed to the client

Key Conventions

ConventionDetail
Server vs ClientRSC by default; "use client" only when needed
Data fetchingServer Components fetch via Supabase server client
MutationsServer Actions in lib/actions/ or inline "use server"
RoutingFile-based routing under apps/web/app/
StylingTailwind utility classes, shadcn/ui components
StateURL state preferred; React state for ephemeral UI