Back to Case Studies
Mobile & Full-Stack

New Mystica

A sophisticated full-stack application bridging modern web backends with native Apple platform development. Built with Express.js, Supabase, and SwiftUI for iOS/macOS.

No video available

New Mystica demonstrates a carefully architected full-stack system combining a robust Express.js API backend powered by Supabase with a polished SwiftUI frontend for iOS and macOS. The application features location-based functionality with materials and inventory management capabilities, showcasing how to effectively separate concerns between cloud infrastructure, business logic orchestration, and native user experiences.

Skills

Express.jsTypeScriptSupabasePostgreSQLPostGISSwiftUISwiftSwiftDataRailwayDocker

Key Deliverables

  • RESTful API architecture with business logic abstraction
  • Geospatial database design with PostGIS extensions
  • Native iOS/macOS application in SwiftUI
  • Local persistence with SwiftData
  • Containerized backend deployment
  • JWT-based authentication
  • Real-time data synchronization

The Challenge

Building a modern application that spans multiple platforms requires thoughtful architectural decisions. The challenge wasn't just about connecting clients to a database—it required designing a system where native iOS/macOS applications could provide the best user experience while maintaining clean separation from cloud infrastructure.

The application needed to handle location-based queries at scale, manage complex inventory data with geographic context, and provide offline functionality without losing synchronization. Most importantly, the architecture needed to be maintainable enough for a small team to develop and deploy independently.

Full-Stack Architecture

A clean separation of concerns between cloud services, API orchestration, and native platforms

Backend: Express.js API Gateway

Rather than exposing Supabase directly to clients, the Express layer provides a controlled API surface. This approach enables business logic implementation, request validation, and complex queries that would be difficult to manage from mobile clients. The backend orchestrates between native applications and Supabase services.

Data Layer: PostgreSQL with PostGIS

Supabase provides a managed PostgreSQL database with PostGIS extensions, enabling sophisticated geospatial queries. This foundation supports:

  • Finding materials within specific geographic radii
  • Calculating distances between locations
  • Geofencing and proximity-based alerts
  • Spatial indexing for performance at scale

Frontend: Native SwiftUI Application

A single Swift codebase targets both iOS and macOS, leveraging Apple's unified platform approach. The native implementation provides access to platform APIs including MapKit for maps, CoreLocation for GPS, Camera APIs for photography, and push notifications—capabilities that are difficult to fully replicate in hybrid frameworks.

Technology Decisions

Strategic choices that enable development velocity and production reliability

Why Express.js?

Minimal, flexible foundation without framework overhead

Rich middleware ecosystem for cross-cutting concerns

TypeScript support for type safety across the stack

Ideal for managing Supabase client connections and pooling

Why Supabase?

PostgreSQL foundation for relational data and spatial queries

Real-time subscriptions for live data synchronization

Built-in authentication with Row Level Security policies

Integrated object storage for images and media

Why Native SwiftUI?

Superior performance for animations and rendering

Deep platform integration with iOS/macOS features

Declarative syntax accelerates UI development

Automatic optimizations with OS updates

Why Railway Deployment?

Git-based deployments with automatic CI/CD

Containerization ensures dev/prod consistency

Secure environment variable management built-in

Horizontal scaling for traffic spikes

Architecture in Action

The system demonstrates clean separation between cloud infrastructure, API orchestration, and native client applications.

Case study photo 1
Case study photo 2
Case study photo 3

Core Capabilities

Features enabled by the architecture

Geographic Mapping

Interactive maps displaying locations with MapKit integration, enabling users to visualize and interact with geographic data.

Inventory Management

Comprehensive materials and inventory tracking with metadata, supporting field work and resource management workflows.

User Profiles

Authenticated user accounts with personalized data, leveraging Supabase Auth and Row Level Security policies.

Image Handling

Efficient photo capture and storage with caching strategies, reducing bandwidth and improving load times.

Offline Sync

Local data persistence with SwiftData enables offline functionality with automatic synchronization when connection restored.

JWT Authentication

Secure request handling with JWT tokens issued by Supabase and validated by Express middleware.

Development Workflow

Enabling parallel work and rapid iteration

Backend Development

cd mystica-express
pnpm install
pnpm dev

Hot reload during development with automatic server restarts.

Frontend Development

