Shiftly – Zeiterfassung

Single Page Application

Hintergrund & Motivation

Im Rahmen meiner Weiterbildung zum Fullstack-Entwickler entstand als Abschlussprojekt die Anwendung Shiftly – ein digitales System zur Arbeitszeiterfassung. Ziel war es, eine praxisnahe Lösung zu entwickeln, mit der Nutzer ihre Arbeitszeiten einfach erfassen, verwalten und auswerten können. Dabei lag der Fokus nicht nur auf der technischen Umsetzung, sondern ebenso auf Benutzerfreundlichkeit und Datensicherheit.

Wer einen Eindruck vom aktuellen Stand erhalten möchte, kann das Projekt über den unten stehenden Link ausprobieren. Bitte beachten: Es befindet sich noch in der Entwicklung und dient in erster Linie als Showcase.

Pixel Medien Portfolio React App Shiftly Zeiterfassung

Konzeption & Design

Das Projekt wurde von Beginn an als Fullstack-Anwendung geplant. Auf der Client-Seite kam React zum Einsatz, um eine interaktive und responsive Benutzeroberfläche zu realisieren.
Im Design legte ich Wert auf eine klare Struktur: Arbeitszeit-Einträge sollten leicht erstellt, bearbeitet und gefiltert werden können. Ergänzt wurde das Konzept durch Kategorien, um unterschiedliche Tätigkeiten zuordnen und besser auswerten zu können.

Für die Datenverwaltung definierte ich ein klares Konzept: Jeder Nutzer sollte ausschließlich Zugriff auf seine eigenen Daten haben. Dafür wurde beim Login ein individueller Arbeitsbereich pro Nutzer vorgesehen, in dem Einträge und Kategorien gespeichert werden.

Technische Umsetzung

Shiftly wurde als moderne Webanwendung mit Node.js im Backend und React im Frontend entwickelt. Das Zusammenspiel sorgt für eine stabile Datenverwaltung im Hintergrund und eine intuitive, reaktive Oberfläche im Vordergrund.

Jeder Nutzer arbeitet dabei ausschließlich mit seinen eigenen Daten – sicher gespeichert und klar strukturiert. Über die Anwendung lassen sich Arbeitszeiten unkompliziert erfassen, bearbeiten und filtern, sodass eine schnelle und übersichtliche Verwaltung möglich ist.

Pixel Medien Portfolio Node.js
Pixel Medien Portfolio React

Funktionen & Merkmale

Shiftly ermöglicht die Erfassung und Verwaltung von Arbeitszeiten inklusive Tätigkeitszuordnung. Jede Aktion eines Nutzers betrifft ausschließlich seine eigenen Daten, was durch eine Kombination aus JWT-Authentifizierung und nutzergetrennter Datenablage gewährleistet ist.
Neben der grundlegenden CRUD-Funktionalität bietet das System Kategorien, eine Übersicht aller erfassten Zeiten und die Möglichkeit, Daten übersichtlich darzustellen.

Besonderes Augenmerk lag auf Sicherheit, Erweiterbarkeit und einer klaren Benutzerführung, sodass das Projekt nicht nur als Abschlussarbeit dient, sondern auch als solide Grundlage für ein praxisnahes Tool zur Arbeitszeiterfassung genutzt werden kann.

Eigenes Blog System
Restorative Justice