Time Tracker

Project Overview

A modern, full-stack time tracking application designed for freelancers and consultants to efficiently track client work hours. Built from scratch with real-time data subscriptions, guest authentication, and visual progress tracking toward weekly and monthly goals.

Try the webapp →

The Challenge

Freelancers and consultants need a simple, fast way to track billable hours across multiple clients — without the overhead of creating accounts or configuring complex software. Existing tools are either too bloated or require paid subscriptions for basic functionality.

Requirements:

• Start tracking time instantly without sign-up friction
• Manage entries across multiple clients with full CRUD operations
• Visualize progress toward weekly (40h) and monthly (320h) goals
• Work seamlessly on desktop and mobile

Solution: Real-Time Full-Stack App

Core Functionality

• Real-time Time Tracking — Start/stop timer with live elapsed time display
• Client Management — Autocomplete suggestions for recurring client names
• Entry Management — Full CRUD operations with edit and delete capabilities
• Progress Tracking — Weekly and monthly hour progress with visual indicators
• Undo Support — Restore deleted entries with a single click

User Experience

• Guest Authentication — Quick start without account creation via Convex Auth anonymous sessions
• Session Management — 2-hour guest sessions with visual countdown
• Responsive Design — Works seamlessly on desktop and mobile devices
• Dark/Light Mode — Theme support via next-themes
• Toast Notifications — Celebrations when reaching weekly goals

Security & Rate Limiting

• Device Fingerprinting — Prevents abuse of guest sign-in
• Entry Limits — 10 entries for guest users to manage resources
• Data Isolation — User-specific data with proper authorization checks on every query and mutation

Technical Architecture

Frontend Stack

Backend Stack

Database Schema

├── users (auth)           # User accounts
├── rateLimits             # Rate limiting for guest sign-ins
├── guestSessions          # 2-hour session tracking
└── timeEntries            # Core time tracking data
    ├── userId             # User association
    ├── clientName         # Client identification
    ├── task               # Task description
    ├── notes              # Additional notes
    ├── startTime/endTime  # Timestamps
    ├── durationSeconds    # Calculated duration
    ├── durationHours      # Decimal hours
    └── isActive           # Tracking status

Key Components

Backend Functions

• Queries: list, getActive, getWeeklyHours, getMonthlyHours, getDistinctClientNames
• Mutations: start, stop, update, remove, restore

Results

Lessons Learned

1. Convex simplifies real-time dramatically — Subscriptions just work out of the box. No WebSocket setup, no cache invalidation — the UI updates instantly when data changes.

2. Guest auth needs guardrails — Anonymous access is great for reducing friction, but rate limiting and entry caps are essential to prevent abuse.

3. Visual progress drives engagement — The weekly/monthly progress bars with color-coded status (blue, yellow, green) turned a utility app into something motivating to use.

4. Zod + TypeScript is a strong pairing — Runtime validation on the frontend catches issues before they hit the backend, while TypeScript ensures type safety across the entire stack.