Local-first PWA / Project 12
SelfNest
Local-first PWA · Daily check-ins, flexible routines, and reflection
Project focus
An implemented local MVP connecting daily check-ins, routines, history, and backup flows. The interface distinguishes a save on this device from cloud synchronization and keeps personal entries available offline after the first successful load.
- Mobile UI
- Offline flows
- State & recovery
- VI / EN
- Context
- Independent project · Frontend & PWA
- Project status
- Local MVP
- Tools & technologies
- React · TypeScript · Vite · Tailwind CSS · Radix · Dexie · i18next · PWA
Try the interface
A little of the app,
right here.
An interactive mockup adapted from the project’s frontend. Explore the controls with sample data; reset to try the flow again.
YOUR DAILY LANDING PLACE
A fresh start,
at your pace.
Your daily rhythm
1/3Try a check-in or complete a routine.
Portfolio preview · sample changes reset on reload.
01 / The project
The experience
in context.
SelfNest brings a day’s check-in, routines, and reflection into a calm personal workspace designed first for Android. Today provides an entry point into the next task; history and weekly summaries provide a way to look back. Local records work without cloud configuration. The repository includes synchronization code, but a deployed cloud connection and device validation are still pending.
The user flow
- 01Open Today
- 02Record a daily check-in
- 03Complete or skip a routine
- 04Undo a change if needed
- 05Review history
- 06Export or restore a backup
02 / The making
What went
into it.
A check-in that protects unfinished work
Mood, energy, sleep, priority, and notes share one form. Validation explains missing or invalid input, while navigation guards let the person decide what to do with unsaved edits.
Reversible routine actions
Routine rows expose completed, skipped, and pending states. Completion and skip actions have an undo path, and the visible status changes with the saved occurrence rather than depending only on a decorative checkmark.
Offline behavior made understandable
Device storage supports local entries, and the production PWA caches application assets for reopening offline after an initial load. Settings distinguish local saves from cloud availability; JSON export and import provide a separate backup path.
One visual and language system
Shared components, appearance tokens, light and dark themes, and English/Vietnamese resources connect the main screens and dialogs. Date and number formatting follow the selected locale while personal notes keep their original text.