This is a simple web app that allows a user add list of tasks that needs to be completed. It is built using webpack and served by a webpack dev server.

Related tags

Learning resource css html webpack modules es6
Overview

TO-DO-LIST

"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. Here is a simple website that allows for doing that.

Live Demo

link to live demo

TO-DO-LIST: Refractor to use the webpack setup exercise to bundle JavaScript in a to-do-list application

Built With

  • Webpack, and served by a Webpack dev server
  • JavaScript(ES6)
  • HTML
  • CSS

Getting Started

Prerequisites

  • In the repository, copy the SSH code snippet for Awesome-book-2
  • clone into the repository by using git clone in the git bash terminal
  • cd into the repository cd TO-DO-LIST
  • open VScode terminal code .
  • Go live (live server)

Setup

  • Linters
  • Git bash (optional: vscode gitbash terminal)

Install

  • Live server on VScode

Author

👤 Favour Amarachi Ezeugwa

Collaborator

👤 Abdo

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Show your support

Give a ⭐️ if you like this project!

Acknowledgments

  • Hat tip to anyone who's code/resource was used
  • Inspiration
  • Microverse student community

📝 License

This project is MIT licensed.

Comments
  • Milestone 3: To Do list (Interactive list)

    Milestone 3: To Do list (Interactive list)

    • Implemented a function for the "Clear all completed" button.
    • Implemented a function for the checkbox.
    • Added event listener to the checkbox.
    opened by Favourezeugwa 1
  • Milestone 2: To Do list (add, remove and edit)

    Milestone 2: To Do list (add, remove and edit)

    Implemented the CRUD (create, update, delete) methods.

    • Implemented a function for adding a new task to the array.
    • Implemented a function for deleting a task from the array.
    • Implemented a function for editing task descriptions.
    • saved all task in local storage
    opened by Favourezeugwa 1
  • Milestone 5: Testing To-do List (Status testing)

    Milestone 5: Testing To-do List (Status testing)

    Tested functions responsible for the status and content updates

    • functions for editing the task description.
    • functions for updating an item's 'completed' status.
    • The "Clear all completed" function.
    opened by Favourezeugwa 0
  • Milestone 4: Testing to do list

    Milestone 4: Testing to do list

    Testing the to-do list

    • Tested functions responsible for adding and deleting list items.
    • converted all impure functions to pure functions.
    • created a ../.test.js file containing the add item and delete item functions.
    • Mocked storage object to "imitate" localStorage operations.
    opened by Favourezeugwa 0
  • Morning session : Peer-to-peer code review (Week 7)

    Morning session : Peer-to-peer code review (Week 7)

    Highlight 💯

    • Good pointer
    • No linters errors
    • Use of Best practices for HTML, CSS and Js
    • Use of Github Work-flow

    Required Changes ♻️

    Kindly update your readme file

    • Make sure that your link to the live demo is working properly
    • Add a working link to your MIT Licence

    Proposed Solutions :

    • The link to your live demo should open the index.html file contained in your `/dist directory
    • Use the link here and customize your MIT license
    opened by Chrissiku 0
  • Milestone 1: To Do list (list structure)

    Milestone 1: To Do list (list structure)

    Implemented the following in my project

    • created an index.js file with an array of objects showing some to-do tasks. Each task object contains three keys.
    • Created a style.css set of rules which is loaded by the Webpack Style/CSS Loader.
    • Linked my source files index.html, index.js, and style.css located in /src directory to my distribution file which was generated by webpack and served by webpack dev server from /dist folder.
    opened by Favourezeugwa 0
  • Peer to Peer : code review

    Peer to Peer : code review

    good job so far

    • a few issues you need to address with your test
    • I recommend that you add a jsdom environment hint (npm i jest-environment-jsdom)
    • Add a test.config.js file to make the environment
    opened by HanningtoneM 0
  • Self-Assessment: Do I follow Javascript Best Practices.

    Self-Assessment: Do I follow Javascript Best Practices.

    Highlights 👍🏽:

    • Javascript in the browser ✔️
    • YAGNI ✔️
    • KISS ✔️
    • HTML/CSS ✔️

    Required Changes ♻️:

    • Object Destructuring wasn't used. Object restructuring will avoid repeating a lot of code.
    • The DRY code wasn't observed
    opened by Favourezeugwa 0
Owner
Favour Ezeugwa
Software Developer with love for React and Redux. Open to new opportunities.
Favour Ezeugwa
GitHub
In this project, I built a simple HTML list of To Do tasks. The list is styled according to the specifications listed later in this lesson. This simple web page is built using webpack and served by a webpack dev server.

Awesome books:JavaScript Using Modules In this project, I built a simple HTML list of To Do tasks. The list is styled according to the specifications

Hassan Momanyi 10 Nov 25, 2022
In this project, we built a simple HTML list of To Do tasks. This simple web page was created using webpack and served by a webpack dev server.

To do list In this project, we built a simple HTML list of To Do tasks. This simple web page was created using webpack and served by a webpack dev ser

Jesús Vázquez 8 Dec 21, 2022
In this project, I build a simple HTML list of To Do tasks. This simple web page will be built using webpack and served by a webpack dev server.

To Do list with Webpack In this project, I build a simple HTML list of To Do tasks. This simple web page will be built using webpack and served by a w

Sidney Kaguli 8 Aug 23, 2022
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.

To-Do-List A simple HTML list of To Do built using webpack and served by a webpack dev server. Live Link See Demo Built With HTML, CSS, Javascript To

Michael Ugochukwu 3 May 10, 2022
This an CRUD app built were users can create, update and delete specific day to day tasks as they wish. The app is built using webpack and served with webpack dev server

Todo-List This an CRUD app built were users can create, update and delete specific day to day tasks as they wish. The app is built using webpack and s

Duane David 10 Sep 28, 2022
This is a To-Do List. It shows a minimalist design with the next features: Add new tasks, edit tasks, markup completed tasks, and erase all completed tasks. Built with JavaScript.

Project Name To Do List Built With HTML CSS JavaScript Live Demo To do List Live Demo Link Getting Started This is a To Do List. It shows a minimalist

Santiago Cárdenas 6 Jun 9, 2022
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.

todolist This project is created to understand the use of ES6 with Webpack Built With HTML, CSS and Javascript. Webpack. Live Demo (if available) http

Shotola Ololade 3 Oct 13, 2022
This project is about building a simple HTML list of To Do tasks. Built using webpack and served by a webpack dev server.

To Do List app This project is about building a simple HTML list of To Do tasks and is built using webpack and served by a webpack dev server. Built W

Dino Ronald Quispe Arias 6 Nov 4, 2022
A simple HTML page maintaining list of To Do tasks using webpack and served by a webpack dev server.

Task Organiser In this project, we build a simple HTML list of To Do tasks using webpack and served by a webpack dev server. Built With HTML CSS Javas

Angom 4 Jun 24, 2022
A simple to-do list application that helps to organize your daily tasks and keep track of the task you have completed and the task you are yet to have completed, and also deleting the completed task leaving those yet to be completed.

To-Do-List A To-Do-List App helps users to get their task cordinated and organised. This project is from microverse javascript curriculum which tests

zieeco 12 Jul 8, 2022
A to do list where you can add tasks, mark completed tasks and clear all completed tasks.

To Do List A to do list where you can add tasks, mark completed tasks and clear all completed tasks. You can rearrange the order of the tasks by doubl

Amira 7 Mar 4, 2022
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.

To Do list: interactive list description: A todo list app that allow users to add new task, delete, edit, and clear all completed.Built with JavaScrip

IBRAHIM AHMAT 7 Aug 4, 2022
This project entails a To-do-List whereby a user can input the tasks they want to do, check the tasks done and also clear all tasks when all of them are completed. It is efficient for a user who want to manage their time and keep track of their day.

Screenshot Here is a screenshot for the project. To-Do-List Project This is a Microverse project that entails a to-do-list which one is able to add an

Grayce Muthui 8 Jun 16, 2022
A simple todo list app that allows users to add, delete, edit, and clear all completed tasks, built with HTML, CSS, Javascript and webpack.

todo list In this website you will add books and also watch the lists of books. Built With HTML CSS JavaScript See Live click here Authors ?? HaaDiiii

Hamid Ali 10 Oct 7, 2022
A simple HTML list of To Do tasks built using webpack, JS ES6 and CSS. This app allows users to add and delete tasks to organize their days.

To-Do List "To-do list" is an app that helps to organize your day. It simply lists the things that you need to do and allows you to mark them as compl

Karla Delgado 15 Sep 26, 2022
To Do list is a small but useful project to make list app , you can add tasks delete tasks and modify tasks, the project built using HTML, CSS, JavaScript

Project Name The To-Do-List app description this is a project in the second week of the second module in microverse. its a useful to do list that save

Alzubair Alqaraghuli 5 Jul 25, 2022
It is a simple yet powerful to do list app in which you can add daily to-do tasks.you can edit, remove, check it to change its status to complete or not complete. it would save all the data and changes in local storage and track your daily tasks whether you have completed them or not.Built with vanilla JavaScript

To Do list - minimalist It is a simple yet powerful to do list app in which you can add daily to-do tasks. it would save all the data and changes in l

Zuhaib Amjad 5 Oct 9, 2022
To-Do List project is the application for a to-do list, users can add and remove tasks from the to-do list. Mark tasks as completed.

To Do App To-Do List project is the application for a to-do list, users can add and remove tasks from the to-do list. Mark tasks as completed. Users c

Ishpaul Singh 6 Jul 21, 2022
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.

To-Do List A simple web application of a to do list Built With HTML, CSS, JS, ES6 & Webpack Getting Started In this repository I created To-Do List SP

Juan Sebastian Sotomayor 12 Apr 11, 2022