Period Tracker
A privacy-first period tracking web app that stores all data locally in the browser — no accounts, no servers, no tracking.
Overview
Period Tracker is a lightweight, privacy-focused web application for tracking menstrual cycles. Unlike commercial period trackers that collect and monetize sensitive health data, this app stores everything locally in the browser using localStorage. No data ever leaves the device.
The app provides cycle predictions, symptom logging, and a visual calendar — all without requiring an account or internet connection after the first load.
Features
- Cycle Tracking: Log period start and end dates with a single tap
- Predictions: Automatically calculates next period and fertile window based on history
- Calendar View: Visual monthly calendar showing period days, predicted windows, and logged data
- Symptom Logging: Track cramps, mood, energy levels, and custom notes per day
- Cycle Statistics: Average cycle length, period duration, and variation analysis
- Data Export: Export all data as JSON for backup or migration
- Privacy First: Zero network requests, no cookies, no analytics — all data stays in localStorage
- Responsive Design: Works on mobile, tablet, and desktop
- Dark Mode: Automatic dark mode based on system preference
Architecture
The app is a single-page client-side application with no build step:
period-tracker.html → Single HTML file with embedded CSS and JS
├── <style> → All styles (CSS custom properties, grid, animations)
├── <main> → App shell (calendar, forms, stats panels)
└── <script> → Application logic (state management, rendering, predictions)
Data is stored in localStorage under the key period-tracker-data as a JSON object.
Tech Decisions
| Decision | Choice | Why |
|---|---|---|
| Framework | Vanilla JS | Zero dependencies, instant load, no build step |
| Storage | localStorage | No server needed, complete privacy, works offline |
| Styling | Embedded CSS | Single file deployment, no external requests |
| Calendar | Custom grid | Full control over rendering, no library bloat |
| Predictions | Average-based | Simple, reliable algorithm using historical data |
Real-World Impact
This app solves a real privacy problem. Most period tracking apps collect sensitive health data and sell it to advertisers. This app provides the same core functionality with zero data collection. Users can track their cycles without worrying about who has access to their health information.
Measured Results
- Zero network requests after initial page load
- < 5KB total file size
- Works offline after first visit
- No cookies, no analytics, no tracking
- Data persists across browser sessions
Conclusion
Period Tracker demonstrates that useful health apps don't need to compromise on privacy. By leveraging modern browser storage and keeping everything client-side, it provides real utility without the surveillance overhead of commercial alternatives.