FeaturesTemplatesShowcaseTownie
AI
BlogDocsPricing
Log inSign up
neverstew
neverstewthirdTimer
Remix of nbbaier/thirdTimer
Public
Like
1
thirdTimer
Home
Code
6
backend
1
frontend
3
shared
1
README.md
article.md
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
/
Code
/
Search
index.ts
https://neverstew--4a7bcf6afab04ddd9ca42aea7ac1f4d0.web.val.run
README.md

Third Time - Productivity Timer

A minimalist web app implementing the "Third Time" productivity method with rich visual feedback.

The Method

  • Work for as long or short as you like, until you want or need to break
  • Break for up to one-third of the time you've just worked
  • Save unused break time for later
  • Handle interruptions and big breaks (meals)

Features

  • Flexible work/break timing
  • Break time banking system with visual time bank
  • Interruption handling
  • Big break support for meals
  • Clean, distraction-free interface with rich visual feedback
  • Customizable break fractions (1/2, 1/3, 1/4, 1/5, 1/6)

Visual Features

  • Circular Progress Indicators: Real-time visual progress for work and break sessions
  • Time Bank Visualization: Saved break time represented as collectible gems/coins
  • Progress Bars: Visual representation of work vs break time accumulation
  • Efficiency Meter: Color-coded circular progress showing session efficiency
  • Work/Break Ratio Bar: Visual split showing time distribution
  • Interactive Fraction Settings: Visual representation of work-to-break ratios

Usage

  1. Click "Start Working" to begin a work session
  2. Watch the circular progress indicator fill as you work
  3. Click "Take Break" when you want to stop working
  4. The app calculates your earned break time (work time ÷ fraction)
  5. See your banked time as visual gems in the Time Bank
  6. Take your break and click "Resume Work" when ready
  7. Any unused break time is saved and visualized for later

Project Structure

├── frontend/
│   ├── index.html          # Main app interface
│   ├── index.tsx           # React app with visual components
│   └── style.css           # Styling with animations
├── backend/
│   └── index.ts            # Static file server
└── shared/
    └── types.ts            # Shared TypeScript types
HTTP
  • index.ts
    neverstew--4a…d0.web.val.run
Code
backendfrontendsharedREADME.mdarticle.mdmain.tsx
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.