Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/place4you/todo-list-using-react
This project is a simple Todo List application built with React. It allows users to add tasks with a title and description through a form, and these tasks are displayed on the screen. Users can also delete tasks by clicking a delete button associated with each task.
https://github.com/place4you/todo-list-using-react
next nextjs project react reactjs todo todo-app todo-list todoapp todolist todolist-application
Last synced: about 1 month ago
JSON representation
This project is a simple Todo List application built with React. It allows users to add tasks with a title and description through a form, and these tasks are displayed on the screen. Users can also delete tasks by clicking a delete button associated with each task.
- Host: GitHub
- URL: https://github.com/place4you/todo-list-using-react
- Owner: Place4you
- Created: 2023-09-13T08:43:44.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2023-09-13T09:42:18.000Z (over 1 year ago)
- Last Synced: 2023-09-13T17:15:10.948Z (over 1 year ago)
- Topics: next, nextjs, project, react, reactjs, todo, todo-app, todo-list, todoapp, todolist, todolist-application
- Language: JavaScript
- Homepage: https://saadattodolist.netlify.app/
- Size: 109 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Todo List using React/Next.js
## Introduction
This project is a simple Todo List application built with React. It allows users to add tasks with a title and description through a form, and these tasks are displayed on the screen. Users can also delete tasks by clicking a delete button associated with each task.
The project demonstrates the fundamental concepts of React, including component creation, state management, and event handling. It's an excellent starting point for beginners learning React or anyone looking to build a basic task management application.
## Live Demo
You can access a live demo of this Todo List app by following this link: [Todo List Demo](https://saadattodolist.netlify.app/))
## Features
- **Add Tasks**: Users can enter task titles and descriptions through a form and add them to the list.
- **Display Tasks**: Added tasks are displayed on the screen with their titles and descriptions.
- **Delete Tasks**: Users can remove tasks by clicking the delete button associated with each task.
- **Responsive Design**: The application is responsive and works well on various screen sizes.
## Technologies Used
- React: The core library used for building the user interface and managing state.
- HTML/TailWind: Used for structuring the app and styling the components.
- JavaScript: Used for logic and event handling.
## Getting Started
To run this project locally on your machine, follow these steps:
1. Clone the repository to your local machine using the following command:
```bash
git clone https://github.com/your-username/todo-list-react.git
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
## Getting Started
First, run the development server:
```bash
npm run dev
# or
yarn dev
# or
pnpm dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
You can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.
This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
## Learn More
To learn more about Next.js, take a look at the following resources:
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
##Contributing
If you have suggestions for improvements or spot any issues, please feel free to create an issue or submit a pull request. Contributions are welcome!
##License
This project is licensed under the MIT License. See the LICENSE.md file for details.
Thank you for checking out the Todo List using React/Next.js project! We hope it helps you learn and explore React development.