https://github.com/jeslipriya/todo-react
ToDo Application using React.js
https://github.com/jeslipriya/todo-react
css html js json jsx reactjs todo-list
Last synced: 3 months ago
JSON representation
ToDo Application using React.js
- Host: GitHub
- URL: https://github.com/jeslipriya/todo-react
- Owner: jeslipriya
- Created: 2025-03-29T05:11:39.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-29T06:12:36.000Z (over 1 year ago)
- Last Synced: 2025-03-29T06:27:11.108Z (over 1 year ago)
- Topics: css, html, js, json, jsx, reactjs, todo-list
- Language: JavaScript
- Homepage:
- Size: 62.5 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# To-Do List App
A simple and user-friendly **To-Do List App** built with **React.js** and Vite.
## Features
- Add new tasks with Catergory and level of importance
- Edit tasks (optional)
- Delete tasks
- Mark tasks as completed
- Filter tasks (All, Completed, Pending)
- User authentication (Login & Register) (optional)
- Stores tasks in **localStorage**
- Dark Mode
## Project Structure
```
my-todo-app/
├── public/ # Static files
│ ├── favicon.ico # App icon
│ ├── index.html # Main HTML file
│
├── src/ # Source files
│ ├── components/ # Reusable components
│ │ ├── AuthForm.jsx # Authentication form component
│ │ ├── FilterButtons.jsx # Todo filter buttons
│ │ ├── TodoForm.jsx # Todo input form
│ │ ├── TodoItem.jsx # Single todo item
│ │ └── TodoList.jsx # List of todos
│ │
│ ├── pages/ # Page components
│ │ ├── LoginPage.jsx # Login page
│ │ ├── RegisterPage.jsx # Registration page
│ │ └── TodoPage.jsx # Main todo page
│ │
│ ├── utils/ # Utility functions
│ │ └── auth.js # Authentication logic
│ │
│ ├── App.jsx # Main app router
│ ├── main.jsx # App entry point
│ └── styles.css # Global styles
│
├── .gitignore # Git ignore rules
├── package.json # Project dependencies and scripts
├── package-lock.json # Lockfile
├── README.md # Project documentation
└── vite.config.js # Vite configuration
```
## Installation & Setup 🛠
1. **Clone the repo**
```sh
git clone https://github.com/jeslipriya/ToDo-React.git
cd ToDo-React
```
2. **Install dependencies**
```sh
npm install
```
3. **Run the app**
```sh
npm run dev
```
## Technologies Used 🛠
- **React.js** - Frontend framework
- **Vite** - Build tool
- **CSS** - Styling
- **localStorage** - Data persistence
## Future Improvements
- Undo Task Deletion
- Mobile Responsive UI
- Task Statistics
---
Made by **Jesli**