Getting Started with Your To do List

Welcome! This guide will help you make the most of the To do List application.

How It Works (Under the Hood)

This Todo application is built using modern web technologies, primarily SvelteKit (a framework for building web applications) and Tailwind CSS (for styling).

Important: All your task data (tasks, subtasks, comments, time entries) is stored only in your web browser using a technology called IndexedDB (managed via the Dexie.js library).

This means:

  • Your data is private to you and the specific browser you are using.
  • No data is sent to or stored on any external server.
  • If you clear your browser's site data for this application, your tasks will be permanently deleted from that browser.
  • Your tasks will not automatically sync between different browsers or devices. Use the Export/Import feature to move data manually.

Viewing Your Tasks (Main List)

The main screen shows all your primary tasks. Here's what you can do:

Main Task List View
  • Find Tasks Quickly: Use the Search bar, or filter by Status or Priority using the dropdowns above the list.
  • Change Sort Order: Use the Sort By controls to see tasks ordered by creation date, due date, priority, or title.
  • Filter by Tag: Click on any tag (like work or home) shown on a task. The list will update to show only tasks with that tag. A blue banner will appear showing the active tag filter; click "Clear" on the banner to see all tasks again.
  • See Task Details: Click on a task's title to go to its details page.
  • Quick Edit: Click the Pencil Icon on a task to edit its details directly in the list.
  • Delete Task: Click the Trash Icon to permanently remove a task (and any subtasks it contains). You'll be asked to confirm first.
  • View Subtasks: If a task has subtasks, they appear indented below it, showing their status and title (which links to the subtask's details page) and creation time.
  • Import/Export: Use the Import and Export buttons (top right) to save your tasks to a file or load tasks from a file. Warning: Importing replaces all current tasks.
  • Add a New Task: Click the "+ Add Task" button (top right).

Due Dates View

This view provides a calendar-like overview of your tasks based on their due dates.

Due Dates View Screenshot
  • Layout: Tasks are organized into columns: Overdue, Today, Tomorrow, the next 5 weekdays (e.g., Wed, Thu, Fri, Sat, Sun), Future, and No Due Date.
  • Scrolling: On wider screens, you might need to scroll horizontally (left/right) at the bottom of the columns area to see all date columns. Each column scrolls vertically if it contains many tasks.
  • Filtering: Use the checkboxes at the top to show tasks with specific statuses (defaults to showing 'To Do' and 'In Progress').
  • Sorting: Within each column, tasks are automatically sorted first by Priority (Urgent at the top) and then by their Creation Time (oldest first).
  • Task Cards: Each card displays the task/subtask Title (with parent context if it's a subtask), Due Date, Priority, Status, and any Tags.
  • Navigation: Click on a task card's title to navigate to its full details page. Click on a tag to filter the main list view by that tag.
  • Buttons: Use the buttons at the top right to navigate back to the main Todo List or to add a new task.
  • Time Tracking: Each card includes a small time tracking widget showing total time logged and a '+' button to quickly add a new time entry for that task/subtask.

Track Time Analysis

This page allows you to analyze the time logged against your tasks and subtasks.

Track Time Analysis Page Screenshot
  • Purpose: View aggregated or individual time entries based on various filters.
  • Filtering:
    • Status: Check the boxes for the task statuses you want to include (defaults to To Do, In Progress, Completed).
    • Date Range: Select a preset (This Week, Month, Year) or use the date inputs for a custom range. This filters the time entries based on *when they were logged* (`entryDate`), not the task's creation or due date.
    • Task Type: Choose to view time entries for All items, Tasks Only, or Subtasks Only.
  • Grouping & Sorting:
    • Show Individual Time Entries: Uncheck this (default) to group entries by task/subtask and see the total duration. Check it to view each time log separately.
    • Group by Top-Level Task: When individual entries are *not* shown, check this to group time by the main parent task instead of the immediate task/subtask the time was logged against. This checkbox is disabled if individual entries are shown.
    • Order by Task/Subtask Name: When individual entries *are* shown, check this to sort the list alphabetically by task/subtask name first, then by date (newest first). If unchecked (default), the list sorts purely by date (newest first). This checkbox is disabled if individual entries are not shown.
  • Summary Area: Displays the Total Time Logged and Average Time per Task/Subtask based on the current filters, along with the count of items in the list below.
  • List Display: Shows either grouped summaries or individual time entries. Each item displays the task/subtask title (clickable link to details), parent task (if applicable), tags (clickable), status, duration logged, and the date/time of the entry (or the latest entry if grouped).
  • Navigation: Use the buttons at the top right to go back to the main Todo List, add a new task, or view this help page.

Adding a New Task

Clicking "+ Add Task" takes you to the Add Task screen.

Add Task Screen
  • Fill in the Title (required).
  • Optionally add a Description, Tags (separated by commas), Due Date, Priority, or Status.
  • Click "Add Task" to save and return to the list, or "Cancel" to go back without saving.

Managing Task Details

Clicking a task title takes you to its details page.

Task Details View
  • Breadcrumbs: See the path to the current task (e.g., Todo List → Project A → Subtask 1). Direct subtasks of the current task are also listed as quick links below the breadcrumbs.
  • View Info: See the full title, description, status, priority, dates, and tags.
  • Track Time: Below the main header, you'll find the time tracking widget:
    • If time has been logged, a bubble shows the total duration (e.g., 1h 30m). Click this bubble to open the Time Log modal. Time Log Modal Placeholder
      • View all entries with dates and notes.
      • Edit the duration (using formats like "1h 30m", "45m") or the note for any entry.
      • Delete individual entries (requires confirmation).
      • Click Save Changes to commit edits or Cancel to discard.
    • Click the + button next to the total time to open the Add Time Entry modal. Add Time Entry Modal Placeholder
      • In this modal, enter a duration (e.g., "2h", "45m", "1h 15m" - numbers alone are minutes, seconds 's' are not allowed) and an optional note. Click Add Time.
  • Quick Edits: Click directly on the Status, Priority, or Due Date text to change them instantly without entering full edit mode.
  • Add Subtask: Click the "+ Subtask" button to go to the Add Subtask screen for this task.
  • Edit Task: Click the Pencil Icon to enter Edit Mode.
  • Delete Task: Click the Trash Icon to delete the task and its subtasks (confirmation required).
  • Edit Mode: Modify title, description, status, priority, due date, or tags. Click Save Changes or Cancel.
  • Subtasks List: See any subtasks associated with this task. Click their titles to view their details.
  • Comments: View existing comments, add new ones using the input field, or edit/delete your comments using the buttons that appear on hover.

Adding a Subtask

Clicking "+ Subtask" on a task's details page takes you to the Add Subtask screen.

Add Subtask Screen
  • This screen looks just like the Add Task screen, but it shows the parent task's title.
  • Fill in the details for the new subtask.
  • Click "Add Subtask" to save and return to the parent task's details page.
  • Click "Cancel" to go back without saving.

Comments Overview

The Comments page provides a centralized view of all comments across your tasks and subtasks.

  • Browsing Comments: View all comments in one place with context about which task they belong to.
  • Filtering: Use multiple filters to find specific comments:
    • Search: Find comments by text content or by task title.
    • Task Type: Filter to show comments on main tasks only or subtasks only.
    • Status: Filter comments by the status of their parent task or subtask.
    • Tags: Click on any tag to filter comments to only those on tasks with that specific tag.
  • Sorting: Arrange comments by date (newest or oldest first) or by task title.
  • Comment Details: Each comment shows:
    • The task or subtask title (with link to the task details)
    • Parent task information (for comments on subtasks)
    • Task status
    • Comment text
    • Associated tags
    • When the comment was added
  • Navigation: Click on the task title or "View in task" to go directly to the full task details with all comments.

Tags Overview

The Tags page helps you organize and browse tasks by their tags.

  • Tag Management: View all tags used across your tasks and subtasks in one centralized location.
  • Tag Details: For each tag, see:
    • The tag name
    • How many main tasks and subtasks use this tag
    • A list of associated tasks with their statuses
  • Filtering Tags: Use the filters at the top to find specific tags:
    • Search: Find tags by name or by associated task titles.
    • Task Type: Filter to show only tags used in main tasks or only in subtasks.
    • Status Filter: Show only tags associated with tasks of a specific status.
  • Sorting: Arrange tags alphabetically or by usage count (how many tasks/subtasks use the tag).
  • Task Filtering: Click on a tag name or the "Filter Tasks" button to quickly go to the main task list filtered to show only tasks with that tag.
  • Navigation: From any tag card, click on a task name to go directly to that task's details.

Working with Tags

Tags provide a flexible way to categorize and organize your tasks across different projects or areas of responsibility.

  • Adding Tags: When creating or editing a task/subtask, add tags in the Tags field, separating multiple tags with commas (e.g., "work, urgent, meeting").
  • Filtering by Tag:
    • On the main task list, click any tag to filter the list to show only tasks with that tag.
    • Use the Tags page to find and filter by any tag used in your system.
    • When a tag filter is active, a blue banner will appear at the top of the task list showing the active filter.
  • Tag Best Practices:
    • Use consistent naming conventions for your tags.
    • Consider using tags for contexts (e.g., "home", "work"), projects (e.g., "website-redesign"), priorities (e.g., "urgent"), or categories (e.g., "meeting", "follow-up").
    • Tags are case-sensitive - "work" and "Work" will be treated as different tags.

Working with Comments

Comments allow you to add notes, updates, or context to any task or subtask.

  • Adding Comments: On any task's detail page, use the comment field at the bottom to add notes or context to the task.
  • Editing Comments: Hover over a comment you've added to see edit and delete options (you can only modify your own comments).
  • Comment Formatting: Comments support plain text with line breaks for basic formatting.
  • Using the Comments Page:
    • Visit the Comments page to see all comments across your tasks in one place.
    • Use the powerful filtering options to find specific comments or review comments on tasks with certain statuses or tags.
    • The comments view is particularly useful for reviewing discussions or notes across multiple projects or areas.
  • Comment Best Practices:
    • Use comments to document decisions, clarify task requirements, or note progress updates.
    • Consider dating your comments manually if you're adding information about a specific milestone or event.
    • When a task is completed, consider adding a final comment explaining how it was resolved or any follow-up needed.

That's it! You're ready to organize your tasks.

Network Analysis

Website Status Checker
Check if a website is down for everyone or just you to ensure your site is always up and accessible to users.
What Is My IP Address?
Find out your IP address and get detailed IP information to help with network troubleshooting and security.
Internet Ping Test
Test the response time and connectivity of any server to ensure reliable network performance and troubleshoot connectivity issues.
DNS Lookup Tool
Look up DNS records and check domain configurations to troubleshoot network issues and improve website performance.
HTTP Status Checker
Check the HTTP status code of any website to ensure it is working properly and accessible to users.
Meta Tag Analyzer
Analyze meta tags of any website to improve your SEO and search engine visibility.
MX Record Checker
Verify email server configurations and mail exchanger records to ensure your email is delivered reliably.
Page Load Time Tester
Measure how fast a webpage loads and analyze performance to improve your website loading speed.
Broken Link Checker
Find broken links on your website automatically to ensure your site is always up to date and user-friendly.
Memory Usage Tracker
Monitor memory usage of your web applications to optimize performance and ensure smooth operation.
SSL Certificate Checker
Check the SSL certificate of any website to ensure it is secure and protected.
Redirect Checker
Check the redirect chain of any website to ensure it is secure and protected.

Management

Best Daily Planner
Try the best daily planner we believe to boost productivity with key features like to do list, time-blocking for daily planning.
Time Spent Tracker
Track your time spent on activities, tasks, and projects to help you stay on top of your schedule and improve your productivity.
Reminder Tool
Set browser notifications for reminders, tasks, and alerts to stay on top of your schedule.
Progress Tracker
Track and manage progress on multiple items with customizable categories, options, and completion percentages in a flexible grid interface.

Screensaver

Black Screen
A free backlight bleed tester to check dead pixels, backlight bleeding. Test monitor, laptop, mobile screen or other display issues.
White Screen
Quickly detect dead pixels, screen flicker, or backlight bleed on any monitor with our advanced display testing tool.
Red Screen
Spot dead pixels, color uniformity issues, or backlight bleeding fast-ensure your screen quality with our pixel checker.
Green Screen
Instantly check for dead pixels, backlight bleed, or display defects to guarantee flawless screen performance.
Blue Screen
Test your monitor for dead pixels, backlight bleeding, and color inconsistencies in seconds with our display diagnostic tool.
Yellow Screen
Identify dead pixels, uneven backlighting, or screen defects easily-optimize your monitor's display quality now.
Purple Screen
Find and fix dead pixels, backlight bleeding, or display issues using our comprehensive screen testing solution.
Cyan Screen
Ensure perfect screen quality by detecting dead pixels, backlight bleed, and other monitor issues instantly.
Orange Screen
Diagnose dead pixels, backlight bleeding, or display problems quickly-improve your monitor's performance and viewing experience.
Pink Screen
Uncover dead pixels, backlight bleed, or screen defects fast with our user-friendly display testing tool.
Brown Screen
Verify your screen for dead pixels, backlight bleeding, or color issues to maintain top display performance.
Gray Screen
Easily detect dead pixels, backlight bleed, and other screen issues to ensure your display's optimal quality.
Lime Screen
Quickly identify and troubleshoot dead pixels, backlight bleeding, and display defects for a flawless viewing experience.
Time Screen
Display the local time on your screensaver, automatically adjusting to your current time zone for accurate, real-time clock display.
Clock Screen
Elegant clock screensaver displaying the current time with customizable styles, perfect for adding a sleek look to your screen.

Utilities

Random Security Check
Automatically run random security checks on your web applications to identify vulnerabilities and strengthen your site's overall protection.
Name Picker
Easily and randomly select names from any list for giveaways, meetings, or decision-making with our simple selection tool.
Webcam Tester
Quickly test your webcam and verify camera settings to ensure optimal video quality and proper device functionality.
Microphone Test
Test your microphone and verify settings to ensure clear audio quality and proper device performance for free.
Flashlight Tester
Test your flashlight and verify settings to ensure optimal lighting and proper device functionality for free.
Morse Code Translator
Free online Morse code generator. Convert text to Morse code, e.g.: SOS in morse code, and vice versa.
Cookie Manager
View, edit, and manage your browser cookies effortlessly to control privacy, enhance security, and customize your browsing experience.
Erlang Calculator
Calculate call center staffing needs using Erlang B or Erlang C, factoring call volume, handling time, and service level to fine tune customer wait times.
Paycheck Calculator
Easily estimate your take-home pay with our free Paycheck Calculator. Calculate net pay after taxes and deductions instantly.
Annual Mileage Calculator
Calculate your annual mileage and estimate fuel costs with our easy-to-use Annual Mileage Calculator.
Credit Card Number Validation
Validate credit card numbers using the Luhn algorithm to ensure they are valid and secure.

Printable

Printable Calendar
Generate and download printable monthly calendars for any month and year. Perfect for planning, organizing, and printing.
January 2025 Calendar
Generate and download printable January 2025 Calendar. Perfect for planning, organizing, and printing.
February 2025 Calendar
Generate and download printable February 2025 Calendar. Perfect for planning, organizing, and printing.
March 2025 Calendar
Generate and download printable March 2025 Calendar. Perfect for planning, organizing, and printing.
April 2025 Calendar
Generate and download printable April 2025 Calendar. Perfect for planning, organizing, and printing.
May 2025 Calendar
Generate and download printable May 2025 Calendar. Perfect for planning, organizing, and printing.
June 2025 Calendar
Generate and download printable June 2025 Calendar. Perfect for planning, organizing, and printing.
July 2025 Calendar
Generate and download printable July 2025 Calendar. Perfect for planning, organizing, and printing.
August 2025 Calendar
Generate and download printable August 2025 Calendar. Perfect for planning, organizing, and printing.
September 2025 Calendar
Generate and download printable September 2025 Calendar. Perfect for planning, organizing, and printing.
October 2025 Calendar
Generate and download printable October 2025 Calendar. Perfect for planning, organizing, and printing.
November 2025 Calendar
Generate and download printable November 2025 Calendar. Perfect for planning, organizing, and printing.
December 2025 Calendar
Generate and download printable December 2025 Calendar. Perfect for planning, organizing, and printing.