Home / JavaScript / Bundlers

To-do is a web app that helps to organize your day to day activities.

To-do is a web app that helps to organize your day to day activities. It lists all the activities that you need to be completed and allows you to mark them as complete or not. It's a minimalistic website built using JavaScript ES6, Webpack and CSS.
Information
Category: JavaScript / Bundlers
Watchers: 1
Star: 9
Fork: 0
Last update: Dec 6, 2021
Resource links
https://anselemodims.github.io/To-Do/dist/
https://github.com/AnselemOdims/To-Do

To-do

To-do is a web app that helps to organize your day to day activities. It lists all the activities that you need to be completed and allows you to mark them as complete or not. It's a minimalistic website built using JavaScript ES6, Webpack and CSS.

screenshot

Additional description about the project and its features.

Built With

  • Major languages (HTML, CSS, JavaScript)
  • Frameworks (None)
  • Technologies used - Webpack(Code Bundlng et al), Git(version control), ESLint(JavaScript linting), WebHint(linting tool), Stylelint(style linting)

Live Demo

Live Demo Link

Getting Started

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

Prerequisites

  • A text editor(preferably Visual Studio Code)

Install

Usage

  • Clone the repository using git clone [email protected]:AnselemOdims/To-Do.git
  • cd into the project folder
  • Run npm install
  • Run npm run build
  • Run npm start

Authors

👤 Anselem Odimegwu

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

📝 License

This project is MIT licensed.

0 Open More issues
Closed

Code Review

Hi @AnselemOdims Nothing really much to say. Your code looks really good and modular. Good job so far :partying_face:

opened Dec 2, 2021 by charlesgobina 1
Closed

Add remove

Steps Taken

  • Updated styles page
  • Made the list items draggable by adding the draggable attribute to the component
  • Created the edit static helper method
  • Created a delete method to help in the removing of item(s)
  • Created a remove function to handle the removal of todo list item
  • Created the clearAll Static method to remove all completed todos
  • Adjusted previous methods and functions to adhere to requirements
  • Included styles in the list form element and other parts of the pages
  • Implemented the rotate functionality of the refresh button
  • Included drag.js file to handle all drag/drop related events
  • Updated README.md file

Screenshots

Before

todo

After

todo2

opened Nov 30, 2021 by AnselemOdims 1
Closed

Change styles

Added the features description

opened Dec 16, 2021 by AnselemOdims 0
Closed

Change styles

Worked on the drag and drop feature

opened Dec 15, 2021 by AnselemOdims 0
Closed

Change styles

Steps

  • Corrected title of the page
  • Reduced the width of the list item inputs
  • Included form validation for form input
  • Included a check function for the list item
  • Added an error display for invalid/empty input
  • Changed animation style for empty input
opened Dec 5, 2021 by AnselemOdims 0
Closed

Re-run build process

null

opened Dec 1, 2021 by AnselemOdims 0
Open

Best Practices Issues

Improvement Suggestions

JavaScript

  • Can put if statement on one line link
  • Array destructuring will be of better use on this line
  • Implicit return will be best used on this line
  • Array destructuring will be of better use on this line
  • Array destructuring will be of better use on this line
  • A helper function can hold both this line and this line to enable reusability across code base.

CSS

  • Font-family can be put in the form selector instead link
  • Could have just added the bottom class with JS instead of repeating line
  • line139 will take care of this line.
opened Dec 6, 2021 by AnselemOdims 0

