A microverse project that allows users to update tasks from a list using javascript modules

Last update: Oct 19, 2022

Related tags

Overview

ToDo-list App

This is a microverse project that allows users to update tasks from a list using javascript modules

Our goal here is to Build a book application with add and remove feature from scratch using JavaScripts... click [here] (https://usorfaitheloho.github.io/ToDo-list-app/dist) to see deployed live version

Features implemented so far

Add book feature
Remove book feature
Saving current state of booklist to local storage

Built With

HTML5, Javascript
CSS3
Linters

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

Prerequisites

Have a good knowledge on javascript objects
Have VSCode or other text editor installed. Link to download VSCode
Install node package. Link to download node
Have git installed.Link to download git
Create a github repository.
Node Package Manager (For installing packages like Lighthous, webhint & stylelint used for checking for debugging bad codes before deployment)

Getting started

Cloning the project

git clone https://github.com/usorfaitheloho/ToDo-list-app.git

cd To-Do-list-Application npm install npm run start

## Getting packages and debuging with Stylelint

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

##### For validation detection using Stylelint Run

npx stylelint "**/*.{css,scss}"

##### from parent source directory
## Getting packages and debuging with ESlint

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

##### For validation detection using Stylelint Run

npx eslint .

##### from parent source directory
## Getting packages and debuging with Webhint

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

##### For validation detection using Webhint Run

npx hint .

## Unit Testing
You can find each unit test cases in the Test folder located in the parent source directory of the project. you can create your own custom unit test and test it by running

npx run test

This should run all unit test found in the application.test.js from the Test folder.


## Authors

👤 **Faith Eloho usor**

- GitHub: [@githubhandle](https://github.com/usorfaitheloho)

Comments

Testing To Do list -part 2
Use jest framework for testing.

Created a unit test file containing the editing the task description,updating an item's 'completed' status and the "Clear all completed" function test cases and Used Jest inbuilt describe method to group. -Mock functionality for local storage enabled in Application test mode. -Mock the HTML elements to test DOM manipulation functions.
opened by usorfaitheloho 0
Test for add and delete

In this milestone we worked on the following: -Created a unit test file containing the add item and delete item test cases.

-Used Jest inbuilt describe method to group add item and delete item test cases -Mock functionality for local storage

opened by usorfaitheloho 0
Implement interactive list
##Milestone 3 in this milestone, I performed the following 👍:

Add event listener to the checkbox

Update items object's value for completed key upon user actions

Implement a function for the "Clear all completed" button (use filter() method)

Store the updated array of items in local storage, so the user gets the correct list values after the page reloads.
opened by usorfaitheloho 0
To Do list milestone 2
###In this milestone, I did the following:

Removed all hard-coded items from the tasks array.

Add Implemented task- (Note: You add by hitting the Enter key on your keyboard)

Delete Implemented task

Save to local storage
opened by usorfaitheloho 0
TO DO list structure -Milestone1
Module 1

In this module, I worked on the following:

created function to render the dynamically created list of tasks.

Integrated Webpack build system for building HTML templates and packing JavaScript modules
opened by usorfaitheloho 0

A microverse project that allows users to update tasks from a list using javascript modules

Related tags

Overview

ToDo-list App

Features implemented so far

Built With

Prerequisites

Getting started

Cloning the project

Comments

Testing To Do list -part 2

Test for add and delete

Implement interactive list

To Do list milestone 2

TO DO list structure -Milestone1

Module 1

Owner

faith Usor

A microverse project that allows users to update tasks from a list using javascript modules

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 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

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 project is the application for a to-do list, users can add and remove tasks from the to-do list. Mark tasks as completed.

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.

A simple To-do app project made using JavaScript ES6 and Webpack - Microverse. You can add, remove, check tasks, and remove all the tasks that were done at the same time. Feel free to see the live version, if you like it please give it a star!

In this project, I built a basic website that allows users to add/remove books from a list using HTML/CSS to build the app and JavaScript to add functionalities. This project was organized using modules and ES6 syntax implemented.

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

My terrible attempt at a promposal. Update: She said yes LMFAO Update Update: I got friendzoned right after 😭

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.

A to-do list app is a productivity tool designed to help users to create and maintain lists of tasks that they need to complete and it allows user to edit their tasks even after the task is saved. Built with CSS, HTML, and JAVASCRIPT.

This is an app developed in the Microverse course, it is a simple app used for developing a task list, using JavaScript modules and webpack

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.

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.

To do list is a simple CRUD application that allows you to add, delete, update tasks that you are supposed to do. It is built with HTML, CSS and JavaScript

A To-DO-List app that allows user to create, update, and remove their daily tasks in and from the browser localstorage. Built with HTLM5, CSS, JavaScript, and Webpack.

A simple to-do list created while a student in Microverse using JavaScript to add and delete selected tasks.

This project is about the awesome books we did during Microverse to build a website for adding and removing the books.Done using HTML and ES6 JAVASCRIPT and modules