Local-first active recall app with dual-persistence (LocalStorage + Postgres) and deterministic mastery logic.

Abstract
I have developed LetMeCook Web—a high-performance, privacy-focused, deterministic active memory system. By designing an advanced, two-tier data persistence architecture that combines LocalStorage with PostgreSQL, the application provides a learning environment that enforces cognitive stimulation without the reliability issues typical of platforms operating exclusively in the cloud.
Problem
Standard flashcard applications often suffer from architectural and pedagogical flaws:
- Algorithmic passivity: Many platforms automate mastery based on simple hit rates, allowing users to pass cards by luck rather than deep cognitive effort.
- The durability paradox: Modern learners demand the speed and privacy of locally running apps, yet they also need the synchronization and sharing features available in cloud-based systems.
- Platform Costs: Platforms like Anki are free but lack sharing and synchronization features, while platforms like Quizlet are paid and offer limited functionality.
- Issues with creating flashcards: Many platforms offer only basic flashcard formats, without the ability to add images, formulas, etc., which makes learning STEM subjects difficult.
- Lack of AI integration: There is no ability to easily create high-quality flashcards using AI based on academic materials such as PDFs, websites, etc., or this functionality is, again, paid.
Solution
I have developed a robust, secure Next.js implementation that prioritizes user sovereignty and high-retention learning. The system uses a custom abstract storage layer that seamlessly supports both strictly private guest sessions via LocalStorage and persistent, shared data via Neon PostgreSQL and Drizzle ORM.
The core philosophy is based on Deterministic Mastery—a manual, 5-level assessment system that enforces rigorous self-assessment.
Features
- Deterministic Mastery Assessment: A manual grading system (New, Don’t Know, Somewhat, Understand, Mastered) has been implemented, which forces active brain stimulation through self-assessment, rather than passive, automatic right/wrong logic.
- Fisher-Yates algorithm integration: A built-in engine for randomizing learning sessions using the Fisher-Yates algorithm eliminates the “position memory” effect, ensuring that users truly learn the content rather than its order.
- Hybrid state abstraction: I created a hybrid data synchronization model that enables instant (sub-10ms) updates to the application’s state for both guests and cloud users, ensuring consistent system responsiveness.
- Data migration engine: I designed a dedicated process that automatically validates and transfers user data from the browser’s local storage (LocalStorage) to a relational database upon account registration
- Educational UX enhancements: Integrated LaTeX rendering for technical content, support for images in flashcards, and Text-to-Speech (TTS) support, eliminating barriers to learning and ensuring full accessibility of the application for users.
Tech Stack
| Category | Technologies Used |
|---|---|
| Framework | Next.js 16 (App Router), React 19 |
| Persistence | Neon PostgreSQL, LocalStorage API |
| ORM & Database | Drizzle ORM, Server Actions |
| Styling & UI | Tailwind CSS 4, Framer Motion, Radix UI |
| Utilities | LaTeX (MathJax/KaTeX), Lucide React |
The "Why": Overcoming Technical Challenges
Challenge: Synchronizing Ephemeral and Persistent States Managing state consistency between a synchronous local storage and an asynchronous PostgreSQL backend introduced significant race conditions and schema drift risks, especially during the "guest-to-user" transition.
Solution: I architected a debounced persistence adapter that treats LocalStorage as a high-speed write-through cache. For the migration process, I built a custom Migration Engine that:
- Performs a runtime validation of the guest's JSON schema using TypeScript guards.
- Transforms flat LocalStorage Decks into relational
projectsandflashcardstables. - Executes a transactional batch insert to ensure data integrity, preventing partial migrations if a network error occurs.
Challenge: Server Action Resource Abuse Exposing card creation via Server Actions made the database vulnerable to automated brute-force attacks or "junk deck" generation.
Solution: I implemented an in-memory Rate Limiter on the server side. By tracking client signatures and request frequency, the system can transparently throttle abusive traffic without requiring an external Redis instance, maintaining the project's lean, high-performance architecture.
Results & Impact
- Availability: Delivered 100% offline capability, allowing users to maintain consistency regardless of internet connectivity.
- Scale: Successfully migrated hundreds of test cards from local environments to the cloud database with zero data loss.
- Learning Efficiency: Integrated scientific tools (LaTeX/TTS) that significantly broadened the app's utility for STEM students.