Back to home

03 / Personal Project

Dear Memory.

A local-first diary app for private reflection — with a rich writing editor, mood analytics, calendar view, PowerGrid time audit, weather capture, writing prompts, and zero-backend data ownership.

Live Demo GitHub

01 / Overview

Dear Memory is a privacy-first diary application built around mindful writing and personal insight. Everything — entries, moods, time audits, and settings — lives entirely on the user's device with no cloud, no tracking, and no backend.

The app has grown into a complete personal OS for reflection: a rich writing editor with focus mode, templates, and weather capture; a calendar view with mood indicators; a Trends dashboard for writing streaks and mood analytics; and a PowerGrid tool that applies the 80/20 principle to how users spend their time.

02 / My Role & Tech

My Role

Sole Developer. I designed the entire product — writing editor, local data model, calendar, mood analytics dashboard, PowerGrid productivity tool, theme system, autosave behavior, and backup/restore flow.

Stack

ReactReact Router v6Dexie.jsIndexedDBFramer MotionRechartsLenisCSS VariablesDate-fnsLodash DebounceReact Icons

03 / UI/UX Decisions

I wanted Dear Memory to feel like a complete personal tool — not just a notes app. Every surface was designed to reduce friction and encourage return visits.

  • • Focus Mode with keyboard shortcuts (Ctrl+Enter to save, Escape to exit) removes all distractions while writing
  • • Debounced autosave with a live ambience bar showing word count, reading time, and session duration
  • • Daily writing prompts and entry templates lower the activation energy to start
  • • Weather capture stamps ambient context onto each entry automatically
  • • Calendar view with per-day mood color dots makes the archive feel spatial and emotional
  • • Trends dashboard shows streaks, average mood, and tag frequency across weekly and monthly views
  • • PowerGrid applies the 80/20 rule to time — Time Audit, Value Ladder, and 80/20 Insights help users see where their hours actually go
  • • Multiple themes and typography options make the app feel personally owned

04 / Technical Challenges

Multi-Collection Local Persistence

The app stores four distinct data types — entries, settings, PowerGrid activities, and time blocks — all in IndexedDB via Dexie.js. The JSON export and restore flow covers every collection so users can migrate or back up without losing anything.

Autosave Performance

Writing to IndexedDB on every keystroke would hurt responsiveness. I used Lodash debounce with a 1-second delay so the editor feels instant while writes are batched efficiently.

Analytics Without a Backend

The Trends page computes streaks, mood averages, and tag frequency entirely on the client by querying IndexedDB. Recharts renders the results into weekly/monthly mood line charts and bar graphs — no server required.

PowerGrid Snapshot System

The time audit tool lets users save and restore weekly snapshots of their activity data. Keeping snapshots isolated from the live state required careful separation in the Dexie schema to avoid destructive overwrites on restore.

05 / What I Learned

Dear Memory pushed me far beyond a basic CRUD app. Building analytics, a calendar, and a time-audit tool — all without a backend — taught me to treat IndexedDB as a real database and design data schemas that support complex queries on the client. I also learned how much product thinking goes into reducing the friction of a daily habit: prompts, templates, weather context, and smooth transitions all exist to make opening the app feel worthwhile every day.


Previous Project

Journal

Next Project

Color Palette Generator

Back to home

Frontend engineer building fast, reliable marketplace experiences across product, platform, and performance.