Experience Qognity Dec 2025 – Present Own frontend architecture and product UX for Qognity Suite , a multi-tenant AI operations platform spanning React web, Electron desktop, and a Microsoft Word add-in. Established shared components, design tokens, and API/domain foundations in a TypeScript monorepo, separating product logic from platform-specific behavior. Built streamed AI chat with agent selection and human review workflows for inspecting, editing, approving, and rejecting proposed actions. Co-design API contracts with backend engineers and implement WebSocket reconnection and interrupted-action recovery, backed by regression tests. Established frontend testing and the release lifecycle from scratch, including CI, versioned packaging, container publishing, and automated deployment. Established the React Native application’s architecture, navigation, authentication, and shared API/UI foundations. The application remains in development. Niovity Jan 2022 – Sep 2025 Principal Frontend Engineer May 2023 – Sep 2025 Co-designed Butterfly’s configurable frontend platform, adopted across nine production applications , sharing UI libraries, API clients, and search/browse behavior. Led frontend implementation for Pergamos and MONUMENTA , supporting approximately 200,000 records across 47 collections , and 10,000+ buildings with 40,000+ photographs , respectively. Built faceted search and administrative workflows with filtering, sorting, pagination, exports, bulk actions, reporting, and complex validation. Migrated multiple production applications from Next.js Pages Router to App Router, adapting shared packages, server/client boundaries, data fetching, and caching. Improved frontend performance through long-list virtualization, render profiling, shared-package bundle reduction, and request caching. Mentored one junior frontend engineer through pair programming, code reviews, and platform onboarding, helping them progress to independent feature delivery . Experience continued Niovity· continued Jan 2022 – Sep 2025 Frontend Engineer Jul 2022 – Apr 2023 Built responsive backoffice and public applications on Butterfly’s shared platform. Backend Engineer Jan 2022 – Jun 2022 Designed and implemented Java/Spring REST APIs, supporting the frontend features. Selected Projects Professional · Qognity Qognity Suite Shared frontend architecture and reviewable AI workflows across web, desktop, and Microsoft Word. Own frontend architecture and delivery for an AI operations platform across web, desktop, and Microsoft Word. View case study Professional · Niovity · University of Athens Pergamos Configurable thesis administration and interlibrary-lending workflows for the University of Athens repository. Led frontend delivery for approximately 200,000 records across 47 collections, including faceted discovery, administrative validation, and thesis and interlibrary-lending workflows. View case study Independent product Tefteri An independently designed and maintained Android notebook with offline data, optional synchronization, and native reminders. Published and maintain an offline-first React Native/Expo Android app on Google Play, owning persistence, Firebase sync, recovery, EAS builds, signing, releases, and Crashlytics-based crash investigation. View case study More work
Professional · Niovity · MONUMENTA MONUMENTA A configurable Next.js backoffice for multilingual heritage records, linked media, and website publishing. Led the frontend for a unified backoffice managing multilingual heritage records, linked media, and website content. View case study Independent client work iriskoutsafti.com A client website delivered from brief through design, implementation, deployment, and ongoing maintenance. Designed and built a static-first Astro website; continue to maintain its contact flows, privacy-aware Maps loading, and performance monitoring. View case study Qognity Suite Shared frontend architecture and reviewable AI workflows across web, desktop, and Microsoft Word.
My contribution As Qognity’s sole frontend engineer, I own frontend architecture, product UX, implementation, testing, and release delivery. I translate business needs into interfaces and co-design API contracts with backend engineers.
In development: I established the React Native app’s architecture, navigation, authentication, and shared API/UI foundations. The mobile app has not been released.
Outcome Established shared frontend foundations and repeatable releases across web, desktop, and Word. Users reported a clearer Email-to-Jira review flow after improvements to action labels, status presentation, and feedback.
01 / 02 A unified operations dashboard brings pending AI-assisted reviews and connector health into one workspace.Open full size 02 / 02 Human-in-the-loop Email-to-Jira review with source context and approve, update, reject, and reply actions.Open full size Context Teams need to inspect proposed actions, understand their status, and control what reaches connected systems. Qognity brings Jira, email, room booking, and document workflows into one multi-tenant platform.
Engineering decisions Share React components, design tokens, API clients, and domain models through a TypeScript monorepo to reuse product behavior while isolating browser, Electron, and Office host constraints. Expose source context, proposed actions, and execution results so users can inspect AI proposals before approving them; refined labels and feedback in response to users. Build streamed AI chat with agent selection, connection-state feedback, and authenticated previews for images, PDFs, and text attachments. Recover WebSocket connections and in-flight actions to support interrupted workflows, with regression tests covering recovery behavior. Present user activity and operational statistics through Recharts analytics and custom visualizations. React TypeScript Electron Office.js Turborepo Docker / nginx Pergamos Configurable thesis administration and interlibrary-lending workflows for the University of Athens repository.
My contribution I led the administrative frontend and co-designed interlibrary-lending workflows with backend engineers, building on Butterfly’s configurable Next.js base application and shared component registry.
Outcome Staff reported that the delivered interlibrary-lending workflow centralized request tracking, automated notifications, and reduced repeated data entry. The administrative frontend also supports thesis review and repository management.
01 / 03 Thesis records with pending submissions, approval status, filters, sorting, and repository metadata.Open full size 02 / 03 Metadata-heavy repository browsing with faceted filters, record views, sorting, and export.Open full size 03 / 03 Hierarchical administration of schools, departments, and institutional units.Open full size Context Pergamos is the institutional repository and digital library of the National and Kapodistrian University of Athens, containing approximately 200,000 records across 47 collections. Staff manage thesis submissions, complex metadata, files, access permissions, and library requests.
Engineering decisions Built configuration-driven search and browse pages with faceted filters, sorting, pagination, exports, bulk actions, and reporting on Butterfly’s shared platform. Implemented optimistic updates, cache invalidation, and synchronization with SWR and TanStack Query, alongside complex form validation using React Hook Form and Zod. Combined metadata validation, file/access handling, and approval actions in thesis review flows so administrators could manage submissions within the repository. Co-designed interlibrary-lending states and API behavior with backend engineers to centralize request tracking and expose automated updates in the frontend. Next.js React TypeScript Component registry Base application MONUMENTA A configurable Next.js backoffice for multilingual heritage records, linked media, and website publishing.
My contribution As the primary frontend owner, I led backoffice implementation on Butterfly’s configurable Next.js base application and shared component registry.
Outcome Enabled staff to manage multilingual heritage records, linked media, and website content from one backoffice.
01 / 03 Multilingual heritage-record editing with linked photographs, files, and related material.Open full size 02 / 03 Backoffice management of news, events, content types, filtering, and publishing.Open full size 03 / 03 Project-specific configuration for maps, featured monuments, and generated image formats.Open full size Context MONUMENTA documents architectural and natural heritage in Greece and Cyprus. Its backoffice supports 10,000+ buildings and 40,000+ photographs, allowing staff to curate multilingual records, connect media, and publish website content.
Engineering decisions Combined multilingual editing, metadata validation, and linked media in one record workflow to support complex heritage records. Reused Butterfly’s browsing and administration patterns for records and website content, keeping project-specific workflows on the shared platform. Extended shared configuration for maps, featured monuments, and image settings to accommodate MONUMENTA’s publishing requirements within the existing application foundation. Next.js React TypeScript Component registry Base application Tefteri An independently designed and maintained Android notebook with offline data, optional synchronization, and native reminders.
My contribution I am the sole creator and ongoing maintainer, responsible for product design, architecture, implementation, EAS builds, signing, Google Play submission, testing, crash investigation, and updates. Published on Android in 2026.
Outcome Published an Android app that remains useful offline, with optional cloud synchronization and native reminders. Usage is primarily personal and within a testing group; I continue to maintain its data and notification behavior.
01 / 02 A focused entry flow separates scheduled obligations, general reminders, and archival notes from the first step.Open full size 02 / 02 The scheduled-reminder form combines category context, quick date presets, notes, and optional details in one local-first workflow.Open full size Context Tefteri helps Greek-language users organize dated notes, obligations, and reminders without requiring connectivity or an account.
Engineering decisions Persist changes locally and defer optional Firebase synchronization so connectivity and an account are not prerequisites; protect retries against duplicate operations. Schedule reminders on-device so delivery does not depend on cloud synchronization; update or cancel notifications as entries change and handle permissions explicitly. Maintain Android delivery through EAS, and use device testing, Firebase Crashlytics, custom analytics, and feedback from personal and testing-group use to guide maintenance. React Native Expo Firebase Android iriskoutsafti.com A client website delivered from brief through design, implementation, deployment, and ongoing maintenance.
My contribution I translate the client’s needs into information structure, interaction design, implementation, and ongoing operation.
Outcome Delivered a professional website with service information and contact flows, supported by ongoing maintenance, browser diagnostics, and real-user performance monitoring.
01 / 03 Responsive landing page pairing clear professional positioning with a calm, image-led visual identity.Open full size 02 / 03 Interactive session-room carousel and accessible service navigation keep detailed content easy to explore.Open full size 03 / 03 Structured contact journey combining an accessible form, direct contact channels, and clearly presented availability.Open full size Context A clinical psychologist needed a clear professional website that explains services and helps prospective clients make contact.
Engineering decisions Use Astro’s static-first architecture and reserve React for interactions that need client-side state, keeping informational routes lightweight. Load Maps on demand to respect the visitor’s privacy choice, and use serverless email to support contact without a persistent application server. Integrate product analytics and Vercel Speed Insights, alongside browser diagnostics, to assess behavior and guide ongoing maintenance. Technical Skills Frontend
TypeScript · JavaScript · React · Next.js · Astro · HTML · CSS · Recharts
Architecture & Accessibility
Shared components · Design tokens · Monorepos/Turborepo · Server Components/SSR · Internationalization/RTL · Semantic HTML · Keyboard accessibility
State & Forms
TanStack Query · SWR · Optimistic updates · Cache invalidation · Redux Toolkit · Zustand · React Context · React Hook Form · Zod
Authentication & Integration
MSAL/OAuth · Token and consent handling · Redirect, logout, and authentication recovery flows · REST API contracts · WebSockets · Next.js Route Handlers · Resend
Testing & Delivery
Playwright · Vitest · Jest · React Testing Library · GitHub Actions · Docker · nginx
Platforms
Electron · Office.js · React Native/Expo · Electron Forge · EAS
Backend Contributions
Java/Spring · SQL/MySQL · JPA/Hibernate · Python/FastAPI · Firebase/Firestore · PostgreSQL
AI-assisted Development
Codex · Repository instructions (AGENTS.md) · Critical review of generated changes
Education National Technical University of Athens
Diploma in Electrical & Computer Engineering (Integrated Master)
2015 – 2021 · GPA 7.81 / 10
Thesis: REST API Test Case Generator
Languages Greek Native
English Fluent (Cambridge C2 Proficiency)
Pavlos Stathopoulos · October 2026 pavlossta.com