TaskFlow – Task Management Application

A simple and structured task management application built using React.js to understand component-based UI development, state management, and routing.

This project was intentionally created as a transition from frontend fundamentals (HTML, CSS, JavaScript) to React-based development.

---

🎯 Purpose of This Project

TaskFlow was built with a clear learning objective rather than feature overload.

The main goals of this project were:

• To transition from static, DOM-based frontend development to component-driven UI design.
• To understand how React manages UI updates through state.
• To practice breaking UI into reusable components.
• To apply previously learned frontend fundamentals in a modern JavaScript framework.

This project represents a learning bridge between core frontend development and React.js.

---

🚀 Features

✔ Add new tasks
✔ Delete tasks
✔ Organized list view
✔ Multi-page routing (Home, About, Add Task)
✔ Bootstrap-based responsive UI
✔ Clean and readable component structure

---

🧠 React Concepts Covered

• Functional Components
• State Management using useState
• Props flow between components
• Controlled form inputs
• React Router v6 for navigation
• Component-based UI architecture

---

📸 Screenshots

🏠 Home Page

ℹ️ About Page

---

🛠️ Tech Stack

• React.js
• React Router v6
• JavaScript (ES6)
• Bootstrap
• HTML / CSS

---

📂 Project Structure

TaskFlow-Task-Management-Application/
│
├── public/
│
├── src/
│   ├── components/
│   ├── App.js
│   ├── index.js
│   └── ...
│
├── .gitignore
├── package.json
├── package-lock.json
└── README.md

---

▶️ Run Locally

Clone the repository:

git clone https://github.com/ShubhamMahajan880/TaskFlow-Task-Management-Application.git
cd TaskFlow-Task-Management-Application

Install dependencies:

npm install

Start the development server:

npm start

The application will run at:

http://localhost:3000

---

👤 Author & Ownership

This project is designed, developed, and maintained by Shubham Mahajan.

It reflects a deliberate learning journey from frontend fundamentals to structured, component-driven UI development using React.

• GitHub: https://github.com/ShubhamMahajan880
• LinkedIn: https://www.linkedin.com/in/shubham-mahajan-2a9a47220/

---

⭐ Why This Project Matters

TaskFlow demonstrates:

• Strong understanding of frontend fundamentals.
• Practical application of React core concepts.
• Clean UI logic and component structuring.
• Honest, learning-focused project design.

It complements automation and AI-based projects by showcasing frontend proficiency and UI thinking.