Technology Stack

Web Application Stack

Component Technology Purpose
Framework React 18 UI framework with function components + hooks
GraphQL Client Apollo Client Data fetching, caching, and real-time updates
State Management React Context + Apollo Client cache Global state and cache management
UI Components Tailwind CSS + Custom Design System Styling and component library
Build Tool Vite Fast development and build tooling
PWA Service Worker Offline support and app-like experience

Future Native Mobile Apps

Component Technology Purpose
Platform Native iOS (Swift) / Android (Kotlin) Platform-specific implementations
GraphQL Client Native Apollo Client Consistent API layer
State Management Platform-native reactive patterns Native state management

Backend Integration Technologies

Component Technology Purpose
Authentication JWT tokens via Supabase User authentication and authorization
API Layer GraphQL (Ariadne/Strawberry for Python) Unified API interface
Data Source Neo4j Aura Graph database for relationships
File Storage Supabase Storage File uploads and management

Development Tools

Tool Purpose
TypeScript Type safety and developer experience
ESLint Code linting and consistency
Prettier Code formatting
Vitest Unit testing framework
React Testing Library Component testing
Playwright End-to-end testing

Key Technology Decisions

Why React 18?

  • Modern hooks-based architecture
  • Excellent ecosystem and community support
  • Strong TypeScript integration
  • Concurrent features for better UX

Why Apollo Client?

  • Comprehensive GraphQL client with caching
  • Built-in optimistic updates support
  • Real-time subscriptions via WebSocket
  • Excellent developer tools

Why Tailwind CSS?

  • Utility-first approach for rapid development
  • Excellent responsive design capabilities
  • Consistent design system enforcement
  • Small bundle size with purging