/todo-list-react

A simple To-Do List Application built with React. Users can add, edit and delete tasks easily. Designed as a beginner-friendly React project to practice state management, event handling, Dom manipulation and React Hooks (useState, useRef)

Primary LanguageCSS

βœ… React To-Do List App

A simple and elegant To-Do List application built with React.
Users can add, edit, and delete tasks with ease.
This project is designed as a beginner-friendly React app to practice:
✨ state management, event handling, React hooks, and DOM manipulation.


🌐 Live Demo

πŸ”— View Live App


✨ Features

  • βž• Add Tasks – Create new tasks instantly.
  • ✏️ Edit Tasks – Update task names easily.
  • ❌ Delete Tasks – Remove tasks with a single click.
  • ⚑ Instant DOM Updates – Changes appear in real-time.
  • 🎨 Responsive Design – Works across different screen sizes.

πŸ› οΈ Tech Stack

  • βš›οΈ React.js
  • πŸ“œ JavaScript (ES6+)
  • 🧩 React Hooks
    • useState β†’ manage input values
    • useRef β†’ access DOM elements directly
  • 🎨 CSS β†’ for styling & basic responsiveness

⚠️ Limitations

  • πŸ”„ Tasks are not persistent β€” refreshing the page clears the list.
  • πŸ›‘ Relies on direct DOM manipulation instead of React’s declarative rendering.
  • 🎭 Minimal styling β€” no animations or advanced UI/UX.
  • πŸ“… No categories, deadlines, or priorities for tasks.
  • πŸ“¦ Not optimized for large-scale or production use.

πŸ“Œ Author

πŸ‘€ Developed by BharathPadavu