FeaturesTemplatesShowcaseTownie
AI
BlogDocsPricing
Log inSign up
ryi
ryipathfinder__5712n7-bore
Public
Like
pathfinder__5712n7-bore
Home
Code
8
.github
1
backend
2
frontend
6
shared
1
.vtignore
README.md
deno.json
H
main.tsx
Branches
1
Pull requests
Remixes
History
Environment variables
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data โ€“ all from the browser, and deployed in milliseconds.
Sign up now
Code
/
README.md
Code
/
README.md
Search
8/2/2025
Viewing readonly version of main branch: v373
View latest version
README.md

Pathfinder PWA

(Pathfinder - Life & Goal Status At a Glance) A personal dashboard for tracking tasks, habits, and media consumption with offline support and syncing capabilities.

Features

โœ… Tasks & Habits Tracking

  • Weekly grid view showing completion status
  • Support for multiple completions per week
  • Visual indicators with color coding
  • Notes for each completion

๐Ÿ“š Media Progress Tracking

  • Organize by status: inbox, upcoming, in progress, on hold, completed
  • Group by social context: solo, with wife, with friends, etc.
  • Support for books, movies, TV shows, podcasts, games, articles, courses
  • Progress tracking and ratings

๐Ÿ”„ Offline & Sync

  • PWA with offline functionality
  • CRDT-based conflict resolution
  • Audit logging for data integrity
  • Background sync when online

๐Ÿ“ฑ Mobile Optimized

  • Responsive design for iPhone use
  • Touch-friendly interface
  • PWA installable on home screen
  • Smooth animations and interactions

Project Structure

โ”œโ”€โ”€ backend/
โ”‚   โ”œโ”€โ”€ database/
โ”‚   โ”‚   โ”œโ”€โ”€ migrations.ts    # Database schema
โ”‚   โ”‚   โ””โ”€โ”€ queries.ts       # Database operations
โ”‚   โ””โ”€โ”€ index.ts             # Hono API server
โ”œโ”€โ”€ frontend/
โ”‚   โ”œโ”€โ”€ components/          # React components
โ”‚   โ”‚   โ”œโ”€โ”€ App.tsx         # Main app component
โ”‚   โ”‚   โ”œโ”€โ”€ TaskGrid.tsx    # Task tracking grid
โ”‚   โ”‚   โ”œโ”€โ”€ MediaGrid.tsx   # Media tracking grid
โ”‚   โ”‚   โ””โ”€โ”€ *.tsx           # Modal components
โ”‚   โ”œโ”€โ”€ index.html          # PWA manifest
โ”‚   โ”œโ”€โ”€ index.tsx           # React entry point
โ”‚   โ”œโ”€โ”€ manifest.json       # PWA manifest
โ”‚   โ””โ”€โ”€ sw.js               # Service worker
โ”œโ”€โ”€ shared/
โ”‚   โ””โ”€โ”€ types.ts            # Shared TypeScript types
โ””โ”€โ”€ main.tsx                # Val Town entry point

API Endpoints

  • GET /api/tasks - Get all tasks
  • POST /api/tasks - Create new task
  • GET /api/completions - Get task completions
  • POST /api/completions - Mark task as complete
  • GET /api/media - Get all media items
  • POST /api/media - Create new media item
  • PUT /api/media/:id - Update media item
  • POST /api/sync - CRDT sync endpoint
  • POST /api/devices/register - Register device

Technology Stack

  • Backend: Hono + SQLite (Val Town)
  • Frontend: React 18 + TypeScript
  • Styling: Tailwind CSS
  • PWA: Service Worker + Manifest
  • Sync: CRDT with vector clocks
  • Storage: SQLite with audit logging

Usage

  1. Add Tasks/Habits: Click "+ Task" to add new recurring tasks
  2. Track Completion: Tap circles in current week to mark complete
  3. Add Media: Click "+ Media" to track books, shows, etc.
  4. Organize Media: Drag items between status columns
  5. Offline Use: App works offline and syncs when back online

Data Model

Tasks

  • Support for weekly frequency (1x, 2x, 3x per week)
  • Color coding and categorization
  • Completion tracking with notes

Media

  • Type: book, movie, TV show, podcast, game, article, course
  • Status: inbox โ†’ upcoming โ†’ in progress โ†’ on hold โ†’ completed/abandoned
  • Social groups: solo, with wife, with friends, with family
  • Metadata: author, director, genre, progress, ratings

Sync

  • CRDT operations for conflict-free replication
  • Vector clocks for ordering
  • Audit logs for debugging
  • Device registration and management

The app is designed to be information-dense yet beautiful, perfect for quick daily check-ins on your life status.

Go to top
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Product
FeaturesPricing
Developers
DocsStatusAPI ExamplesNPM Package Examples
Explore
ShowcaseTemplatesNewest ValsTrending ValsNewsletter
Company
AboutBlogCareersBrandhi@val.town
Terms of usePrivacy policyAbuse contact
ยฉ 2025 Val Town, Inc.