Git Product home page Git Product logo

iambenkis / to-do-list Goto Github PK

View Code? Open in Web Editor NEW
8.0 1.0 0.0 345 KB

To Do List is a website that helps you manage your tasks and projects, You can add Tasks to existing projects, create new projects, delete projects, modify or delete your tasks for a particular project. This project is build with HTML,CSS and JavaScript.

Home Page: https://iambenkis.github.io/To-Do-list/dist/

HTML 15.79% JavaScript 62.53% CSS 21.69%

to-do-list's Introduction

To Do list

The todo list lists everything that you have to do, with the most important tasks at the top of the list, and the least important tasks at the bottom using a corresponding index of each task. The project is build with HTML,CSS and Javascript.

todoList

Built With

  • Html
  • Csss
  • Js
  • Technologies used: webpack, Git, Github

Live Demo (if available)

Live Demo

Getting Started

To get the project locally , run

git clone https://github.com/iambenkis/To-Do-list.git

Prerequisites

  • Node
  • NPM

Install

Install webpack with npm :

npm install --save-dev webpack

Usage

  • To get the configuration of the app: Run
npm install

Run tests

  • To update changes : Run
npm run build
  • To launch the app locally: Run
    npm start

Authors

๐Ÿ‘ค Benjamin Kisenge

๐Ÿค 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

  • Microverse

to-do-list's People

Contributors

iambenkis avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

to-do-list's Issues

Peer to Peer Feedback

Hey @iambenkis, good job on your project. You have followed proper CSS and JavaScript practices.
Below are some recommendations of things you might add on your project.

  • Please start your project with the mobile first approach, as your page isn't responsive on mobile version.
  • Your MIT license link is not working properly, please take this seriously and fix it as it is a licensed project
  • Kindly consider grouping your JavaScript functions into modules in accordance with JavaScript ES6

Do I follow JavaScript best practices?

Project Improvements ๐Ÿ‘‹

Hi, great job on implementing the project and also using ES6 modules in your file systems ๐Ÿ‘ , however there are some visible improvements I would like to highlight

Highlight code to improve ๐Ÿค

displayTasks = () => {

  • The displayTasks() function is executing multiple tasks. A function should do one thing. Avoid executing multiple actions within a single function.

const checkboxes = document.querySelectorAll('.checkbox');

const taskLabel = taskContainer.querySelectorAll('.task-label');

  • It is a good coding practice to put all declarations at the top of each script or function.

addTask = (description) => {
const myTask = {
description,
completed: false,
index: this.tasks.length + 1,

remove = (id) => {

  • It is a good habit to assign default values to arguments. Because If a function is called with a missing argument, the value of the missing argument is set to undefined values that can break your code.

Peer to peer code review thursday

After checking out Benjamin's code we can say:

The approach was good and we can not see anything to be improved so far.
Our congratulations to Benjamin for such an organized 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.