Contents

    Sheinxy Advent Of Code 2021
    zjfjack Calendar Week & Day View in iOS Swift
    romancm Gamebrary - Open source tool to organize video game collections.
    pbreault A plugin for Android Studio and Intellij IDEA that speeds up your day to day android development.
    oppia Oppia is an online learning tool that enables anyone to easily create and share interactive activities
    GoogleChrome The Android Browser Helper library helps developers use Custom Tabs and Trusted Web Activities on top of the AndroidX browser support library.
    ro-vn Automatically give kudos to the latest Strava activities using Cypress, Nextjs, and Github workflows
    ivandokov Media sorting tool to organize photos and videos from your camera in folders by year, month and day.
    airbnb 🔦 Showkase is an annotation-processor based Android library that helps you organize, discover, search and visualize Jetpack Compose UI elements
    swziy Useful Swift script to organize imports
    tfeldmann The file management automation tool.
    billionsjoel The app helps you to add todo items to your list, mark completed ones and also delete finished items. Its a handy tool for your day today activies. Check out the live demo.
    brandy-kay Bored app is an application that make use of Bored Api, which displays activities one can do when bored
    savepopulation Piri is a lightweight annotation processing library that generates static factory methods for your Activities and Fragments.
    prakhar21 A day to day plan for this challenge (50 Days of Machine Learning) . Covers both theoretical and practical aspects
    hello-efficiency-inc Ride Receipts - Simple automation desktop app to download and organize your tax invoices from Uber and Lyft.
    balsikandar Robin is a logging library for Bundle data passed between Activities and fragments. It also provides a callback to send screen views of user visited pages to your analytics client
    Phineas Expose your Discord presence and activities to a RESTful API and WebSocket in less than 10 seconds
    AmaduKamara Leaderboard App shows a list of game leaders and top scores
    florent37 Android reactive event bus that simplifies communication between Presenters, Activities, Fragments, Threads, Services, etc.
    microsoft The Common Data Model (CDM) is a standard and extensible collection of schemas that represents business concepts and activities with well-defined semantics, to facilitate data interoperability.
    Share this repo

    Related Repos


    Bundlers
    9
    This is a Webpack Project about Todo-list which you can add your to-dos, edit them, add ma...
    omarsalem7 Todo-list-webpack This website Todo-list-webpack provides users a convenient way to keep track of their todos. Built With HTML CSS JavaScript Linters
     
    Bundlers
    8
    This is a Webpack Project Leaderboard and uses API to add your game score and see a list o...
    Omar-Muhamad Leaderboard This is a Webpack Project Leaderboard and use API to add your game score and see a list of the other scores What I did in this project: Se
     
    Bundlers
    5
    A boilerplate code to build a chrome extension with react and webpack.
    vivek9patel Chrome Extension with React.js Boilerplate Boilerplate for your chrome extension with react.js and webpack Background Creating a file structure for de
     
    Bundlers
    9
    To-do is a web app that helps to organize your day to day activities.
    AnselemOdims To-do is a web app that helps to organize your day to day activities. It lists all the activities that you need to be completed and allows you to mark them as complete or not. It's a minimalistic website built using JavaScript ES6, Webpack and CSS.
     
    Bundlers
    825
    enterprise standard loader
    ecomfe ESL (Enterprise Standard Loader) ESL是一个浏览器端、符合AMD的标准加载器，适合用于现代Web浏览器端应用的入口与模块管理。 ESL is a browser-only, amd-compliant module loader. In modern web app
     
    Bundlers
    4k
    CSS Loader
    webpack-contrib css-loader The css-loader interprets @import and url() like import/require() and will resolve them. Getting Started ⚠ To use css-loader, [email protected] is
     
    Bundlers
    4.9k
    The power of webpack, distilled for the rest of us.
    laravel-mix Introduction Laravel Mix provides a clean, fluent API for defining basic webpack build steps for your applications. Mix supports several common CSS an
     
    Bundlers
    3
    Utility functions to test Webpack loaders/plugins
    privatenumber webpack-test-utils Utility functions to test Webpack loaders/plugins Features In-memory builds Uses an in-memory file-system for faster builds that do
     
    Bundlers
    4
    Vue 3 Server Side Rendering with Webpack 4 Hot Module Replacement
    CyberAP Vue 3 SSR with Webpack 4 HMR Play with it right in the browser! Features Hot reloading for everything inside src folder Production-ready build Integra
     
    Bundlers
    32
    bundle and `require` a file
    egoist 💛 You can help the author become a full-time open-source maintainer by sponsoring him on GitHub. bundle-require Use Case Projects like Vite need to l
     
    Bundlers
    430
    TypeScript Module Loader
    lukeed TypeScript Module Loader Features Supports node <file> usage Supports ESM --loader usage† Supports --require hook usage Optional configuration file fo
     
    Bundlers
    16
    Webpack plugin to tree-shake and minify JSON modules
    privatenumber webpack-json-access-optimizer Optimize JSON modules that are referenced via accessor function. For example, i18n locale JSONs. Features Tree shaking R
     
    Bundlers
    21
    Experimental wasm linker
    Luukdegram zwld Experimental linker for wasm object files. The idea is to implement a linker that stays close to wasm-ld in regards to features so that one day t
     
    Bundlers
    22
    EMP Micro FE Base on webpack 5 & module federation
    efoxTeam EMP - Micro Frontends solution Base on Webpack 5 & Module Federation English | 简体中文 Projects Project NPM Info @efox/emp-cli CLI @efox/emp-tsconfig Typ
     
    Bundlers
    13
    This is a restaurant page developed with JS and webpack, following The Odin Project JS cur...
    bertil291utn Sushi Hub restaurant page This is a Sushi Hub restaurant web page, you'll find ancient Japanese foods in our specials section Note: Only large screens