X To-Do Corp 🚀

A Modern, Feature-Rich Task Management Application

Features • Demo • Installation • Usage • Tech Stack • Contributing

📋 Overview

X To-Do Corp is a powerful, Twitter/X-inspired task management application that combines elegant design with robust functionality. Built with modern web technologies, it offers a seamless experience for managing tasks, notes, and tracking productivity.

✨ Features

🎯 Core Functionality

Smart Task Management - Create, edit, and organize tasks with ease
Subtasks & Checklists - Break down complex tasks into manageable steps
Priority Levels - High, Medium, Low priority with visual indicators
Due Dates & Reminders - Never miss a deadline with smart notifications
Recurring Tasks - Daily, weekly, monthly task automation
Tags & Categories - Organize tasks with custom tags and colors

📝 Notes System

Rich Note Editor - Create and manage detailed notes
Markdown Support - Format your notes with markdown syntax
Pin Important Notes - Keep critical information at the top
Search & Filter - Quickly find any note or task

🏆 Gamification

Achievement System - Unlock 20+ achievements
Productivity Stats - Track your progress over time
Contribution Graph - GitHub-style activity visualization
Spotlight Achievements - Showcase your accomplishments

🎨 Customization

Light & Dark Mode - Easy on the eyes, day or night
6 Accent Colors - Sky, Pink, Green, Orange, Purple, Yellow
Responsive Design - Perfect on desktop, tablet, and mobile
Theme Preview - See changes before applying

⏱️ Focus Mode

Pomodoro Timer - 25/5 minute work/break cycles
Custom Sessions - Set your own focus durations
Ambient Sounds - Rain, Cafe, Forest backgrounds
Task-Specific Focus - Link focus sessions to tasks

📊 Advanced Features

Calendar View - Visualize tasks by date
Data Export/Import - Backup and restore your data
Offline Support - Works without internet using IndexedDB
Keyboard Shortcuts - Power user productivity
Image Attachments - Add visual context to tasks

🎬 Demo

Live Preview

Visit the live app: https://x-to-do-corp.pages.dev/

Try It Yourself

# Clone and run locally
git clone https://github.com/H3m0rv1ch1/x-to-do-corp.git
cd x-to-do-corp
npm install
npm run dev

Visit http://localhost:3000 to see the app in action!

🚀 Installation

Prerequisites

Node.js 16+ and npm/yarn
Modern web browser (Chrome, Firefox, Safari, Edge)

Quick Start

# Clone the repository
git clone https://github.com/H3m0rv1ch1/x-to-do-corp.git

# Navigate to project directory
cd x-to-do-corp

# Install dependencies
npm install

# Start development server
npm run dev

Build for Production

# Create optimized production build
npm run build

# Preview production build
npm run preview

Desktop App (Windows/macOS/Linux)

# Run desktop app in development
npm run tauri:dev

# Build desktop app (.exe for Windows)
npm run tauri:build

The built executable will be in src-tauri/target/release/bundle/

📱 Usage

Creating Your First Task

Click the "Add Task" button or press A or N
Type your task description
Optionally add:
- 📅 Due date
- 🏴 Priority level
- 🏷️ Tags
- 📎 Image attachment
- ✅ Subtasks
Press "Add Task" to save

Keyboard Shortcuts

Shortcut	Action
`A` or `N`	Add new task
`H`	Go to Home
`P`	Go to Profile
`C`	Go to Calendar
`O`	Go to Notes
`S`	Go to Settings
`/`	Focus search
`?`	Show shortcuts
`Esc`	Close modals

Focus Mode

Click the play icon on any task
Set your focus duration
Choose ambient sound (optional)
Click "Start Focus"
Stay focused until the timer completes!

Notifications

Click-to-focus: clicking a notification focuses the app without changing routes.
Web: focuses the existing tab; opens a new window only if none are open (via Service Worker).
Tauri desktop: unminimizes, shows, and focuses the window for a smooth, non-disruptive bring-to-front.
Permissions: enable notifications when prompted or via Settings.
Optional routing: notifications can be configured to open a specific screen if desired.

🛠️ Tech Stack

