AB
Alysson Barrera
Contact

02 / Public Case Studies Collection

Selected Engineering Work

A structured collection of inspectable case studies covering architecture trade-offs, state lifecycles, authorization boundaries and verifiable implementation evidence.

Filter by Category:

Public Engineering Case Studies

Frontend to

Cinedash

A high-performance film-discovery interface delivered within a seven-day constraint.

A film-discovery frontend combining typed URL state, infinite queries, virtualized rendering, persistent user state, explicit interface states, automated tests, CI, and Cloudflare Pages deployment.

Engineering Focus:
  • Assigning each form of state to a mechanism matching its lifecycle
  • Representing search and filters as navigable URL product state
  • Keeping rendering work proportional to the viewport as collections expand through virtualization
  • React 19
  • Vite
  • Strict TypeScript
  • TanStack Query
  • TanStack Router
  • TanStack Table
  • TanStack Virtual
  • Zustand Persistence
  • React Hook Form
  • Zod
  • Tailwind CSS
  • Vitest & RTL
  • MSW
  • Cloudflare Pages
77 Test Specification FilesInspect case study
FrontendSeptember 25, 2025

CaseFlow

Interactive investigation canvas & state model

An interactive investigation system coordinating heterogeneous clues, spatial organization, graph relationships, editing, history, and JSON export through React Flow state controlled by application-level model hooks.

Engineering Focus:
  • The board as both graph structure and spatial document
  • Stable identity preservation while clues move or change container context
  • Explicit content variants (text, image, audio, video) using discriminated unions
  • React Flow Canvas
  • MVVM-Inspired Structure
  • Strict TypeScript
  • Zod Discriminated Unions
  • Custom Snapshot History
  • Memoized Viewport Rendering
  • React Flow JSON Export
Inspectable ArchitectureInspect case study
BackendOctober 26, 2024

Top One

Commercial backend with domain modeling & contextual authorization

A commercial backend where domain modeling, application use cases, persistence boundaries, contextual authorization, and automated regression protection make business responsibility visible in the code.

Engineering Focus:
  • Data becomes more consequential as it transitions into a commercial commitment
  • Authentication identifies the actor; the resource context determines allowed capabilities
  • Authorization conditions built strictly from authoritative stored database values
  • NestJS
  • Prisma ORM
  • PostgreSQL
  • CASL Authorization
  • Either-style Result Types
  • Domain Events
  • HTTP & Integration Tests
Inspectable ArchitectureInspect case study
Full-stackSeptember 26, 2024

Next SaaS RBAC

Multi-tenant full-stack identity, organization & permission architecture

A multi-tenant full-stack application where authentication, organizations, memberships, role abilities, resource ownership, invitations, projects, billing, and ownership transfer are coordinated across a shared web and API architecture.

Engineering Focus:
  • Authentication, tenancy, and authorization are distinct, non-interchangeable contexts
  • Roles belong to memberships within organizations, not globally to an isolated user
  • A resource can belong simultaneously to a tenant organization and an individual owner
  • Turborepo Workspaces
  • Next.js App Router
  • Fastify REST API
  • Prisma ORM
  • Zod & OpenAPI
  • Shared CASL Package
  • Server Actions
Inspectable ArchitectureInspect case study
Confidential Professional Work
Anonymized Engineering Case Study

Content & Operations Platform

Responsibility: Primary Developer & System Architect

“An editor publishes a change. The system coordinates identity, data, media, and public delivery.”

End-to-end architecture and implementation of a production Nx monorepo spanning a React administrative application, a NestJS/Fastify API, a Next.js public site, and shared authorization and UI libraries.

Core Architectural Challenge:

Keeping administrative operations, relational state, object storage, and public cache behavior consistent across independently deployed applications. Mandatory first-login 2FA, server-authoritative CASL rules, direct R2 uploads, and tag-based revalidation must converge without exposing the organization or coupling the public experience to the administrative runtime.

Publishing & Security Invariants
  • 01.Sessions are issued only after password and mandatory TOTP verification; challenges are short-lived and single-use
  • 02.The API remains authoritative for permissions, persistence, and published content state
  • 03.Successful mutations revalidate only affected public cache tags after authoritative persistence
Nx MonorepoNestJS / FastifyReact / Next.jsPrisma / MariaDBCloudflare R2CASL & TOTP
Confidential Professional Work
Anonymized Engineering Case Study

Visual No-Code Workflow System

Responsibility: React Flow Architecture & Graph Consistency

“The user moves a line. The system preserves a program.”

Architecture and implementation work on a complex visual workflow canvas where users create, connect, configure, move, delete and copy workflow nodes.

Core Architectural Challenge:

Preserving graph consistency when visible UI actions affect stored reference structures. Node execution dependencies require edge updates, deletion, and copy-paste operations to reconstruct unique identities and relationships safely without leaving orphaned state.

Graph Consistency Invariants
  • 01.Edge movement automatically updates parent/child dependency arrays
  • 02.Copy-and-paste safely reconstructs node IDs and internal graph relationships
  • 03.Deletion cascades clean up dangling references before state persistence
React FlowTypeScriptGraph State TransformationsReference Synchronization