The todo app that makes you WANT to be productive.
Horizontal scrollable timeline · Retro terminal aesthetic · 5-layer parallax · Local-first with optional auth
Part of the Tooduu ecosystem: Web App (this repo) · MCP Server (AI assistant bridge)
Horizontal timeline with glowing selected card, parallax SVG background, and terminal-style UI
Every developer has built a todo app. None of them look like this.
- Not another boring todo list — it's a horizontal timeline you scroll through like a sci-fi interface
- Visual dopamine — 5-layer parallax, animated glowing borders, mouse-following light, neon everything
- Actually useful — works without signup (localStorage), optional auth syncs across devices
Think of it as if someone from 2087 traveled back in time and built a todo app using terminal technology.
TOODUU is a horizontal-scrolling todo timeline wrapped in a retro-terminal aesthetic. Navigate through past and future dates, add tasks, and watch your productivity unfold across a sci-fi command line interface.
|
|
|
|
Frontend → Next.js 16 (App Router) + TypeScript + Tailwind CSS 4
Animations → Framer Motion + CSS keyframes
Icons → Lucide React
Auth → JWT (jose) + httpOnly cookies + bcryptjs
Database → SQLite (better-sqlite3) — zero config, file-based
Deployment → Docker + Traefik reverse proxy + Let's Encrypt SSL
git clone https://github.com/yatindma/TooDuu.git
cd TooDuu
npm install
npm run devOpen http://localhost:3000 — that's it. No database setup. SQLite creates itself.
docker compose up -d --build┌─────────────────────────────────────────┐
│ Browser │
│ localStorage (anonymous) │
│ OR API calls (authenticated) │
└──────────────┬──────────────────────────┘
│
┌───────────▼───────────┐
│ Next.js 16 Server │
│ │
│ /api/auth/login │
│ /api/auth/register │
│ /api/auth/me │
│ /api/auth/logout │
│ /api/todos (CRUD) │
│ │ │
│ ┌──────▼──────┐ │
│ │ SQLite │ │
│ │ (WAL mode) │ │
│ └─────────────┘ │
└───────────────────────┘
src/
├── app/
│ ├── api/
│ │ ├── auth/ # login, register, me, logout
│ │ └── todos/ # GET, POST, PATCH, DELETE
│ ├── globals.css # Terminal theme + keyframe animations
│ ├── layout.tsx # Root layout with AuthProvider
│ └── page.tsx # Main timeline page
├── components/
│ ├── auth-modal.tsx # Login/Register modal
│ ├── date-card.tsx # Individual date card with todos
│ ├── migrate-modal.tsx # localStorage → DB migration prompt
│ └── terminal-background.tsx # 5-layer parallax SVG background
├── hooks/
│ └── use-todos.ts # Smart hook: API or localStorage
└── lib/
├── auth-context.tsx # Auth provider + hooks
├── db.ts # SQLite schema + connection
├── get-user.ts # Server-side JWT verification
└── types.ts # Todo, DayData types
Deploy TOODUU on your own server in under 5 minutes. No external database, no Redis, no config hell — just Docker.
# 1. Clone
git clone https://github.com/yatindma/TooDuu.git
cd TooDuu
# 2. Create your docker-compose.yml
cp docker-compose.example.yml docker-compose.yml
# 3. Edit: set your domain and a random auth secret
# AUTH_SECRET → any random string (e.g. openssl rand -hex 32)
# Host rule → your domain
nano docker-compose.yml
# 4. Start
docker compose up -d --build
# 5. Verify
curl http://localhost:3000
# → HTML response = it's workingdocker-compose.yml example
services:
tooduu:
build: .
container_name: tooduu
restart: unless-stopped
ports:
- "3000:3000" # Remove if using Traefik
environment:
- NODE_ENV=production
- AUTH_SECRET=your-random-secret-here # CHANGE THIS
volumes:
- tooduu-data:/app/data # SQLite persisted here
volumes:
tooduu-data:With Traefik (auto HTTPS)
services:
tooduu:
build: .
container_name: tooduu
restart: unless-stopped
environment:
- NODE_ENV=production
- AUTH_SECRET=your-random-secret-here # CHANGE THIS
volumes:
- tooduu-data:/app/data
networks:
- traefik-proxy
labels:
- "traefik.enable=true"
- "traefik.http.routers.tooduu.rule=Host(`todos.yourdomain.com`)"
- "traefik.http.routers.tooduu.entrypoints=websecure"
- "traefik.http.routers.tooduu.tls=true"
- "traefik.http.routers.tooduu.tls.certresolver=letsencrypt"
- "traefik.http.services.tooduu.loadbalancer.server.port=3000"
volumes:
tooduu-data:
networks:
traefik-proxy:
external: truegit clone https://github.com/yatindma/TooDuu.git
cd TooDuu
npm install
npm run build
AUTH_SECRET=your-random-secret-here NODE_ENV=production npm startSQLite auto-creates in ./data/ — no database setup needed.
Want Claude or ChatGPT to manage your self-hosted todos? Deploy the Tooduu MCP Server alongside:
git clone https://github.com/yatindma/tooduu-mcp.git
cd tooduu-mcp
cp .env.example .env
# Set TOODUU_API_URL to your web app URL
# Set MCP_BASE_URL to your MCP server's public URL
docker compose up -d --buildThen add the MCP URL to Claude: https://mcp.yourdomain.com/mcp
Same account, same todos. Sign in once — your todos sync between the web app and AI assistants automatically.
| Variable | Required | Default | Description |
|---|---|---|---|
AUTH_SECRET |
Yes | — | Secret for JWT signing. Use openssl rand -hex 32 to generate. |
NODE_ENV |
No | development |
Set to production for optimized build |
PORT |
No | 3000 |
Server port |
/app/data/
├── tooduu.db # All users + todos (SQLite, WAL mode)
├── tooduu.db-wal # Write-ahead log
└── tooduu.db-shm # Shared memory
Mount /app/data as a Docker volume to survive container rebuilds.
Contributions are welcome! Feel free to:
- Fork the project
- Create your feature branch (
git checkout -b feat/amazing-feature) - Commit changes (
git commit -m 'feat: add amazing feature') - Push to branch (
git push origin feat/amazing-feature) - Open a Pull Request
This project follows Semantic Versioning (MAJOR.MINOR.PATCH):
| Bump | When | Example |
|---|---|---|
PATCH (0.1.X) |
Bug fixes | fix: blinking time display |
MINOR (0.X.0) |
New features | feat: add calendar view |
MAJOR (X.0.0) |
Breaking changes | UI overhaul, API redesign |
Current version: 0.2.1 (pre-launch)
v1.0.0 will be tagged at public launch.
MIT — do whatever you want with it.
If this made you go "damn, that's cool" — drop a star. It takes 1 second and helps others find it.
Built with terminal green and an unhealthy amount of caffeine
by Yatin Arora — AI Engineer based in Frankfurt · LinkedIn