Frontend

React 19 - UI library with latest features
TypeScript - Type-safe development
Vite - Lightning-fast build tool
TailwindCSS - Utility-first styling
Tauri - Desktop app framework (Rust + WebView)

State Management

React Context API - Global state management
Custom Hooks - Reusable logic

Data Persistence

Dexie.js - IndexedDB wrapper for offline storage
LocalStorage - Theme and preferences

Additional Libraries

React Icons - Beautiful icon set
date-fns - Date manipulation (if used)

📁 Project Structure

x-to-do-corp/
├── src/
│   ├── components/
│   │   ├── calendar/      # Calendar and contribution graph
│   │   ├── layout/        # Header, sidebars, navigation
│   │   ├── modals/        # Modal dialogs
│   │   ├── notes/         # Notes functionality
│   │   ├── profile/       # Profile and achievements
│   │   ├── settings/      # Settings components
│   │   ├── todo/          # Task management
│   │   └── ui/            # Reusable UI components
│   ├── contexts/          # React Context providers
│   ├── hooks/             # Custom React hooks
│   ├── services/          # Database and API services
│   ├── types/             # TypeScript type definitions
│   ├── utils/             # Utility functions
│   ├── constants/         # App constants
│   └── assets/            # Static assets
├── src-tauri/             # Tauri desktop app (Rust)
├── public/                # Public assets
├── index.html             # HTML entry point
└── package.json           # Dependencies

🎨 Design Philosophy

X To-Do Corp follows a Twitter/X-inspired design language with:

Clean, minimalist interface
Smooth animations and transitions
Intuitive user interactions
Consistent spacing and typography
Accessible color contrasts

🔒 Privacy & Data

100% Local - All data stored on your device
No Tracking - Zero analytics or tracking scripts
No Account Required - Start using immediately
Export Anytime - Your data, your control

🚢 Deployment

Web (Cloudflare Pages)

The app is configured for Cloudflare Pages deployment. Push to main branch to auto-deploy.

Desktop Releases

Desktop installers are built automatically via GitHub Actions when you create a release tag:

git tag v1.0.0
git push origin v1.0.0

🤝 Contributing

Contributions are welcome! Please follow these steps:

Fork the repository
Create a feature branch (git checkout -b feature/AmazingFeature)
Commit your changes (git commit -m 'Add some AmazingFeature')
Push to the branch (git push origin feature/AmazingFeature)
Open a Pull Request

Development Guidelines

Follow the existing code style
Write meaningful commit messages
Add comments for complex logic
Test your changes thoroughly
Update documentation as needed

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

Inspired by Twitter/X's elegant UI design
Icons from React Icons
Built with love and ☕

📧 Contact

Project Maintainer - @H3m0rv1ch1

Email - moham8ed.atef.23@gmial.com

Project Link - https://github.com/H3m0rv1ch1/x-to-do-corp

Made with ❤️ by developers, for developers

⭐ Star this repo if you find it helpful!

Name		Name	Last commit message	Last commit date
Latest commit History 21 Commits
.github		.github
electron		electron
public		public
src		src
.env.example		.env.example
.gitignore		.gitignore
ARCHITECTURE.md		ARCHITECTURE.md
CHANGELOG.md		CHANGELOG.md
CODE_OF_CONDUCT.md		CODE_OF_CONDUCT.md
CONTRIBUTING.md		CONTRIBUTING.md
DEPLOYMENT.md		DEPLOYMENT.md
DESKTOP_BUILD.md		DESKTOP_BUILD.md
INSTALL_BUILD_TOOLS.md		INSTALL_BUILD_TOOLS.md
LICENSE		LICENSE
README.md		README.md
RELEASE.md		RELEASE.md
SCRIPTS.md		SCRIPTS.md
SECURITY.md		SECURITY.md
capacitor.config.json		capacitor.config.json
index.html		index.html
package-lock.json		package-lock.json
package.json		package.json
tsconfig.json		tsconfig.json
vite.config.ts		vite.config.ts

License

H3m0rv1ch1/x-to-do-corp

Folders and files

Latest commit

History

Repository files navigation