Manage Work at the Speed of Zen Flow
A highly optimized, brutally minimal, real-time Kanban board with built-in deep-work tools.
taskly.muhammadumer.xyz — Free to use, no credit card required.
Create an account with your email or sign in instantly via GitHub OAuth.
Taskly is a premium, dark-mode-first task management application designed for people who want to stay in the zone. It strips away the enterprise bloat found in tools like Jira or Asana and replaces it with a beautiful, lightning-fast UI that updates in real time across all your devices.
No subscriptions. No AI upsells. Just your board, your tasks, and your flow.
| Feature | Description |
|---|---|
| ⚡ Real-time Sync | Move a card on your phone and it instantly moves on your desktop via WebSockets — zero polling, zero lag. |
| 🧘 Zen Focus Mode | A full-screen 25-minute Pomodoro timer that locks you in on one task at a time. Auto-completes the task when the timer fires. |
| 🧠 Smart Workflow | Tasks scheduled for today automatically transition to In Progress. Missed deadlines surface as Overdue, no manual updates needed. |
| 🔎 Instant Global Search | Filter your entire board by title, status, or date as you type, no page reloads, no delays. |
| 📱 Mobile-First Design | Fully responsive with fluid drawer interactions built for touch from day one. |
| 🔐 Dual Auth | Sign up with email/password or authenticate instantly with your GitHub account via OAuth. |
Taskly intentionally avoids heavy frontend frameworks (React, Vue, Next.js) in favor of a lean, modularized Vanilla TypeScript approach. This results in near-instant load times, minimal memory consumption, and a codebase that is simple to reason about.
| Technology | Role |
|---|---|
| Python 3 & Flask | Lightweight API server and WebSocket host |
| SQLAlchemy | ORM for clean, Pythonic database interaction |
| Flask-SocketIO | Bidirectional real-time communication |
| uv | Hyper-fast Python package management and virtual environment resolution |
| Technology | Role |
|---|---|
| Vanilla TypeScript | Modularized, type-safe client logic, no Virtual DOM overhead |
| Bun | Ultra-fast bundler and script runner |
| Tailwind CSS v4 | Utility-first styling with a minimal compiled footprint |
| GSAP | Scroll animations and particle canvas on the landing page |
| SortableJS | Smooth, accessible drag-and-drop for the Kanban board |
taskly/
├── app/ # Backend Logic (Python/Flask)
│ ├── __init__.py # Application factory
│ ├── extensions.py # DB, SocketIO, and OAuth initialisations
│ ├── models.py # Database schema (User, Task)
│ ├── routes.py # Main API and frontend route handlers
│ ├── routes_auth.py # Authentication (GitHub OAuth & Email)
│ └── sockets.py # WebSocket event listeners
├── src/ # Frontend Source (TypeScript + CSS)
│ ├── css/
│ │ └── src.css # Tailwind v4 entrypoint
│ └── js/
│ ├── api.ts # Network abstraction (Fetch wrappers)
│ ├── focus.ts # Zen Mode Pomodoro timer logic
│ ├── main.ts # Core initialization and DOM binding
│ ├── toast.ts # Custom notification system
│ ├── types.ts # Shared TypeScript interfaces
│ └── ui.ts # Direct DOM manipulation handlers
├── static/ # Compiled Outputs (gitignored in dev)
│ ├── css/ # Tailwind-compiled CSS
│ └── js/ # Bun-bundled JavaScript
├── templates/ # Jinja2 HTML Views
│ ├── macros/
│ │ └── ui.html # Reusable Jinja2 UI macros
│ ├── index.html # Animated marketing landing page
│ ├── dashboard.html # Main Kanban app view
│ ├── login.html # Auth view
│ └── register.html # Auth view
├── main.py # Server entrypoint
├── pyproject.toml # Python project config
└── package.json # Bun scripts and frontend dependencies
- Separation of Concerns:- Python logic lives strictly in
app/. TypeScript and Tailwind live strictly insrc/. They never mix. - Build Isolation:-
src/is raw source material.static/holds only compiled artifacts, exactly where Flask expects them. - Maintainability:- Splitting the client into semantic modules (
focus.ts,api.ts,ui.ts) means a developer can isolate any feature in seconds rather than scanning a 2,000-line monolith.
- Python 3.12+ with
uvinstalled - Bun installed
git clone https://github.com/developmentwithumer/Taskly.git
cd Taskly# Python backend
uv venv
uv sync
# Frontend (TypeScript + Tailwind)
bun installCreate a .env file in the project root:
SECRET_KEY=your-secret-key-here
GITHUB_CLIENT_ID=your-github-oauth-app-client-id
GITHUB_CLIENT_SECRET=your-github-oauth-app-client-secret
DATABASE_URL=sqlite:///taskly.db # or your preferred DB URL
DEBUG=true # for development
RUN_DB_CREATE_ALL=true # create db and tables upon application startup.
OAUTH_ALLOW_INSECURE=true # this will allow to sign in over http useful for local developmentYou'll need three terminal sessions running simultaneously:
# Terminal 1 — Flask backend
uv run main.py
# Terminal 2 — TypeScript bundler (watch mode)
bun run watch:js
# Terminal 3 — Tailwind CSS compiler (watch mode)
bun run watch:cssThen open http://127.0.0.1:5000.
Show, Don't Tell:- Information hierarchy is paramount. Color is used strictly for meaning: Cyan = Focus, Green = Done, Red = Overdue. Nothing is decorative without purpose.
Speed Above All:- Interactions are optimistic. When a user drags a task, the UI responds instantly. The network request resolves gracefully in the background. Failure states roll back silently.
Focus on the Work:- No excessive popups. No AI upsells. No complex permission systems. Just you, your board, and your flow.
"Your most productive day begins with a single step."
Contributions, issues, and feature requests are welcome. Feel free to check the issues page.
- Fork the repo
- Create a feature branch (
git checkout -b feature/your-feature) - Commit your changes (
git commit -m 'Add your feature') - Push to the branch (
git push origin feature/your-feature) - Open a Pull Request
Distributed under the MIT License. See LICENSE for details.
Built with focus, for people who focus. · taskly.muhammadumer.xyz