The todo app that makes you WANT to be productive.
Horizontal scrollable timeline · Retro terminal aesthetic · 5-layer parallax · Local-first with optional auth
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
TOODUU runs on Docker with Traefik as reverse proxy:
# docker-compose.yml highlights
services:
tooduu:
build: .
labels:
- "traefik.enable=true"
- "traefik.http.routers.tooduu.rule=Host(`your-domain.com`)"
- "traefik.http.routers.tooduu.tls.certresolver=letsencrypt"
volumes:
- tooduu-data:/app/data # Persistent SQLiteContributions 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
