[{"data":1,"prerenderedAt":195},["ShallowReactive",2],{"service-projects-en-printer-management-healthcare-chat-integration-photobooth-platform":3},[4,78,137],{"id":5,"title":6,"body":7,"category":56,"challenge":57,"description":50,"extension":58,"featured":59,"image":60,"images":60,"impact":61,"meta":62,"navigation":63,"order":64,"path":65,"seo":66,"slug":67,"solution":68,"stem":69,"tagline":70,"tags":71,"testimonial":60,"testimonial_author":60,"testimonial_role":60,"url":60,"__hash__":77},"projects_en\u002Fprojects\u002Fen\u002Fprinter-management.md","Printer Management Platform",{"type":8,"value":9,"toc":49},"minimark",[10,15,19,23,42,46],[11,12,14],"h2",{"id":13},"project-overview","Project Overview",[16,17,18],"p",{},"Developed at CAMAO Tec (later rebranded to mmmake), this project involved building a printer management web application for a multi-store European retailer. The goal was to give operations teams a clear overview of all physical printer devices across their European store network, including device settings, physical locations, and associated metadata.",[11,20,22],{"id":21},"key-features","Key Features",[24,25,26,30,33,36,39],"ul",{},[27,28,29],"li",{},"Device overview dashboard across all store locations",[27,31,32],{},"CRUD operations for printer devices, settings, and metadata",[27,34,35],{},"OIDC\u002FOAuth authentication with audience validation and permission-based access control",[27,37,38],{},"Integration with an internal StencilJS UI component library",[27,40,41],{},"Mock-data layer to maintain delivery pace during API development",[11,43,45],{"id":44},"technical-highlights","Technical Highlights",[16,47,48],{},"The application was built on Vue 3, marking the company's first adoption of the framework. The REST API followed OpenAPI Spec 3 and required implementing a full OIDC authentication flow against an internal identity provider. Where the product design diverged from the component library, I worked directly with the library owners to identify and resolve issues — fixes that propagated to all framework consumers of the library, including native web components.",{"title":50,"searchDepth":51,"depth":51,"links":52},"",2,[53,54,55],{"id":13,"depth":51,"text":14},{"id":21,"depth":51,"text":22},{"id":44,"depth":51,"text":45},"web-app","A multi-store European retailer needed a web interface to manage physical printers across all their locations — covering device overviews, settings, location assignment, and metadata. The project also served as the company's first introduction of Vue into their tech stack.","md",false,null,"The application launched successfully and became the foundation for future feature extensions. The team was fully onboarded into Vue with a solid understanding of component architecture and ecosystem best practices. Bug fixes contributed back to the shared component library benefited all downstream framework consumers.",{},true,3,"\u002Fprojects\u002Fen\u002Fprinter-management",{"title":6,"description":50},"printer-management","I built the web application using Vue 3 and an internal StencilJS-based UI component library, connected to a REST API following OpenAPI Spec 3 with OIDC authentication. I implemented OAuth-compliant auth including audience and permission checks, bridged gaps where the design diverged from the component library, and kept delivery on schedule by using mock data and mock services while the API was still in development. I also onboarded the development team into Vue, coaching best practices in component design and the Vue ecosystem.","projects\u002Fen\u002Fprinter-management","Europe-wide device management for retail",[72,73,74,75,76],"Vue 3","TypeScript","OIDC","REST API","StencilJS","Lml6xl48r7TlYoOKrxLziNBNr39Ol4Krxj6c7Y1WCco",{"id":79,"title":80,"body":81,"category":117,"challenge":118,"description":50,"extension":58,"featured":59,"image":60,"images":60,"impact":119,"meta":120,"navigation":63,"order":121,"path":122,"seo":123,"slug":124,"solution":125,"stem":126,"tagline":127,"tags":128,"testimonial":60,"testimonial_author":60,"testimonial_role":60,"url":60,"__hash__":136},"projects_en\u002Fprojects\u002Fen\u002Fhealthcare-chat-integration.md","Healthcare PWA Chat Integration",{"type":8,"value":82,"toc":112},[83,85,88,90,107,109],[11,84,14],{"id":13},[16,86,87],{},"This NDA-protected project involved integrating a real-time chat system into an existing React progressive web application serving clients and healthcare professionals. The app managed user data for both roles and required a communication channel between them. The project scope was narrowly focused: select the right chat technology and implement it end-to-end under a tight deadline.",[11,89,22],{"id":21},[24,91,92,95,98,101,104],{},[27,93,94],{},"RocketChat integrated via Docker into the existing infrastructure",[27,96,97],{},"Automatic RocketChat user provisioning on app registration and login",[27,99,100],{},"NestJS proxy endpoints for chat-room creation, message handling, and business logic",[27,102,103],{},"Custom WebSocket client implementation for real-time messaging in the React frontend",[27,105,106],{},"Jest unit tests on all new NestJS endpoints using dependency injection and module mocking",[11,108,45],{"id":44},[16,110,111],{},"The backend was generated with Amplication and already used MongoDB, which made it straightforward to share the same database instance with RocketChat. Rather than using RocketChat's pre-built UI, I implemented the WebSocket connection manually to match the client's existing interface design. NestJS's module system and dependency injection made it easy to write isolated unit tests for the new proxy endpoints, providing the first test coverage the project had seen.",{"title":50,"searchDepth":51,"depth":51,"links":113},[114,115,116],{"id":13,"depth":51,"text":14},{"id":21,"depth":51,"text":22},{"id":44,"depth":51,"text":45},"integration","A healthcare web application connecting clients and doctors was missing its core communication feature — a real-time user chat — with a hard deadline approaching. The existing codebase was a React PWA with a NestJS\u002FAmplication backend, both lacking tests or quality gates. The client had no tooling strategy and needed both a technology recommendation and a full implementation.","The chat feature was delivered on time and fully integrated into the existing application. NestJS endpoints were covered with Jest unit tests — the first quality-assurance layer in the project. The solution kept user management centralised and real-time messaging performant through a direct WebSocket connection.",{},4,"\u002Fprojects\u002Fen\u002Fhealthcare-chat-integration",{"title":80,"description":50},"healthcare-chat-integration","I researched and evaluated chat solutions with React support (including GetStream.io and RocketChat), presented findings to the client, and led the integration of RocketChat. I extended the existing Docker Compose setup to run RocketChat against the project's existing MongoDB instance, disabled self-registration, and implemented automatic user creation in RocketChat on login and registration. Proxy endpoints were built in NestJS to intercept chat-room creation and messaging with business logic, covered by Jest unit tests. On the frontend, I implemented a custom RocketChat WebSocket connection from scratch to enable real-time messaging within the app's existing UI design.","projects\u002Fen\u002Fhealthcare-chat-integration","Real-time chat for a client-doctor web app",[129,130,131,132,133,134,135],"React","NestJS","RocketChat","WebSockets","MongoDB","Jest","PWA","TJ-MBDXVJck1GhNkVqnvvyCxjpshSCUkkWtcvAXi0A8",{"id":138,"title":139,"body":140,"category":56,"challenge":179,"description":50,"extension":58,"featured":59,"image":60,"images":60,"impact":180,"meta":181,"navigation":63,"order":182,"path":183,"seo":184,"slug":185,"solution":186,"stem":187,"tagline":188,"tags":189,"testimonial":60,"testimonial_author":60,"testimonial_role":60,"url":60,"__hash__":194},"projects_en\u002Fprojects\u002Fen\u002Fphotobooth-platform.md","Photobooth Platform",{"type":8,"value":141,"toc":174},[142,144,147,149,169,171],[11,143,14],{"id":13},[16,145,146],{},"This project involved rebuilding a photobooth software platform from the ground up for a company that rents out photobooths — including hardware, personnel, custom overlays, and software — for corporate events and live occasions. The existing MVP covered only the bare minimum and was not fit for real-world, high-volume use.",[11,148,22],{"id":21},[24,150,151,154,157,160,163,166],{},[27,152,153],{},"Node.js disk watcher detecting newly captured images from a WiFi SD card in real time",[27,155,156],{},"Laravel backend for image ingestion, thumbnail generation, and overlay compositing",[27,158,159],{},"WebSocket notifications pushing new images to the Vue frontend instantly",[27,161,162],{},"Overlay selection with backend-rendered preview images (mediocre resolution for speed)",[27,164,165],{},"Full-resolution image generation with selected overlay on confirmation",[27,167,168],{},"PHP print command dispatched from Laravel to the connected event printer",[11,170,45],{"id":44},[16,172,173],{},"The core challenge was achieving real-time responsiveness without polling. The combination of a Node.js file watcher and a Laravel WebSocket broadcaster meant the frontend was always up to date the moment a photo landed on disk. Thumbnail generation on the backend was essential to keep the frontend snappy — loading full-resolution images in a live event context would have caused noticeable delays. The Laravel\u002FVue stack replaced an unmaintainable plain PHP\u002FJS codebase with a clean, framework-structured application ready for future extensions.",{"title":50,"searchDepth":51,"depth":51,"links":175},[176,177,178],{"id":13,"depth":51,"text":14},{"id":21,"depth":51,"text":22},{"id":44,"depth":51,"text":45},"A photobooth rental company had an MVP built in plain PHP and HTML\u002FJS with no framework, no live image loading, and performance unsuitable for live events with high photo volumes. Freshly captured photos weren't displayed in real time, the codebase wasn't maintainable, and the frontend lacked the reactivity needed for a smooth booth experience.","The platform replaced a fragile MVP with a robust, maintainable application capable of handling high-volume live events. Real-time image delivery and instant print dispatch gave booth operators and event guests a smooth, responsive experience. The Laravel\u002FVue stack provided a clean foundation for future feature development.",{},5,"\u002Fprojects\u002Fen\u002Fphotobooth-platform",{"title":139,"description":50},"photobooth-platform","I rewrote the platform with a Laravel backend and Vue.js frontend. A Node.js script continuously scanned the target disk for new images captured via a WiFi-enabled SD card. On detection, it notified the Laravel backend, which processed each image — generating thumbnails for fast preview and overlay-composited versions for selection. Once a photo and overlay were chosen, Laravel generated the final full-resolution image and dispatched a PHP print command directly to the connected printer. The frontend received real-time updates via WebSocket, displaying new photos instantly without any manual reload.","projects\u002Fen\u002Fphotobooth-platform","Real-time photo processing for live events",[190,191,192,132,193],"Vue.js","Laravel","Node.js","PHP","W5mRdtnD0Jw-b5OGRWkoqA6F848Ginjm4JraKNJEcd4",1787644787816]