This is a web app to organize your tasks in a digital shelf. This app is built with JavaScript

Related tags

Learning resource ToDoList
Overview

To Do list

This is a web app to orgaise your tasks in a digital shelf. This app is built with Javascript. url : https://gloireirenge.github.io/ToDoList/ image

Built With

  • Javascript, HTML
  • weblint, eslint, hint
  • webpack

Getting Started

git clone https://github.com/GloireIrenge/ToDoList.git

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

Prerequisites

The basic requirements for building the executable are:

  • A working browser application (Google chrome, Mozilla Fire fox, Microsoft edge ...)
  • VSCode or any other equivalent code editor :atom:
  • Node Package Manager (For running, debuging, or installing dependancies to be used)

Install

npm install --save-dev [email protected] [email protected] [email protected] [email protected]

Run tests

  • npx eslint.
  • npx webhint .
  • npx stylelint "**/*.{css,scss}"

Authors

👤 Glory Mufungizi

💠 GitHub: @GloireIrenge 💠 LinkedIn: Glory Mufungizi

🤝 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

  • Thank you Mentor for your advices on this project
  • Thanks you Microverse team for you to make it done

📝 License

This project is MIT licensed.

Comments
  • Interactive To Do list features

    Interactive To Do list features

    :world_map:This part of the Todo project is done with the following changes

    • [ ] I add the completed.js file and import it as a module containing methods related to the status updates (completed: true / false).
    • [ ] I added an event listener to the checkbox (change).
    • [ ] I updated the items object's value for completed key upon user actions.
    • [ ] I implemented clearAllCompleted function for the "Clear all completed" button using filter() method.
    • [ ] The updated array of items are saved in local storage, so the user gets the correct list values after the page reloads.
    opened by GloireIrenge 0
  • Add and remove items from To Do List

    Add and remove items from To Do List

    This part of the project is made with the following changes and functionalities :

    • [ ] I removed all the hardcoded items from the todo array and created a new JavaScript file for the add and remove functionalities.
    • [ ] I Implemented a function for adding a new task and a function for deleting a task.
    • [ ] In the index.js file, I Implemented a function for editing todo descriptions.
    • [ ] When an item is deleted, the remaining item is updated.
    • [ ] All changes are saved to the local storage.
    opened by GloireIrenge 0
  • To Do list: list structure

    To Do list: list structure

    :green_book: I made this To Do List web project with the following changes and functionalities:

    • [ ] This project is set up using the webpack plugin.
    • [ ] I created an index.html file with an empty To Do List placeholder.
    • [ ] The index.html file is set as a template using the HTML Webpack Plugin.
    • [ ] I created an index.js file and set an array of some simple to-do tasks (with three keys: description [string]. completed [bool]. index: [number].
    • [ ] I Wrote a showTodo function to iterate over the tasks array and populate an HTML list item element for each task.
    • [ ] The to-do list is rendered dynamically when the page is loaded.
    opened by GloireIrenge 0
  • P2p code review 8/16/22

    P2p code review 8/16/22

    Feedback from Aamir Khan

    Hi @GloireIrenge, your project is looking beautiful so far. However, there are issues that you need to go through.

    • The deployment is not looking correct it is beacuse CSS and JS are not loading well, please kindly fix it.
    • Please create different modules not write all codes in one module.
    • As much as you can it is better to follow the javascript best practice , for example, it is better to use a local variable instead of the global variable.

    Feedback from Meshu Amare

    • From src/index.js on line number 60,110 you declare a variable. I think it is better to put it at the top of the script.
    • When you declare a variable if the variable has two words like DeleteSelected it is better to use camel case notiation like deleteSelected
    opened by melashu 0
  • Javascript best practice exercice

    Javascript best practice exercice

    • all Javascript files are kept in a new. JS file not in the script tags
    • console.log is not used on the project
    • .lock files is not in the repository. it should be there to avoid problems with future versions of the dependencies as I'm using node_modules.
    • document.write or eval is not used
    • window.alert() or window.confirm() is not used
    opened by GloireIrenge 0
Owner
Glory Mufungizi
Open to new opportunities, front-end web developer. Stacks: JavaScript, React, React-Redux, TailwindCSS, Material UI, Bootstrap, HTML and CSS
Glory Mufungizi
GitHub
The to-do list project is an app that allows users to successfully organize their day by inputting prioritized tasks. The project also allows users to carry out the CRUD operations for (add, edit and delete). Two special features of the app are that it saves tasks in the local storage of the user's browser, so when the user reloads or revisits the app, the user can view a list of tasks formerly inputted, and it allows users to prioritize their tasks by dragging up and down the list section.

TO-DO-LIST This is a To Do List Project that dynamically displays tasks to be done with interactions for removing and adding task when completed or no

Francis Ugorji 9 Nov 1, 2021
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 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 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
To Do List Application Organize your tasks with simple add and delete functionality. Organize your items with ease.

TODO-LIST To Do List Application Organize your tasks with simple add and delete functionality. Organize your items with ease. Additional description a

Steve 12 Jul 22, 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
A simple to do list app built with HTML, CSS and JavaScript. Users can add daily tasks, edit the tasks, delete the tasks when it's done

To Do List This is a website that allows users to manage the tasks. users can add every task to do and when the task is done users can delete the task

Mustafa Fahimy 8 Jul 21, 2022
A daily activity tracking application that helps to organize your daily tasks and keep track of tasks that have been completed, or yet to be completed.

To-Do-List This is my To-Do List project in the Microverse curriculum. Built With HTML CSS Javascript (Webpack) GitHub Live Demo Live Demo Link Gettin

Hammed Adisa 8 May 7, 2022
To-Do List is a simple web based application that gives users an opportunity to note and organize their daily tasks. This app is built with JavaScript, HTML/CSS.

Project Name To-Do App Live Demo About Project In this feature, I built a to do list app which helps to list the tasks to be done at a particular time

Hatim Eddinani 8 Aug 18, 2022
This project is a list manager that will allow a user organize a list of their tasks. They can conveniently create, update and delete tasks.

TO DO LIST APP This project is a list manager that will allow a user organize a list of their tasks. They can conveniently create, update and delete t

Kehinde Onifade 8 Oct 7, 2022
Todo List is a simple web-based application that gives users the ability to organize their work and life daily tasks. Built with JavaScript, HTML/CSS.

Javascript Project Todo List Using Javascript to create a simple Todo List project. Populating the todo list and then removing from the list. Built Wi

Ghazanfar Ali 9 Sep 28, 2022
ToDo list app is a simple web app that helps you organize your day, by adding, checking and deleting daily tasks

TODO List App "To-do list" is a WebApp tool that helps to organize your day. It simply lists the tasks that you need to do and allows you to mark them

Adel Guitoun 8 Oct 18, 2022
Digital Identifier is a secure, decentralized, anonymous and tampered proof way of maintaining and verifying all essential identity-based documents to create a unique digital identity of a person.

Digital Identifier ?? To design and develop a secure, decentralized, anonymous and tampered proof way of maintaining and verifying all essential ident

Mukul Kolpe 4 Dec 17, 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
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
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 to-do app for managing daily tasks built with Webpack, JavaScript, HTML, and CSS with the functionality to manipulate multiple completed tasks and store them to local storage.

TODO LIST APP In this project, I have built a simple HTML list of To Do tasks. The list is styled according to the listed specifications . This simple

Selma Belhadj 8 Jun 7, 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