Entwicklung einer Webanwendung für Fripa mit .NET / C# / Angular

Umsetzung einer geräteunabhängigen Webapplikation zur Erfassung von Rohstoffen für die Produktion und Planung

Mitte 2020 wurde eWorks von der Fripa Papierfabrik Albert Friedrich KG (Fripa) mit der Umsetzung einer auf Angular und Microsoft .NET Core basierenden Single-Page Webanwendung beauftragt. Fripa ist ein deutscher Hersteller von hochwertigen Hygienepapieren mit Sitz in Düren. Zur Produktion und Planung ist die Erfassung der Roh-, Hilfs-, Betriebsstoffe (RHB) notwendig, die zum Zeitpunkt der Beauftragung nur anteilig digitalisiert war und durch die Umsetzung vollständig als Webapplikation digitalisiert wurde. Im Vordergrund stand außerdem die Geräteunabhängigkeit, damit die Webapplikation sowohl im Desktop-Bereich unter Microsoft Windows 10 als auch auf mobilen Endgeräten mit dem Google Android Betriebssystem eingesetzt werden kann, das auf den bei der Fripa im Einsatz befindlichen Zebra MDE Endgeräten zum Barcode Scan zum Einsatz kommt. Eine Schnittstelle zum ERP-System proALPHA wurde über die zugrundeliegenden Oracle Datenbank der Webapplikation kundenseitig realisiert.

In der Single-Page Webanwendung ist es möglich Vorgaben für den Werker zu definieren, an welcher Maschine, zu welchem Zeitraum, welcher Roh- und/oder Hilfsstoffe einzusetzen ist, die zur Herstellung eines Produkts benötigt werden. Dies erfolgt in der für die Desktop-Ansicht optimierten Variante der Web-Anwendung. Die im Fokus der Webanwendung stehende RHB-Stofferfassung findet über Handgeräte-Scannern (MDE) in der für die Mobile-Ansicht optimierten Variante statt, auf Basis der Vorgaben zur Erfassung. Die Barcodes der Stoffe können automatisiert eingescannt, oder händisch per Tastatur eingetragen werden. Da sich das Einsatzgebiet der mobilen Endgeräte im Außenbereich von Fripa befindet und die Abdeckung des Netzwerkzugangs via WLAN nicht in allen Bereichen ausreichend gewährleistet werden kann, unterstützt die Webapplikation den Betrieb im Offline-Modus um eventuelle Verbindungsabbrüchen zum Netzwerk abzufangen, ohne den Arbeitsprozess dabei zu unterbrechen. Bei Wiederherstellung der Verbindung findet eine automatisierte Synchronisierung mit dem in Microsoft .NET Core entwickelten serverseitigen WebAPI-Backend statt. Nachträgliche Korrekturen an den Stofferfassungen können in weiteren Bereichen der Webapplikation durchgeführt werden. Abgerundet wird die Webanwendung über einen Bereich zur Benutzerverwaltung und Berechtigungsvergabe, der das Hinzufügen und Bearbeiten von Benutzer der Anwendung anbietet.

Das Frontend der Webanwendung wurde als Single-Page Application (SPA) auf Basis von JavaScript umgesetzt und mit Angular 10, in HTML5, SCSS und TypeScript entwickelt. Alle für die Verwaltung der Webapplikation vorgesehenen Bereiche wurden für eine Desktop-Ansicht optimiert, die für die Stofferfassung vorgesehen Anwendungsbereiche hingegen für eine Mobile-Ansicht auf den Hand-Scanner (MDE) der Fripa. Zum Ermöglichen der Offline-Fähigkeit und Update-Fähigkeit, sowie des an mobile Apps angelehnten Look&Feels, wurde die Webapplikation als Progressive Web Application (PWA) umgesetzt. Das Backend ist auf Basis von Microsoft .NET Core entwickelt und stellt die WebAPI Endpunkte für das Angular 10 Frontend bereit. Die Anbindung an die Datenhaltung in Form einer Oracle Datenbank wurde mit Entity Framework Core (EF Core) realisiert.