https://github.com/ankitjhagithub21/advanced-todoapp
A feature-rich Todo App built with React & Redux, designed for efficient task management. Users can add, edit, delete, and mark tasks as complete, set priorities, and track deadlines with a clean and intuitive UI.
https://github.com/ankitjhagithub21/advanced-todoapp
bootstrap localstorage reactjs todo-app
Last synced: 3 months ago
JSON representation
A feature-rich Todo App built with React & Redux, designed for efficient task management. Users can add, edit, delete, and mark tasks as complete, set priorities, and track deadlines with a clean and intuitive UI.
- Host: GitHub
- URL: https://github.com/ankitjhagithub21/advanced-todoapp
- Owner: ankitjhagithub21
- Created: 2025-03-05T15:43:11.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-06T07:17:28.000Z (over 1 year ago)
- Last Synced: 2025-06-05T03:28:29.068Z (about 1 year ago)
- Topics: bootstrap, localstorage, reactjs, todo-app
- Language: JavaScript
- Homepage: https://advanced-todoapp.vercel.app
- Size: 123 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Todo App
A simple **Todo Application** built with **React, Redux, and Bootstrap**, allowing users to add, edit, delete, mark tasks as complete, and prioritize their todos.
## 🚀 Live Demo
[Click Here to View Live](https://advanced-todoapp.vercel.app/)
## 📌 Features
- ✅ Add new todos with title, description, and priority.
- ✏ Edit existing todos.
- ❌ Delete todos.
- ✔ Mark todos as **complete/incomplete**.
- 🎨 Priority labels (**High, Medium, Low**).
- 🗄 Data managed with **Redux Toolkit**.
- 💾 Todos and user data stored in **LocalStorage**.
- 🔒 **Protected Routes** (default username: `admin`, password: `password`).
- 💡 Responsive UI with **Bootstrap**.
## 📸 Screenshots
### Todo List View
### Add Todo
### Edit Todo Modal
## 🛠 Tech Stack
- **Frontend**: React.js, Redux Toolkit, Bootstrap
- **State Management**: Redux
- **Storage**: LocalStorage
- **Authentication**: Basic Protected Route
- **Icons**: React Icons
- **Deployment**: Vercel
## 🔧 Installation & Setup
Follow these steps to set up the project locally.
### 1️⃣ Clone the Repository
```sh
git clone https://github.com/ankitjhagithub21/advanced-todoapp.git
cd advanced-todoapp
```
### 2️⃣ Install Dependencies
```sh
npm install
```
### 3️⃣ Run the Application
```sh
npm run dev
```
- The app will be available at **http://localhost:5173/**
## 🏗 Project Structure
```
├── src
│ ├── components
│ │ ├── Todos.jsx
│ │ ├── Sidebar.jsx
│ │ ├── Topbar.jsx
│ │ ├── EditModal.jsx
│ ├── redux
│ │ ├── store.js
│ │ ├── slices
│ │ │ ├── appSlice.js
│
│ ├── App.jsx
│ ├── main.jsx
│
├── public
│ ├── index.html
│
├── package.json
├── README.md
```
## 🤝 Contributing
1. Fork the repository
2. Create a new branch: `git checkout -b feature-name`
3. Commit changes: `git commit -m 'Added new feature'`
4. Push the branch: `git push origin feature-name`
5. Open a Pull Request
## 📜 License
This project is licensed under the **MIT License**.
---
🚀 **Developed by Ankit Jha**