open New-Mystica.xcodeproj
Select Simulator/Device
⌘R to Run

SwiftUI preview canvas enables instant UI iteration.

Integration Testing

localhost:3000
iOS Simulator
Rapid Iteration

Developers can test locally while API runs on their machine.

Engineering Sophistication

Architectural decisions that enable scalability and maintainability

Type Safety Across the Stack

TypeScript on the backend and Swift on the frontend eliminate entire classes of runtime errors. The type system provides confidence when refactoring and prevents many categories of bugs before they reach production.

Protocol-Oriented Design

Swift protocols for repositories enable dependency injection and facilitate testing. This design pattern makes the codebase flexible and prevents tight coupling between components.

Environment-Specific Configuration

Separate xcconfig files for production and development environments, combined with environment variables in Railway, ensure correct behavior across development, staging, and production.

Intelligent Caching Strategy

Image caching reduces bandwidth consumption and dramatically improves perceived performance. The caching strategy is implemented at multiple layers for efficiency.

Build Automation

Automated build scripts and Docker containerization streamline releases and ensure consistency between development and production environments.

Separation of Concerns

Clean boundaries between infrastructure (Supabase), business logic (Express), and user experience (SwiftUI) make the codebase easy to understand and modify.

Full-Stack Integration

The communication pattern between native clients and the API layer ensures both performance and security.

Case study photo 1
Case study photo 2

Production Deployment

Backend on Railway

  • Git-based automatic deployments
  • Docker containerization for consistency
  • Environment variable management
  • Horizontal scaling capabilities
  • SSL certificates included
  • Monitoring and logging built-in

Frontend Distribution

  • TestFlight for beta testing
  • App Store for public releases
  • Automatic update distribution
  • Separate build configurations
  • Professional release management
  • Enterprise distribution support

Complete Technology Stack

Backend Stack

  • Express.js 4.18
  • Node.js Runtime
  • TypeScript
  • Supabase Client
  • pnpm Package Manager
  • Docker Containerization
  • Railway Platform

Frontend Stack

  • SwiftUI Framework
  • SwiftData Persistence
  • Swift Language
  • Xcode 15+
  • iOS Targets
  • macOS Targets
  • Native APIs

Infrastructure

  • PostgreSQL Database
  • PostGIS Extensions
  • Supabase Managed Services
  • Authentication (Auth)
  • Object Storage
  • Real-time Subscriptions
  • Row Level Security

Key Architectural Principles

What makes this system work at scale

Separation of Concerns

Each layer has clear responsibilities: infrastructure, business logic, and user experience.

Type Safety First

Both backend and frontend use strict typing to catch errors before they reach production.

Managed Services

Leverage Supabase and Railway to focus on application logic, not infrastructure management.

Native Experiences

SwiftUI provides better performance and platform integration than cross-platform alternatives.

Developer Velocity

Clear patterns and automation enable small teams to develop and deploy independently.

Production Ready

Architecture scales from prototype to production without fundamental rewrites.

Conclusion

New Mystica exemplifies modern full-stack development best practices, balancing managed services with custom application logic while prioritizing native user experiences. The architecture demonstrates clear thinking about separation of concerns: Supabase handles infrastructure complexity, Express orchestrates business logic and provides a controlled API surface, and SwiftUI delivers polished native experiences that feel at home on iOS and macOS.

The technology choices—Express.js for flexible API development, Supabase for managed PostgreSQL with spatial capabilities, SwiftUI for native Apple platform development, and Railway for streamlined deployment—create a productive development environment that can scale from prototype to production without architectural rewrites.

For developers building location-aware applications with rich mobile experiences, New Mystica provides a compelling reference architecture that leverages the strengths of both web and native platforms while maintaining clean boundaries and avoiding common full-stack pitfalls. The system demonstrates that thoughtful architectural decisions upfront enable long-term maintainability, developer productivity, and reliable production performance.

Ready to bring your vision to life?

Let's collaborate on your next project with the same precision and innovation demonstrated in this case study.

Schedule a Meeting

Ready to discuss your project? Choose a convenient time to meet with us.

Contact Information

Schedule a consultation to discuss your software development needs. I'm here to help bring your ideas to life.

Location

San Francisco, California, USA

Select a Date

October 2025

Explore Another Project

.claude: AI Workflow Orchestration

Open source developer tool with 475+ stars