A simple and responsive To-Do List application built with React.js that allows users to:
- Add a task/activity
- Provide a description for each task
- Display tasks in a list format
- ✅ Add tasks with descriptions
- ✅ Real-time form input updates using useState
- ✅ Form validation with alerts for empty fields
- ✅ Clean and intuitive UI layout
Replace with an actual screenshot of your app
- React.js (Functional Components + Hooks)
- CSS (Custom styling)
- Vite / Create React App (You can specify based on how you bootstrapped)
src/
├── App.jsx
├── App.css
└── main.jsx (or index.js depending on setup)
- App.jsx: Main component managing state, form handling, and rendering To-Do items
- ToDo: A subcomponent responsible for displaying each to-do item
- useState: Used to manage:
- Activity input
- Description input
- List of tasks
# Clone the repo
git clone https://github.com/your-username/react-todo-list.git
cd react-todo-list
# Install dependencies
npm install
# Start the development server
npm run dev # or npm start if using Create React App- Enter an activity and a description
- Click "Add Activity"
- The task will be displayed below the form
- Add delete or edit functionality
- Store tasks in localStorage for persistence
- Add completion status and filtering
Built with ❤️ using React, styled by hand.