• 📗 Table of Contents
• 📖 To-Do List
  • 🛠 Built With
    • Tech Stack
    • Key Features
    • New Feature
  • 🚀 Live Demo
  • 💻 Getting Started
    • Prerequisites
    • Setup
    • Install
    • Usage
    • Run tests
    • Deployment
  • 👥 Authors
  • 🔭 Future Features
  • 🤝 Contributing
  • ⭐️ Show your support
  • 📝 License

"To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mark them as complete. A simple website that allows user to create a To-do list.

• Project setup by webpack.
• HTML file setup using the HTML Webpack plugin.
• Populate the array of objects to the HTML.
• The array of objects that contain the to-do list is rendered dynamically and in order of the index value for each task.
• Create a CSS using the webpack Style/CSS loader.
• Create a new Js with add, remove and update functions.
• Update the remaining items after deleting.
• ToDo list saved in the local storage.
• Function for "Clear all completed" button implemented
• Add event listener to checkboxes of the list and mark the object as complete and incomplete depending on the checkbox.
• Add interactivity for description and checkbox
• Store the updated array of items in the local storage.
• Test file created for a file containing the add item and delete item functions.
• Test case created for Mock HTML to test if add/delete functions add or remove exactly one
• element to/from the list in the DOM.

Test Added for: 

• Editing the task description function.
• Updating an item's 'completed' status function.
• The "Clear all completed" function.
• DOM manipulation functions.

(back to top)

Here is the link for live version

• Live Demo Link

(back to top)

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

• In order to run this project you need: Visual Studio code or any Code Editor

Clone this repository to your desired folder:

  cd my-folder
  git clone https://github.com/biruk-bereka/Todolist-Webpack.git

Install this project with:

npm install

-testing with jest

npm test

(back to top)

👤 Biruk Bereka

• GitHub: @biruk-bereka
• LinkedIn:@Biruk Bereka

👤 Jugoslav Achkoski

• GitHub: jugosack
• Twitter: Jugoslav Achkoski
• LinkedIn: Jugoslav Achkoski

(back to top)

Future features

• Styling todo list

(back to top)

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

If you like this project please star in here on Github

(back to top)

This project is MIT licensed.

(back to top)