Skip to content

WebDesign-MultiMedia/To-Do_App

Repository files navigation

📝 To-Do App

A sleek and interactive To-Do application designed to help users manage their daily tasks efficiently. This project combines modern React features, Tailwind CSS styling, and enhanced UI/UX functionality.

🚀 Features

✅ Add, Complete, Delete Tasks: Easily manage your to-do list with full control over your entries.

🔁 Undo Completed Tasks: Users can revert completed tasks back to the active list.

⬆️⬇️ Move Tasks: Reorder your tasks using the move up and move down controls.

🕒 Timestamped Completions: Completed tasks are saved with the exact time and date they were finished.

💾 Local Storage Integration: Tasks and completed entries persist in the browser using localStorage.

🎨 Stylish Interface: Tailwind CSS powers the layout and style, while animated backgrounds created with CSS keyframes enhance the user experience.

🔠 Custom Fonts: Utilizes Google Fonts for typography and Font Awesome for intuitive iconography.

🧠 Tech Stack

React.js:

  • useState for managing UI state
  • useEffect for syncing data with localStorage

Tailwind CSS for responsive and modern styling

Font Awesome for icons

Google Fonts for clean and readable font styles

CSS Keyframes for animated background effects

📂 Project Setup

  1. Clone the repository git clone https://github.com/your-username/todo-app.git

  2. Navigate into the project directory cd todo-app

  3. Install dependencies npm install

  4. Run the app npm start

📸 Screenshot

A. Mobile-Responsive

iphone-15-pro-localhost-4znbe5sy9bxhcr

B. Laptop-Responsive

dell-latitude-localhost-zktqg64rj2p_wk

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors