I'm a product designer and developer. A few months ago I decided to build a side project - a comprehensive collection of free time tools that could generate organic traffic through programmatic SEO. The result is Timerjoy — 1,182+ pages across 37 categories, all statically generated with Next.js 16.
Here's how it works and what I learned.
The Concept
Take a category like "timers" and generate pages programmatically. A 1-minute timer, 5-minute timer, 25-minute timer - each with unique metadata, JSON-LD structured data, and actual functionality. Now multiply that across 37 categories:
- Timers — 1 second to 12 hours, visual, classroom, Pomodoro
- Breathing exercises — Box Breathing, 4-7-8, Wim Hof
- Fitness timers — HIIT, Tabata, Boxing rounds
- Chess clocks — Blitz, Rapid, Classical
- Sunrise/sunset — for 348 US cities
- Moon phases — current phase + monthly calendar
- 64 holiday countdowns — Christmas, Ramadan, Diwali, and more
- Date calculators, world clock, caffeine calculator, tea timer, meditation timer...
Every page is a real, working tool — not SEO filler.
The Stack
| Layer | Technology |
|---|---|
| Framework | Next.js 16 (App Router) |
| Language | TypeScript |
| Styling | Tailwind CSS 4 + custom design system |
| Deployment | Vercel (Edge Network) |
| Rendering | Static Generation (SSG) |
How 1,182 Pages Get Built
The core of programmatic SEO in Next.js is generateStaticParams():
- Define data arrays (348 cities, 64 holidays, timer presets, etc.)
- Each array feeds a dynamic route like
/sunrise-sunset/[city] - Next.js generates all pages at build time
- Every page gets unique metadata, structured data (JSON-LD), and content
The result: 1,182 fully static HTML pages, served from Vercel's edge network. Average page load: under 200ms.
Adding a new category is straightforward — define the data, create the route, and the build system handles the rest. When I added sunrise/sunset data for US cities, it generated 348 new pages automatically.
The Design System
I wanted something that felt different from the typical SaaS look. The entire UI is inspired by vintage Braun products — Dieter Rams' "less, but better" philosophy.
The design system has a few core components:
- braun-panel — light outer container with subtle shadows
- braun-display — dark screen area, like a calculator LCD
- braun-btn-orange — the iconic Braun orange accent
- Indicator dots — tiny LED-style state indicators
Everything uses a warm cream palette (#f4f4f2), deliberate spacing, and minimal typography. No gradients, no glassmorphism — just clean functional design.
Building a consistent design system early on was one of the best decisions. Every new tool uses the same components, so adding features takes hours instead of days.
SEO Infrastructure
Each page gets:
-
Dynamic
<title>and<meta description>— unique per page, keyword-targeted - JSON-LD structured data — WebApplication, FAQPage schemas
- Canonical URLs — preventing duplicate content
- Automatic sitemap — generated at build time
- Cross-links — related tools link to each other, building internal link structure
The sitemap alone is massive — 1,182 URLs that Google needs to discover and crawl.
Early Results
The site launched recently. First week in Google Search Console:
- 27,900 impressions — Google is showing pages in search results
- Sunrise/sunset and moon phases are the strongest categories so far
- Most pages are still in Google's crawl queue — with 1,182 URLs, it takes time
The foundation is there. As Google indexes more pages and the domain builds authority, traffic should compound.
Lessons Learned
1. Static wins for tools. Users want instant results. Static pages load faster than any server-rendered alternative. The tradeoff (longer build times) is worth it.
2. Design systems compound. Investing in a consistent component library early meant every new tool category was fast to build and visually consistent.
3. Programmatic SEO is a long game. Google doesn't index 1,182 pages overnight. Patience and proper technical SEO (sitemaps, structured data, canonicals) matter more than content volume.
4. Zero-friction UX matters. No sign-up walls, no cookie banners, no "subscribe to continue" popups. Just tools that work. Users stay longer when there's nothing in their way.
What's Next
- PWA support (install as app)
- Custom timer presets
- Sound themes
- More international holidays
- Multi-language support
Try It
Timerjoy is completely free — no accounts, no ads. The project overview is on GitHub.
I'd love to hear feedback — what would you add to a tool like this?
Top comments (1)
This is a great example of doing pSEO the right way — real tools, not empty pages. I’ve built a tools site too, and one thing I noticed is internal linking between related tools makes a huge difference in indexing speed. Also agree 100% on static — users expect tools to open instantly, even small delays reduce trust.