Giter VIP home page Giter VIP logo

rwubakwanayo / todo-list Goto Github PK

View Code? Open in Web Editor NEW
3.0 1.0 0.0 501 KB

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

Home Page: https://rwubakwanayo.github.io/Todo-List/dist

HTML 9.05% JavaScript 59.86% CSS 31.09%
css3 fontawesome-icons html5 javascript-es6 jest-tests webpack

todo-list's Introduction

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

todo

Built With

  • Webpack
  • font-awesome icons

Live Demo

Link to the live demo: rwubakwanayo.github.io/Todo-List

Getting Started

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

Setup

  • Download or Clone Repository.
  • In case you downloaded repository Extract ZIP Folder.

Installation

  • Open folder in your text editor.
  • Run npm install command to install all dependencies. N.B: Make sure that you have node installed in your commputer, if not Download Node

Usage

To get project open and running in your browser run npm start command which will start webpack-server.

Run the tests

run: npm test

Authors

πŸ‘€ Olivier Rwubakwanayo

πŸ‘€ Manel Hammouche

🀝 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

  • Great appreciation to Microverse community.

πŸ“ License

This project is MIT licensed.

todo-list's People

Contributors

ha-manel avatar rwubakwanayo avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar

todo-list's Issues

Follow JavaScript best practices

Hi @RWUBAKWANAYO ,
Great job on completing your Todo-List project! Outstanding work! πŸ‘πŸΌπŸ”₯

Highlights πŸ₯³

  • Great design βœ”οΈ
  • No linter errors βœ”οΈ
  • Great job writing clean code. πŸ”₯

Recommended Changes ♻️

  • Kindly avoid creating new functions to filter and map through array on deleteTodos function which exists in ModifyTodos.js file
    const newTodos = todos.filter((item) => +item.index !== +targetIndex)
    .map((item, index) => {
    item.index = index + 1;
    return item;
    });
  • In newTodos of the deleteTodos function, instead of set whole objects value of the todos array you can only change the index of each object
    const newTodos = filterTodo.map((item, index) => ({
    description: item.description,
    completed: item.completed,
    index,
    }));

Cheers and happy coding! πŸ₯³

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.