This is a simple yet powerful to-do list app. It allows the user to add, remove, edit and check a task as completed.

Last update: Dec 27, 2022

Overview

To-Do-List App

In this project, I made a simple website called To-do-List. The user is able to add and remove tasks, mark them as done or undone, the added tasks are arranged in a list at the top of the page, I used different modules with javascript classes to make these functions possible. I used simple html to set up the pages. I am using webpack javascript bundle to make this.

Built With

HTML & CSS
Github
Javascript

Live Demo

liveDemoLink

Getting Started

To get a local copy up and running follow these simple example steps.

Prerequisites

Github flow knowledge. -Intermediate CSS, HTML and Javascript. -Installation of linter files. -install webpack

Setup

To clone the repository run [https://github.com/elfin-git/To-Do-List] in your terminal

Usage

This can be used as a simple to-do list app to add and remove your daily tasks.
NOTE: The mobile version is currently unavailable.

Install

Set up Github Actions
Set up linter > Lighthouse , Webhint ,Stylelint , Eslint.
Webpack bundle for javascript.

Author

👤 Tracy Musongole

GitHub: @githubhandle
Twitter: @twitterhandle
LinkedIn: LinkedIn

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a ⭐️ if you like this project!

Acknowledgments

Hat tip to anyone whose code was used
Inspiration
etc

📝 License

This project is MIT licensed.

Comments

morning session peer-2-peer code review
Hello @elfin-git Great job so far 👏 👏

there are still some issues in your repo

kindly, remove all the dead codes from your code base.

kindly, try to give a proper indentation.
opened by degisew 2
Functionality: CRUD methods
Implemented a function for adding a new task (add a new element to the array).

Implemented a function for deleting a task (remove an element from the array).

Implemented a function for editing task descriptions.

All changes to the To Do List are be saved in local storage.

Index of remaining items is updated after removing one task.
opened by TracyMuso 2
Morning Session P2p code review
Hi @elfin-git You Did a great work so far 👍✔ still you can implement some optional changes on your project.

[ ] According to the sample that is given for complete task the description should be line through kindly fix that.

[ ] When we mark a task as complete the item should be read only that mean we aren't able to edit more, please kindly fix that issue.
opened by mahdimahdawi 0
Peer to peer review: Tracy_Festus_Eva
Suggestions

kindly remove the obj.js file, as it holds code duplicated in the index.js. Also, the class created in obj.js is exported, but imported nowhere

inside create.js you should consider turning the UI class and its displayTasks method into a simple function, as it is the only method of that class

please change the List class name to Task, as it reflects better the concept of that class' role
opened by BucurEva87 0
Best practices
Well done to me for implementing the project!

The javascript files are good. Please avoid writing too many comments in your code base.

The first class that you created as a template for the list items is declared twice, only once is enough.

Try to use the keypress enter event listener on your edit implementation.

Otherwise everything looks good, no unnecessary repetition, clean code.
opened by TracyMuso 0
Interactive list
Added event listener to the checkbox (change).

implemented update function for items object's value for completed key upon user actions.

Implemented a function for the "Clear all completed" button (used filter() method).
opened by TracyMuso 0
Morning Session - Peer code review
Good job @elfin-git on implementing the project's requirements 👏 ! You might also consider:

The plus icon doesn't have enough contrast.

[optional] Use return instead of else inside functions.

[optional] Set up GitHub pages.
opened by gnuion 0
Structure: Basic structure of to-do list
I set up webpack for javascript.

I made the basic html markup.

I styled everything with css.

I made a function to iterate over the task array dynamically with javascript.
opened by TracyMuso 0

This is a simple yet powerful to-do list app. It allows the user to add, remove, edit and check a task as completed.

Related tags

Overview

To-Do-List App

Built With

Live Demo

Getting Started

Prerequisites

Setup

Usage

Install

Author

🤝 Contributing

Show your support

Acknowledgments

📝 License

Comments

Suggestions

Owner

Tracy Musongole

A To-Do-List app that input's a task by user and saves itself in the localStorage with a unique ID and when the task it checked as complete, user can click on clear all task to remove the task form the UI and localStorage. Built using JavaScript ES6

A to-do list Web application that lets the user add, remove and reorder to do lists and checks a task when completed with a button to delete all completed task

This is a simple web application of a To-do List in which you can add, remove and edit all your tasks and also you can mark each task as completed and delete all completed ones.

A simple todo list app written in javascript and html with basic CSS styling This project makes use of webpack to bundle the code. I implemented 3 functionalities on the this project namely: Add task edit task delete task using Js

This "To-do-list" app is a simple web application that displays a list of task and allows you to add and remove task from that list. it is built with the latest technology namely; JavaScript with webpack Configuration.

This "To-do-list" app is a simple web application that displays a list of task and allows you to add and remove task from that list

Microverse Module 02 Project: This is an educational project to make a TodoList web application, where the users can add new todo, remove todo, edit todo, mark todo as completed, and remove all completed todo. Built with Webpack

"To Do List" is a minimalist project that displays a list of task and allows you to add and remove task from that list. Built with JavaScript

A to-do list set up using webpack. It allows the user to add, remove, edit and check items on the list. All the data is saved in local storage.

A todo-list app designed to help users manage their tasks. Users can create a task, read tasks, update tasks, delete task, check completed tasks and delete all checked tasks. Also contains basic tests. Built with WebPack,, Modular JavaScript, Jest Libary and LocalStorage.

An app to manage tasks. A user can add, delete and edit a task and mark it as completed, It uses simple GUI and relies on DOM manipulation in pure JS and using local storage.

A simple To-Do List app built using JavaScript, where users can add, edit and remove tasks from the list as well as marking them as completed.

This is a Microverse (@microverseinc) project in which I created a To-do list using Webpack. User can add a task, delete it, edit its description, and clear the completed tasks.

A simple JS To Do List bundled using Webpack. You can add new tasks, edit existing tasks, check completed tasks, and delete tasks from the list. It is built mainly with Javascript.

A Todo list app that allows the user to add tasks, delete, edit, chage, and clear all completed tasks. Built with JavaScript, CSS and Html.

A Minimalist to do list website where user can add, remove and edit multiple tasks and All the changes user makes in his to do list is saved in browser local storage so that it can be accessed later.