https://github.com/yashkappa/to-do-list
To-Do-List, User can Add task, view all task and complete task, in view task you can edit, delete, and complete button, in completed task you can delete the complete task, view created and completed task date and time in both, this site is responsive for any device.
https://github.com/yashkappa/to-do-list
bootstrap css emoji font-awesome html5 icon icons local-storage reactjs responsive-design user-friendly
Last synced: 3 months ago
JSON representation
To-Do-List, User can Add task, view all task and complete task, in view task you can edit, delete, and complete button, in completed task you can delete the complete task, view created and completed task date and time in both, this site is responsive for any device.
- Host: GitHub
- URL: https://github.com/yashkappa/to-do-list
- Owner: yashKappa
- Created: 2025-05-01T16:45:49.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2025-05-15T19:57:24.000Z (about 1 year ago)
- Last Synced: 2025-06-11T07:44:09.363Z (about 1 year ago)
- Topics: bootstrap, css, emoji, font-awesome, html5, icon, icons, local-storage, reactjs, responsive-design, user-friendly
- Language: JavaScript
- Homepage: https://yashkappa.github.io/to-do-list/
- Size: 5.61 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ✅ To-Do-List Web App
This is a simple and responsive task management web application built with **React**. It allows users to:
- Add, edit, and delete tasks
- Mark tasks as completed
- View completed tasks with timestamps
- Automatically store tasks in browser local storage
---
## 📥 How to Download
1. Click the green **Code** button on the GitHub repository and choose **Download ZIP**, or clone it using Git:
```bash
git clone https://yashkappa.github.io/to-do-list.git
```
2. Open the folder in **Visual Studio Code** or your preferred editor.
---
## ▶️ How to Run Locally
### Step 1: Install Node Modules
Make sure you have **Node.js** and **npm** installed. Then run:
```bash
npm install
```
This will install all dependencies listed in `package.json`.
### Step 2: Start the App
```bash
npm start
```
This will launch the app in your default browser at:
```
http://localhost:3000
```
---
## 🚀 How to Host the App
### Step 1: Build the App
To prepare the app for deployment, run:
```bash
npm run build
```
This creates a production-ready version in the `build/` folder.
### Step 2: Host the App
You can now host it on any static site host like:
- **GitHub Pages**
- **Firebase Hosting**
---
### Example: Deploy to GitHub Pages
1. Install the `gh-pages` package:
```bash
npm install --save gh-pages
```
2. Add the following to your `package.json`:
```json
"homepage": "https://yashkappa.github.io/to-do-list",
"scripts": {
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
}
```
3. Deploy:
```bash
npm run deploy
```
---
## 🗂️ Project Structure
```
task-manager-app/
├── public/
├── src/
│ ├── components/
│ │ ├── Sidebar.js
│ │ ├── Task.js
│ │ ├── Complete.js
│ │ └── Input.js
│ ├── App.js
│ ├── App.css
│ └── index.js
├── package.json
└── README.md
```