Architecture

Tech Stack

Technologies and tools used in OpenInvoice

Core Technologies

Framework

  • Next.js 16 - React framework with App Router
  • React 19 - UI library
  • TypeScript - Type-safe JavaScript

Database

  • PostgreSQL - Relational database
  • Prisma - ORM and database toolkit

Authentication

  • Clerk - Authentication and user management
  • Clerk Organizations - Multi-tenant support

UI & Styling

Components

  • Shadcn UI - Component library
  • Radix UI - Headless UI primitives
  • Lucide React - Icon library

Styling

  • Tailwind CSS v4 - Utility-first CSS
  • CSS Variables - Theming support
  • Dark Mode - Built-in dark mode

Payment Processing

  • Stripe - Payment processing
  • Stripe Connect - Multi-tenant payments
  • XRPL - Cryptocurrency payments (XRP)

Email & Communication

  • Resend - Transactional emails
  • Twilio - SMS notifications (optional)

Tax & Compliance

  • TaxJar - Automatic tax calculation
  • Custom Tax System - Manual tax profiles

Development Tools

Code Quality

  • ESLint - Linting
  • Prettier - Code formatting
  • TypeScript - Type checking

Build Tools

  • Bun - Runtime and package manager (recommended)
  • npm - Alternative package manager

Additional Libraries

Forms & Validation

  • React Hook Form - Form management
  • Zod - Schema validation

Data Management

  • TanStack Query - Data fetching
  • TanStack Table - Data tables
  • Zustand - State management

Utilities

  • date-fns - Date manipulation
  • Recharts - Charts and graphs
  • React PDF - PDF generation

Infrastructure

Hosting

  • Vercel - Recommended hosting (Next.js optimized)
  • Any Node.js Host - Compatible with any Node.js host

Monitoring

  • Sentry - Error tracking (optional)

API Integrations

  • CoinGecko - Cryptocurrency exchange rates
  • TaxJar API - Tax calculation
  • Stripe API - Payment processing
  • Resend API - Email delivery

Next Steps