Employee Authentication
Supports secure sign-in workflows with separate access levels for employees and administrators.
Full-Stack Web Application
Time Punch Management System
A full-stack employee attendance application designed to manage clock-in and clock-out workflows, store shift history, and provide administrative reporting through a React frontend and ASP.NET Core backend.
- C#
- React
- TypeScript
- ASP.NET Core
- .NET Aspire
- SQL Server
- Azure
Context & purpose
Project overview
Time Punch Management System was designed around a practical business workflow: recording employee attendance while giving administrators a structured way to review time data.
The application connects a React and TypeScript frontend to ASP.NET Core APIs, uses SQL Server for relational persistence, and organizes local development through .NET Aspire.
Building it strengthened my experience with authentication, protected workflows, relational data modeling, API design, and coordinating frontend state with backend business rules.
From Clock In to Attendance Management
Application Workflow
The Time Punch application follows a straightforward workflow. Employees record their work hours by clocking in and out, while administrators review attendance records and make corrections when needed.
- Login
Employees and admins sign in securely.
- Clock In
Employees record the start of a shift.
- Track
Punch data is stored and shown in the dashboard.
- Clock Out
Employees record the end of a shift.
- Review
Admins review records and manage punch corrections.
- Login
Employees and admins sign in securely.
- Clock In
Employees record the start of a shift.
- Track
Punch data is stored and shown in the dashboard.
- Clock Out
Employees record the end of a shift.
- Review
Admins review records and manage punch corrections.
Application functionality
Key features
Clock In / Clock Out Workflow
Allows employees to start and end shifts while tracking timestamps and maintaining shift history.
Attendance Dashboard
Provides a responsive React interface for viewing current status, shift history, and worked time.
Administrative Reporting
Gives administrators tools to review attendance records, identify discrepancies, and support payroll review.
Admin Punch Management
Allows administrators to create, review, update, and delete punch records when corrections are needed.
SQL Server Persistence
Stores users, shifts, and time entries using a relational SQL Server database structure.
Responsive Interface
Built with a responsive layout so the application can be used comfortably on desktop and tablet-sized screens.
Interface preview
Application screenshots
Stack implementation
Technical highlights
ASP.NET Core APIs
Built API endpoints for employee attendance actions, authentication workflows, and administrative data access.
SQL Server data model
Designed relational tables for users, shifts, and time entries so attendance data could be stored, validated, and queried consistently.
React and TypeScript frontend
Developed dashboard views with reusable components and typed data handling for employee and administrative workflows.
Problem solving
Challenges & lessons learned
- State management:Keeping frontend state aligned with backend attendance records emphasized the value of predictable update flows.
- Authentication flow:The project provided hands-on experience with login state, protected routes, and role-based access across frontend and backend boundaries.
- Local orchestration:.NET Aspire helped coordinate frontend and backend services during development.
Planned enhancements
Future improvements
- 01Password recovery workflow
- 02Email notifications
- 03Manager approval workflows
- 04Payroll CSV export
- 05Deployment improvements
Continue exploring
Explore moreengineering projects.
Browse additional full-stack applications, production websites, and software projects covering APIs, databases, testing, deployment, and maintainable system design.
Back to projects